Javascript 简单jquery滑块
我正在使用mousewheel jQuery插件并尝试创建一个简单的滑块。下面是一个示例,但滑块“下一步”和“上一步”按钮工作不正常Javascript 简单jquery滑块,javascript,jquery,slider,Javascript,Jquery,Slider,我正在使用mousewheel jQuery插件并尝试创建一个简单的滑块。下面是一个示例,但滑块“下一步”和“上一步”按钮工作不正常 $('.container')。鼠标滚轮(函数(事件,增量){ 这个.scrollLeft-=(增量*40); event.preventDefault(); }); //下一个和上一个选项 //上 $('.prev')。单击(函数(){ $('.storepos').val($('.storepos').val()/1-110); $('.container'
$('.container')。鼠标滚轮(函数(事件,增量){
这个.scrollLeft-=(增量*40);
event.preventDefault();
});
//下一个和上一个选项
//上
$('.prev')。单击(函数(){
$('.storepos').val($('.storepos').val()/1-110);
$('.container').animate({scrollLeft:$('.storepos').val()},200);
});
//下一个
$('.next')。单击(函数(){
$('.storepos').val($('.storepos').val()/1+110);
$('.container').animate({scrollLeft:$('.storepos').val()},200);
});代码>
.container{overflow-x:scroll}
.content{宽度:1600px}
.项目{背景:黑色;
颜色:白色;
左边距:10px;
宽度:100px;
高度:100px;
浮动:左;
文本对齐:居中
}
1.
2.
3.
4.
5.
6.
7.
8.
9
10
/
通过storepos元素的if语句,在onclick函数中检查值
上一个按钮
$('.prev').click(function(){
var storepos = $(".storepos").val();
if(storepos == 0){
//Do nothing
}else{
$('.storepos').val($('.storepos').val() / 1 - 110);
$('.container').animate({scrollLeft:$('.storepos').val()}, 200);
}
});
下一步按钮
$('.prev').click(function(){
var storepos = $(".storepos").val();
if(storepos == 0){
//Do nothing
}else{
$('.storepos').val($('.storepos').val() / 1 - 110);
$('.container').animate({scrollLeft:$('.storepos').val()}, 200);
}
});
已更新
$('.next').click(function(){
var storepos = $(".storepos").val();
var maxLength = (($(".items").length * 110) / 2);
if(storepos == maxLength){
//Do nothing
}else{
$('.storepos').val($('.storepos').val() / 1 + 110);
$('.container').animate({scrollLeft:$('.storepos').val()}, 200);
}
});
在onclick函数中通过storepos元素的if语句检查值。它应该可以工作是的,但是如何修复它呢?我是javascript新手。同样,只需使用550值,因为您可以看到第10个元素的值是550No,我不希望这样。还有其他选择吗?你说的“我不想那样”是什么意思?我创建了一个动态添加或删除项目选项,所以“下一步”按钮需要自动检测。我想你明白了。所以很容易计算。。。计算元素的数量,然后乘以110=最大长度的值