1
嘿,
我有一个和上一个按钮一个简单的工作滑块。
什么IAM的尝试:
- 相反的下一步和上一个按钮,我实现幻灯片总数=按钮
JS:
$(function(){
var slideCount = $('#slider ul li').length;
var slideWidth = $('#slider ul li').width();
var slideHeight = $('#slider ul li').height();
var sliderUlWidth = slideCount * slideWidth;
$('#slider').css({ width: slideWidth, height: slideHeight });
$('#slider ul').css({ width: sliderUlWidth, marginLeft: - slideWidth });
$('#slider ul li:last-child').prependTo('#slider ul');
function moveLeft() {
$('#slider ul').animate({
left: + slideWidth
}, 200, function() {
$('#slider ul li:last-child').prependTo('#slider ul');
$('#slider ul').css('left', '');
});
};
function moveRight() {
$('#slider ul').animate({
left: - slideWidth
}, 200, function() {
$('#slider ul li:first-child').appendTo('#slider ul');
$('#slider ul').css('left', '');
});
};
$('a.control_prev').click(function(){moveLeft();});
$('a.control_next').click(function(){moveRight();});
});
例子:
我的朋友,你有没有根据改变了你的CSS设计,设置#slider li宽度等于#slider的宽度... http://jsfiddle.net/broh3w2k/4/ –