在jquery中为.animate设置边界

我在jquery中有一个基本的滑块，由一个left_arrow和right_arrow div组成，它们都控制包含一个长.png的我的#screens div的'left'值。每个屏幕宽度为543px。在jquery中为.animate设置边界

$pr('#arrow_left').click(function() { 
    $pr('#screens').animate ({"left": "+=543px"}, "fast"); 
}); 
$pr('#arrow_right').click(function() { 
    $pr('#screens').animate ({"left": "-=543px"}, "fast"); 
});

的滑动操作工作正常，但我想为#screens“左”值设为最小值和最大值，因此箭不会采取超越用户在任何方向上的图像。

来源

2011-11-18 user1054409

是屏幕div包含在一个固定的宽度div与溢出：隐藏？ – dSquared

var max = 543 * 10; //10 slides, for example 
var current = 0; 
$pr('#arrow_left').click(function() { 
    if(current < 0) 
    { 
     current += 543; 
     $pr('#screens').animate ({"left": current + "px"}, "fast"); }); 

    } 
}); 

$pr('#arrow_right').click(function() { 
    if(current > max) 
    { 
     current -= 543; 
     $pr('#screens').animate ({"left": current + "px"}, "fast"); 

    } 
});

来源

2011-11-18 20:24:34

此解决方案还解决了每次单击左键时绑定新的“右键”单击事件的问题，这会导致一些意外行为。 – Dave

var max应该表示总幻灯片，如果将其写入dom，则可以通过jQuery轻松收集这些幻灯片。 –

凯清的回答是真棒:)我做了它的变化对自己的需要，并增加了jQuery的的最大变量，它会改变基于滑块多少直接孩子<div>的都有，所以你从来没有编辑它一旦它的设置:)

我就离开的代码片段在这里柜面有人需要它：对

$(document).ready(function(){ 
var max = 275 * $('.slider-wrap > div').length; //change div to whatever element wraps each individual piece of content you're sliding. 
var current = 0; 
$('.left').click(function() { 
if(current < max){ 
    alert(current); 
    current += 275; 
    $(".slider-wrap").animate({marginLeft:current + 'px'},'slow'); 
    } 
}); 
$('.right').click(function() { 
if(current > 0){ 
    alert(current); 
    current -= 275; 
    $(".slider-wrap").animate({marginLeft:current + 'px'},'slow'); 
    } 
});

}）;

来源

2015-05-20 08:08:17

在jquery中为.animate设置边界

回答

相关问题