Skip to content

Instantly share code, notes, and snippets.

@jeffreynolte
Created August 30, 2012 16:56
Show Gist options
  • Save jeffreynolte/3533176 to your computer and use it in GitHub Desktop.
Save jeffreynolte/3533176 to your computer and use it in GitHub Desktop.
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Your Website</title>
</head>
<body>
<div id="s1" class="pics">
<img src="http://cloud.github.com/downloads/malsup/cycle/beach1.jpg" width="200" height="200" />
<img src="http://cloud.github.com/downloads/malsup/cycle/beach2.jpg" width="200" height="200" />
<img src="" data-src="http://cloud.github.com/downloads/malsup/cycle/beach4.jpg" width="200" height="200" />
<img src="" data-src="http://cloud.github.com/downloads/malsup/cycle/beach5.jpg" width="200" height="200" />
<img src="" data-src="http://cloud.github.com/downloads/malsup/cycle/beach6.jpg" width="200" height="200" />
<img src="" data-src="http://cloud.github.com/downloads/malsup/cycle/beach7.jpg" width="200" height="200" />
<img src="" data-src="http://cloud.github.com/downloads/malsup/cycle/beach8.jpg" width="200" height="200" />
</div>
<script>
$('#s1').cycle({
fx: 'shuffle',
speed: 'fast',
timeout: 0,
next: '#next2',
prev: '#prev2',
before: function(currSlideElement, nextSlideElement, options, forwardFlag) {
if ($(nextSlideElement).attr('data-src')) {
$(nextSlideElement).attr("src", $(nextSlideElement).attr("data-src"));
}
},
after: function(currSlideElement, nextSlideElement, options, forwardFlag) {
if ($(nextSlideElement).attr("data-src")) {
$(nextSlideElement).attr("src", $(nextSlideElement).attr("asrc"));
}
}
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment