PDA

View Full Version : Fade slide show not working in IE



ashipravi
03-13-2012, 07:28 AM
1) Script Title: Slide fade show not working in IE

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm

3) Describe problem: I want the first one only.
My code.

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script type="text/javascript" src="fadeslideshow.js">
<script type="text/javascript">
var mygallery=new fadeSlideShow({
wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
dimensions: [420, 223], //width/height of gallery in pixels. Should reflect dimensions of largest image

<?php
include "config.php";

$qrry = mysql_query("select * from `ban_images` where page ='About Us-Right' ") or die (mysql_error());

?>

imagearray: [
<?php while($row = mysql_fetch_array($qrry)) {?>

["banner/<?php echo $row['image']; ?>", "", "", ""],<?php } ?>

],
displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
descreveal: "ondemand",
togglerid: ""
} )
</script>
</head>
<body>
<div id="fadeshow1"></div>
</body>
</html>

Thanks

jscheuer1
03-13-2012, 08:29 AM
Do I have this right, do you only want one image? That would mean that it would fade in as the page loads and that's it. After that it would just sit there like any other ordinary image.

If that's what you want, and the code you have is working to produce a working slideshow, this (barring any typos or misunderstanding of PHP on my part) should take care of it:


<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script type="text/javascript" src="fadeslideshow.js">
<script type="text/javascript">
var mygallery=new fadeSlideShow({
wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
dimensions: [420, 223], //width/height of gallery in pixels. Should reflect dimensions of largest image

<?php
include "config.php";

$qrry = mysql_query("select * from `ban_images` where page ='About Us-Right' ") or die (mysql_error());
$count = 0;
?>

imagearray: [
<?php while($count++ < 1 and $row = mysql_fetch_array($qrry)) {?>

["banner/<?php echo $row['image']; ?>", "", "", ""]

<?php } ?>
],
displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
descreveal: "ondemand",
togglerid: "",
onslide: function(){this.setting.displaymode.type = 'manual';}
} )
</script>
</head>
<body>
<div id="fadeshow1"></div>
</body>
</html>

Notes: The script code has also been changed at the end. I tried setting it to manual, but that made an error, so I set it to manual after the first slide. No error. The effect is the same. It stops after the first one. We could have it continue on sliding, but with only one image, what's the point?

Don't miss the added comma after the togglerid value.

Also, since there's only one image and there is no comma allowed after the last entry in the image array (only affects IE less than 9 or all IE when the page is in quirks mode), I removed the comma.

Which then gives me the idea that you might only want the one slideshow and you're having trouble getting it to display in IE because you're adding a comma after every entry in the javascript image array. If that's the case, with the same proviso (it was working in other browsers, that I didn't make a typo, etc.), then this should do the trick:


<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script type="text/javascript" src="fadeslideshow.js">
<script type="text/javascript">
var mygallery=new fadeSlideShow({
wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
dimensions: [420, 223], //width/height of gallery in pixels. Should reflect dimensions of largest image
<?php
include "config.php";

$qrry = mysql_query("select * from `ban_images` where page ='About Us-Right' ") or die (mysql_error());
?>
imagearray: [
<?php while($row = mysql_fetch_array($qrry)) {

$images[] = "\t\t" . '["banner/' . $row['image'] . '", "", "", ""]';

}
echo implode(",\n", $images);?>
],
displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
descreveal: "ondemand",
togglerid: ""
} )
</script>
</head>
<body>
<div id="fadeshow1"></div>
</body>
</html>

ashipravi
03-13-2012, 11:08 AM
Thanks for the reply.I want many images to slide.I tried the first slide show in the mentioned link. I got it but some pages it is not working.I think it is due to mysql query problem.


<script type="text/javascript">
var mygallery=new fadeSlideShow({
wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
dimensions: [420, 223], //width/height of gallery in pixels. Should reflect dimensions of largest image
<?php
include "config.php";
$qrry = mysql_query("select * from `ban_images` where page ='About Us-Right' ") or die (mysql_error());
?>
imagearray: [
<?php
$flag = true;
while($row = mysql_fetch_array($qrry)) {
if($flag){
$strImage = '["banner/'.$row['image'].'", "", "", ""]';
$flag = false;
continue;
}
?>
["banner/<?php echo $row['image']; ?>", "", "", ""],
<?php
echo $strImage;
} ?>
],
displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
descreveal: "ondemand",
togglerid: ""
})
</script>

Above code is working . but when we change the query ,mysql_query("select * from `ban_images` where page ='Home-Right' ") or die (mysql_error()); it will not work.

Thanks

jscheuer1
03-13-2012, 03:55 PM
Did you try my second method? It should show all the images.

ashipravi
03-14-2012, 05:32 AM
Yah,I got it sir ..Thanks