Created
October 29, 2012 07:05
-
-
Save jlyu/3972050 to your computer and use it in GitHub Desktop.
Learning jQuery -7
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//$.fn.cycle.defaults.random = true; | |
$(document).ready(function(){ | |
$('#books').cycle({ | |
timeout: 1000, | |
delay: -1000, // (1) | |
speed: 1500, | |
pause: true, | |
before: function(){ | |
$('#slider').slider({animate:true}); // (4) | |
$('#slider').slider({range:"min"}); | |
$('#slider').slider('value', $('#books li').index(this)); | |
}, | |
after: function(){ // (5) | |
var maxSliderPage = $('#books li').length - 1; | |
var currSliderPage = $('#books li').index(this); | |
if (currSliderPage == maxSliderPage) { | |
$('#books').cycle('stop'); | |
$('#slider').slider('disable'); | |
$('button').button("option", "disabled", true); | |
} | |
} | |
}); | |
$('<div id="books-controls"></div>').insertAfter('#books'); | |
$('<div id="slider"></div>').slider({ | |
min : 0, | |
max : $('#books li').length - 1, | |
slide: function(event, ui){ | |
$('#books').cycle(ui.value); | |
} | |
}).appendTo('#books-controls'); | |
$('<button>Pause</button>').click(function(){ | |
$('#books').cycle('pause'); | |
$.cookie('cyclePaused', 'y', {expires: 30}); // (2) | |
return false; | |
}).button({ | |
icons: {primary: 'ui-icon-pause'} | |
}).appendTo('#books-controls'); | |
$('<button>Resume</button>').click(function(){ | |
var $paused = $('ul:paused'); | |
if ($paused.length) { | |
$paused.cycle('resume'); | |
$.cookie('cyclePaused', null); | |
} | |
else { | |
$(this).effect('shake', { | |
distance: 10, | |
duration: 80 | |
}); | |
} | |
return false; | |
}).button({ | |
icons: {primary: 'ui-icon-play'} | |
}).appendTo('#books-controls'); | |
if($.cookie('cyclePaused')) { | |
$('#books').cycle('pause'); | |
} | |
$('#books .title').resizable({grid : 10}); // (3) | |
$('#books').hover(function(){ | |
$('#books .title').animate({ | |
backgroundColor: '#eee', | |
color: '#000' | |
}, 1000); | |
}, function(){ | |
$('#books .title').animate({ | |
backgroundColor: '#000', | |
color: '#fff' | |
}, 1000); | |
}); | |
$('h1').click(function(){ | |
$(this).toggleClass('highlighted', 'slow', 'easeInExpo'); | |
}); | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment