Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
$('#slideshow').qCycle({
toLoad: images,
cycleOpts: {
fx: 'fade',
timeout: 3*1000,
pager: '#pagers'
},
createSlide: function (img) {
var data = img.data('qCycle.slideData');
var slide = $('<div>').addClass('slide').append($(img).attr('alt',data.title));
slide.append($('<p>').addClass('caption').text(data.title));
return slide;
}
});
var images = [
{
title:"image two",
img:"http://farm4.static.flickr.com/3337/4597107633_49dc2253ef_o.jpg"
},
{
title:"image three",
img:"http://farm4.static.flickr.com/3358/4597108157_a90ee422a0_o.jpg"
},
{
title:"image four",
img:"http://farm2.static.flickr.com/1421/4597107235_50f51d464a_o.jpg"
},
{
title:"image five",
img:"http://farm5.static.flickr.com/4067/4597722526_6e87fd62bc_o.jpg"
}
];
<div id="slideshow">
<div class="slide">
<img src="http://farm2.static.flickr.com/1243/4597723386_5115429a6e_o.jpg" alt="" />
<p class="caption">This is the first photo. In is defined in the HTML source.</p>
</div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment