Fade-in slideshow clashing with jcarousel [Archive]

londontyler

05-18-2010, 12:31 PM

Hi,

I am running the Ultimate Fade-in slideshow that utilises Jquery, alongside the jcarousel plug-in for Jquery.

When i run them separately they work fine, but put together on the same page and they are not running. I have tried placing the scripts in different orders in the head with no joy.

carousel on it's own - http://www.dave-tyler.co.uk/test/carousel.html

Fade-in on it's own - http://www.dave-tyler.co.uk/test/fadeslideshow.html

Together - http://www.dave-tyler.co.uk/test/bothscripts.html

The code in the head section is:

<head>

<link href="css/maintest.css" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>


<script type="text/javascript" src="js/jCarouselLite.js"></script>
<script type="text/javascript">

$(document).ready(
function(){
$(".carousel").jCarouselLite({
auto: 1500,
speed: 3000
});
});
</script>


<script type="text/javascript" src="js/fadeslideshow.js"></script>
<script type="text/javascript">

var mygallery=new fadeSlideShow({
wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
dimensions: [364, 274], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
["images/sale2.jpg", "", "", "" ],
["images/sale2.jpg", "", "", "" ],
["images/sale3.jpg", "", "", ""],
["images/sale4.jpg", "", "", ""] //<--no trailing comma after very last image element!
],
displaymode: {type:'auto', pause:3000, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
descreveal: "always",
togglerid: ""
})

</script>

</head>

any ideas why this is happening?

azoomer

05-18-2010, 03:00 PM

Guessing there is some conflict i tried to change a part of your script replacing $ with jQuery like this

<script type="text/javascript">

jQuery(document).ready(
function(){
jQuery(".carousel").jCarouselLite({
auto: 1500,
speed: 3000
});
});
</script>
on my computer it got both shows running. You can try to see if it works. If not it may be an idea to try to make a new variable in jQuery noconflict mode. But i don't know much about that.