Question

我的左侧栏有问题，我需要在点击时填充侧边栏但是当我运行我的代码时，我必须双击我的“显示菜单”来获取我的菜单...我是什么做错了？

       $(document).ready(function () {

       var slider_width = $('.menucont').width(); //get width automaticly
       $('#pollSlider-button').click(function () {
           if ($(this).css("margin-right") == slider_width + "px" && !$(this).is(':animated')) {
               $('.menucont,#pollSlider-button').animate({
                   "margin-right": '-=' + slider_width
               });

               $(".menucont").show();

               $(".showmenu").css("display", "none");
                               $(".hidemenu").show();



           } else {
               if (!$(this).is(':animated')) //perevent double click to double margin
               {
                   $('.menucont,#pollSlider-button').animate({
                       "margin-right": '+=' + slider_width

                   });
                   $(".showmenu").show();

                   $(".menucont").hide();
                   $(".hidemenu").css("display", "none");

               }
           }


       });
   });

我也有一个小提琴网址 http://jsfiddle.net/6834Y/

任何帮助都会很棒

Answer 1

你只需要像这样设置你的div：

<div id="pollSlider-button" style="margin-right: 77px;">

而不是：

<div id="pollSlider-button" style="margin-right: 0px;">

工作小提琴：http://jsfiddle.net/robertrozas/6834Y/1/

Answer 2

第一次点击时

$(this).css("margin-right")

返回0，否则它将进入else块，否则你将执行

$('.menucont,#pollSlider-button').animate({
                   "margin-right": '+=' + slider_width

               });

所以当点击下一步时，菜单会显示出来。

您可以将if循环更改为

if (($(this).css("margin-right") == slider_width + "px" && !$(this).is(':animated')) || $(this).css("margin-right") == "0px")

侧边栏双击而不是单击

2 个答案:

工作小提琴：http://jsfiddle.net/robertrozas/6834Y/1/