Массивы Javascript (слайдер изображений) (ошибка в Webkit?)

Question

У меня есть слайдер изображений на моем сайте, кажется, он отлично работает в IE, Firefox и Opera. Но это не работает на Chrome и Safari. (Пример: http://tommy -design.nl / ari / index.php )

    <script type="text/javascript"> 
var data = [
["fotos/DSC_0055 (Large).JPG","Duitse herder","fotos/DSC_0055 (Large).JPG"],
["fotos/DSC_0154 (Large).JPG","Duitse herder","fotos/DSC_0154 (Large).JPG"],
["fotos/DSC_0194 (Large).JPG","Duitse herder","fotos/DSC_0194 (Large).JPG"],
["fotos/SSA41896 (Large).jpg","Duitse herder","fotos/SSA41896 (Large).jpg"],
["fotos/DSC_0143 (Large).JPG","Duitse herder","fotos/DSC_0143 (Large).JPG"]
]

imgPlaces = 4 
imgWidth = 230
imgHeight = 122 
imgSpacer = 0

dir = 0 

newWindow = 1


moz = document.getElementById &&! document.all

step = 1
timer = ""
speed = 10
nextPic = 0
initPos = new Array()
nowDivPos = new Array()

function initHIS3()
{
for (var i = 0;i < imgPlaces+1;i++)
{ 
newImg=document.createElement("IMG")
newImg.setAttribute("id","pic_"+i)
newImg.setAttribute("src","")
newImg.style.position = "absolute"
newImg.style.width=imgWidth + "px"
newImg.style.height=imgHeight + "px"
newImg.style.border = 0
newImg.alt =""
newImg.i = i
newImg.onclick = function()
{
his3Win(data[this.i][2])
}
document.getElementById("display").appendChild(newImg)
}

containerEL = document.getElementById("container1")
displayArea = document.getElementById("display")
pic0 = document.getElementById("pic_0")

containerBorder = (document.compatMode == "CSS1Compat"?0:parseInt(containerEL.style.borderWidth) * 2)
containerWidth = (imgPlaces * imgWidth) + ((imgPlaces - 1) * imgSpacer)
containerEL.style.width=containerWidth + (!moz?containerBorder:"") + "px"
containerEL.style.height=imgHeight + (!moz?containerBorder:"") + "px"

displayArea.style.width = containerWidth+"px"
displayArea.style.clip = "rect(0," + (containerWidth+"px") + "," + (imgHeight+"px") + ",0)"
displayArea.onmouseover = function()
{
stopHIS3()
}
displayArea.onmouseout = function()
{
scrollHIS3()
}

imgPos = - pic0.width

for (var i = 0;i < imgPlaces+1;i++)
{
currentImage = document.getElementById("pic_"+i)

if (dir === 0)
{
imgPos += pic0.width + imgSpacer
} 

initPos[i] = imgPos
if (dir === 0)
{
currentImage.style.left = initPos[i]+"px"
} 

if (dir === 1)
{ 
document.getElementById("pic_"+[(imgPlaces-i)]).style.left = initPos[i]+"px"
imgPos += pic0.width + imgSpacer
}

if (nextPic == data.length)
{
nextPic = 0
}

currentImage.src = data[nextPic][0]
currentImage.alt = data[nextPic][1]
currentImage.i = nextPic
currentImage.onclick = function()
{
his3Win(data[this.i][2])
}
nextPic++
}
scrollHIS3()
}

timer = ""
function scrollHIS3()
{
clearTimeout(timer)
for (var i = 0;i < imgPlaces+1;i++)
{
currentImage = document.getElementById("pic_"+i)

nowDivPos[i] = parseInt(currentImage.style.left)

if (dir === 0)
{
nowDivPos[i] -= step
}
if (dir === 1) 
{
nowDivPos[i] += step
}

if (dir === 0 && nowDivPos[i] <= -(pic0.width + imgSpacer) || dir == 1 && nowDivPos[i] > containerWidth)
{

if (dir === 0)
{
currentImage.style.left = containerWidth + imgSpacer + "px"
}
if (dir === 1)
{
currentImage.style.left = - pic0.width - (imgSpacer * 2) + "px"
}

if (nextPic > data.length-1)
{
nextPic = 0
}

currentImage.src=data[nextPic][0]
currentImage.alt=data[nextPic][1]
currentImage.i = nextPic
currentImage.onclick = function()
{
his3Win(data[this.i][2])
}

nextPic++
}
else
{
currentImage.style.left=nowDivPos[i] + "px"
}

}
timer = setTimeout("scrollHIS3()",speed)
}

function stopHIS3()
{
clearTimeout(timer)
}

function his3Win(loc)
{
if(loc === "")
{
return
}
if(newWindow === 0)
{
location = loc
}
else
{
newin = window.open(loc,'win1','left = 430,top = 340,width = 300 ,height = 300')  
newin.focus()
}
}
   </script>

Я почти на 100% уверен, что проблема заключается в массиве, но я не могу понять, в чем именно проблема ..

Заранее спасибо. :)

Answer 1

Попробуйте использовать

 position:relative; 

и перемещение первого слева направо / справа налево (остальные будут следовать соответственно, поскольку родственник скажет им следовать первому изображению)

. Я почти уверен, что это начнет работать на Chrome. как относительная позиция говорит ему использовать разные позиции. при открытии слайдера я обнаружил некоторые ошибки в консоли Chrome: у них все осталось одинаково: это меняется вместе.