1.cycle幻灯片
.cycle();
//books结构 ul li
$('#books').cycle();
$('#books').cycle({
timeout:2000,
speed:500,
pause:true
});
//设置初始默认值
$.fn.cycle.defaults.timeout = 10000;//切换频率
$.fn.cycle.defaults.random = true;//是否随机切换
$('#books').cycle({
timeout: 2000,//会覆盖默认的切换频率
speed: 500,
pause: true
})
var $books = $('#books');
var $controls = $('<div id="books-controls"></div>').insertAfter($books);
$('<button>Pause</button>').click(function (e) {
e.preventDefault();
$books.cycle('pause');
}).appendTo($controls);
// $('<button>Resume</button>').click(function (e) {
// e.preventDefault();
// $books.cycle('resume');
// }).appendTo($controls);
//假如有多组幻灯片,一键恢复
$('<button>Resume</button>').click(function(e) {
e.preventDefault();
$('ul:paused').cycle('resume');//恢复所有被暂停的幻灯片
}).appendTo($controls);
2.cookie
.cookie();
//设置cookie
if ($.cookie('cyclePaused') == null) {//如果存在暂停cookie
$books.cycle('pause');
}
var $controls = $('<div id="books-controls"></div>').insertAfter($books);
$('<button>Pause</button>').click(function (e) {
e.preventDefault();
$books.cycle('pause');
//$.cookie('cyclePaused', 'y');//设置暂停cookie
$.cookie('cyclePaused', 'y', {//设置暂停cookie
path: '/',//全站点允许访问
expries: 7//过期期限为7天
});
}).appendTo($controls);
$('<button>Resume</button>').click(function (e) {
e.preventDefault();
$books.cycle('resume');
$.cookie('cyclePaused', null);//清除暂停cookie
}).appendTo($controls);
3.JqueryUI
$books.hover(function () {
$books.find('.title').animate({
backgroundColor: '#eee',
color: '#000'
}, 1000);
}, function () {
$books.find('.title').animate({
backgroundColor: '#000',
color: '#fff'
}, 1000)
})
$('h1').click(function(){
$(this).toggleClass('highlighted','slow');//动态添加/移除类
$(this).toggleClass('highlighted', 'slow','easeInExpo');//动态添加/移除类
//easeInExpo:先慢后快完成整个变换
})
$books.find('.title').resizable();//调节大小
来源:https://www.cnblogs.com/Med1tator/p/7472819.html