PDA

View Full Version : Ultimate Fade-in slideshow (v2.4)



sb2011
12-06-2011, 09:06 PM
Hello!

I'm using this script on my website its playing fine in Windows XP, MAC but in Windows 7( IE 8) the slideshow is not playing. can you tell me how to get rid of this?

is the Doctype matters?
Please help me at your earliest. Thanks in advance.

jscheuer1
12-06-2011, 10:37 PM
Please post new questions in a new thread like here where I've moved this, and:

Warning: Please include a link to the DD script(s) in question in your post. See this post (http://www.dynamicdrive.com/forums/showpost.php?p=7) for more information.

That said -

The DOCTYPE used is OK as far as the script goes.

I have IE 9 on my Win 7, and in its IE 8 mode I'm not noticing anything that I would want to get rid of. Perhaps I need an actual IE 8 to see it, or because I'm viewing it for the first time I'm not noticing the problem.

But, get rid of what? What is it that you want to get rid of?

sb2011
12-07-2011, 12:20 AM
Hello Sir,
http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm

I've made my own page using this code, the page url of mine I've posted earlier.

the slideshow is not playing on certain computers having "Windows 7 Operating system"
how to fix that? any help would be great!

this is one of the best and simple to use slideshow, some of my clients cannot view the slideshow in their computer. what will be the reason? plz see. Thanks.

jscheuer1
12-07-2011, 02:23 AM
The problem isn't Windows 7. It's a combination of IE 8 and the overuse of css positioning. It also appears to be a problem in IE 7. Both IE 6 and IE 9 are fine. Which IE are you running on XP? Is it 6?

Anyways, I found the slideshow would show up in IE 7 and 8 if I added the highlighted as shown:


. . . descreveal: "ondemand",
togglerid: ""
})


//]]>
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="home_style.css" />
<!--[if (gt IE 6) & (lt IE 9)]>
<style type="text/css">
#roof {
position: absolute !important;
height: 666px !important;
}
</style>
<![endif]-->
<title>:::Welcome to eastdessertfirst!:::</title>
</head>
<body>

<div id="header"><a href="http://www.facebook.co . . .

sb2011
12-07-2011, 01:29 PM
Thanks a lot Sir for your help, I'm going to add this script and see if it can solve the problem.

Yes Sir, I'm using Windows XP with IE6. In my computer the slideshow playing nicely, in IE6, Google chrome and Firefox.

Thanks again.
regards

sb2011
12-08-2011, 06:53 PM
The problem isn't Windows 7. It's a combination of IE 8 and the overuse of css positioning. It also appears to be a problem in IE 7. Both IE 6 and IE 9 are fine. Which IE are you running on XP? Is it 6?

Anyways, I found the slideshow would show up in IE 7 and 8 if I added the highlighted as shown:


. . . descreveal: "ondemand",
togglerid: ""
})


//]]>
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="home_style.css" />
<!--[if (gt IE 6) & (lt IE 9)]>
<style type="text/css">
#roof {
position: absolute !important;
height: 666px !important;
}
</style>
<![endif]-->
<title>:::Welcome to eastdessertfirst!:::</title>
</head>
<body>

<div id="header"><a href="http://www.facebook.co . . .

Dear Sir,

The above code worked on this page. But if I want to use it on another page where my slideshow is positioned in another place then how to write this code?
<!--[if (gt IE 6) & (lt IE 9)]>
<style type="text/css">
#roof {
position: absolute !important;
height: 666px !important;
}
</style>
<![endif]-->

??

help please.
regards

jscheuer1
12-08-2011, 09:57 PM
I'm not sure. As I said, it's also partly because on that page there's so much css positioning being used. If a page is designed with less css positioning (as is normally the case), it probably won't be an issue at all.

For example, on the demo page for the script there are 4 slideshows in 4 different places and no special code is required for them to show up in IE 8.

sb2011
12-09-2011, 09:49 PM
Thanks Sir, but can please tell me why you have given this? "height:666px" I've used this same code in my another page, but half of the image is displaying there. How to solve that?

I've used the slideshow under this absolutely positioned div
#roof{
position: absolute;
left: -7px;
height: 300px;
width: 300px;
top:10px;
display: inline;
}

what should be height in this case? Hope to hear from you soon. Many thanks.

jscheuer1
12-09-2011, 11:10 PM
As I said, I'm not sure. I figured out the first one via trial and error.

A little background - The script itself changes the absolute positioning of the wrapperid element (#roof in this case, right?) to relative. And its dimensions to those listed in the on page call. Now its left and top properties are relative to wherever it would have been if it were not positioned, and it's taking up layout space. Absolutely positioned elements take up no layout space and their left and top properties are relative to their first positioned parent, or if none, the body.

None of this seems to phase other browsers, and/or it's actually helpful to them in presenting the slideshow. But IE 7 and 8 are a different story.

So rather than figure all that out mathematically, I just guessed. I found if I overrode the script and enforced absolute positioning with the !important keyword, at least the slideshow could be seen. But not all of it. I then discovered that if I increased the height, more of it showed up. 666px is just what worked out to be about right.

So, assuming the same sort of thing is going on with this other page you would need to do the same on it:


<!--[if (gt IE 6) & (lt IE 9)]>
<style type="text/css">
#roof {
position: absolute !important;
height: 666px !important;
}
</style>
<![endif]-->

Only the red 666 might need to be another value. Take your best guess. If part of the show is still missing, increase the number. If there's too much blank space, decrease it.