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: 207
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