3

我已经构建了一个滑块，它有两个可能的按钮：一个到.toggle，这个总是可见的，然后.click一个只有在幻灯片打开时才可见，所以我希望它只关闭。问题是当您使用 .toggle 打开并关闭然后尝试使用原始按钮.click重新打开时。.toggle此时需要单击鼠标 2 次。

<script type="text/javascript">

  $(document).ready(function(){

    $(".profile_slide_btn").toggle(

     function(){
       $("#sliding_header").animate({ 
         top: "0px"
       }, 300 );
     }, 

     function(){
      $("#sliding_header").animate({ 
         top: "-600px"
       }, 300 );
  });

 $(".profile_slide_btn2").click(

     function(){
       $("#sliding_header").animate({ 
         top: "-600px"
       }, 300 );
     });
  });

</script>

谢谢你的帮助！！

4

2 回答 2

1

我认为问题在于切换运行一个功能，然后运行另一个，所以因为您使用 关闭.click，但切换不知道，当您.toggle再次单击时，它会尝试先关闭。

可能必须更改您的逻辑以手动执行切换而不是依赖该.toggle功能。

编辑：所以是这样的（注意这是未经测试的，你可能会遇到在动画过程中点击东西会导致奇怪的问题）：

<script type="text/javascript">

    $(document).ready(function(){

        $(".profile_slide_btn").click(
            function(){
                if ($("#sliding_header").css("top") == "0px") {
                    hideHeader();
                } else {
                    showHeader();
                }
            });

        $(".profile_slide_btn2").click(hideHeader);

        function showHeader() {
            $("#sliding_header").animate({ top: "0px" }, 300 );
        }

        function hideHeader() {
            $("#sliding_header").animate({ top: "-600px" }, 300 );
        }
    });

</script>
于 2009-12-23T22:14:04.920 回答
0

那是因为 .toggle 不知道滑块已关闭。

  1. 使用工具打开：0px
  2. 点击关闭：-600px
  3. Toggle 仍然认为你打算关闭，所以：再次 -600px

使用 if 可以知道滑块的 top 属性何时为 -600px，何时为 0，这样您就知道何时关闭和何时打开。

于 2009-12-23T22:17:13.713 回答