【问题标题】:deactivate button on gallery slider停用画廊滑块上的按钮
【发布时间】:2011-05-24 23:36:47
【问题描述】:

我正在尝试使我的 javascript/jquery 滑块按钮在到达滚动图像的末尾时停用(当图像一直向右移动时,MoveRight 按钮必须停用并且只留下 MoveLeft按钮处于活动状态,与移动 LeftButton 相同),有人可以帮忙吗?我不确定我是否使用 .attr() 和 removeAttr() 正确。我在下面粘贴了我的代码。

<script type="text/javascript">
$(document).ready(function(){

//Check width of Gallery div
var galleryWidth = $("#Gallery").innerWidth();
//Check width of GalleryItem
var NoListed = $("ul.GalleryItem li").length;
var galleryItemWidth = 1881;    

$('.MoveRight')
$('.GalleryItem').css('width', galleryItemWidth);

//Check width of Gallery div on resize
$(window).resize(function(){
    var galleryWidth = $("#Gallery").innerWidth();
  });

$('.MoveLeft').click(function() {
  $(".GalleryItem2").animate({"left": "-=350px"}, "slow");
  $(".GalleryItem3").animate({"left": "-=280px"}, "slow");
  $(".GalleryItem").animate({
    left: '-=230',
  }, "slow", function() {
    position = $(".GalleryItem").position();
    galleryItemLeft = position.left;
    if(galleryItemLeft <= galleryWidth - galleryItemWidth) {
        $('.MoveLeft').removeAttr('disabled');}
        else{
        $('.MoveLeft').attr('disabled','disabled');
        $('.MoveRight').attr('disabled','disabled');
    }
  });
});

$('.MoveRight').click(function() {
  $(".GalleryItem2").animate({"left": "+=350px"}, "slow");
  $(".GalleryItem3").animate({"left": "+=280px"}, "slow");
  $(".GalleryItem").animate({
    left: '+=230',
  }, "slow", function() {
    position = $(".GalleryItem").position();
    galleryItemLeft = position.left;
    if(galleryItemLeft >= "0") { 
        $('.MoveLeft').removeAttr('disabled');}
        else{
        $('.MoveLeft').attr('disabled','disabled');
        $('.MoveRight').attr('disabled','disabled');
    }   
  });
});

});


</script>

【问题讨论】:

  • 那么你现在的结果到底是什么?
  • 它向左和向右滑动但是当它满足条件时没有禁用任何按钮。

标签: javascript


【解决方案1】:

好的,首先删除这个逗号;

left: '-=230',
-------------^

并在此处添加像素

left: '-=230px'
------------^

然后尝试添加这个;

if(galleryItemLeft <= 0) { 
    return false;
}

就在$('.MoveLeft').click(function() {之后
对的也一样

【讨论】:

  • 谢谢约翰。它对滑块没有影响。你的意思是把条件放在函数的上面还是下面(之后)?还有其他想法吗?
  • 就在你开始滑动之前,这样函数将返回并跳过块的其余部分
  • 当我在那里添加条件时,它会导致滑块停止工作,它不再滑动。知道为什么吗?
  • 这就是 return false 正在做的事情,那么你的 if 语句中的条件有问题
  • 我使用 .removeAttr('disabled');} 和 .removeAttr('disabled');} 正确吗?
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-11-18
  • 1970-01-01
  • 2021-04-08
  • 2012-08-27
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多