Slideshow positioning problem

Posted by James on Stack Overflow See other posts from Stack Overflow or by James
Published on 2011-01-17T02:50:04Z Indexed on 2011/01/17 2:53 UTC
Read the original article Hit count: 210

Filed under:
|
|

I have a javascript slideshow that works perfectly on Windows 7, Firefox, Chrome, IE 8+ (I don't have the resources to check 6 or 7) and Opera. But I've been told that when on xp with IE 7 the slidshow gets thrown off screen to the right. What could my issue be?

Here is my css:

#page {

width:940px; margin: auto; }

gallery {

position:relative; padding:0px; margin:5px 0px; width:940px; height:320px; }

gallery li {

display: block; width:940px; height:320 list-style:none; }

And here is my javascript:

var galleryId = 'gallery'; var gallery; var galleryImages; var currentImage; var previousImage; var preInitTimer; preInit();

function preInit() {

if ((document.getElementById)&&(gallery=document.getElementById(galleryId))) { gallery.style.visibility = "hidden"; if (typeof preInitTimer != 'undefined') clearTimeout(preInitTimer); } else { preInitTimer = setTimeout("preInit()",2); } }

function fader(imageNumber,opacity) {

var obj=galleryImages[imageNumber]; if (obj.style) { if (obj.style.MozOpacity!=null) {

obj.style.MozOpacity = (opacity/100) - .001; } else if (obj.style.opacity!=null) {

obj.style.opacity = (opacity/100) - .001; } else if (obj.style.filter!=null) {

obj.style.filter = "alpha(opacity="+opacity+")"; } } }

function fadeInit() { if (document.getElementById) { preInit(); galleryImages = new Array; var node = gallery.firstChild;

while (node) { if (node.nodeType==1) { galleryImages.push(node); } node = node.nextSibling; } for(i=0;i

galleryImages[i].style.position='absolute'; galleryImages[i].style.top=0; galleryImages[i].style.zIndex=0;

fader(i,0); }

gallery.style.visibility = 'visible';

currentImage=0; previousImage=galleryImages.length-1; opacity=100; fader(currentImage,100);

window.setTimeout("crossfade(100)", 1000); } }

function crossfade(opacity) { if (opacity < 100) {

fader(currentImage,opacity);

opacity += 9; window.setTimeout("crossfade("+opacity+")", 50); } else {

fader(previousImage,0);

previousImage=currentImage; currentImage+=1; if (currentImage>=galleryImages.length) {

currentImage=0;

}

galleryImages[previousImage].style.zIndex = 0; galleryImages[currentImage].style.zIndex = 100;

opacity=0; window.setTimeout("crossfade("+opacity+")", 5000); } }

addEvent(window,'load',fadeInit)

function addEvent(elm, evType, fn, useCapture)

{ if (elm.addEventListener){ elm.addEventListener(evType, fn, useCapture); return true; } else if (elm.attachEvent){ var r = elm.attachEvent("on"+evType, fn); return r; } }

And ideas?

© Stack Overflow or respective owner

Related posts about JavaScript

Related posts about html