2014-07-24 94 views
0

我想添加/刪除.css('overflow-y','hidden')onclick,我做了哪些。當我嘗試刪除該css時,出現此問題,也是onclick。但是這一次,用戶需要點擊另一個元素。點擊添加/刪除溢出隱藏

想法是有模態(Twitter的引導2.3)窗口,其中有一些數據,當用戶點擊模式按鈕(觸發器)的CSS適用於HTML元素,以防止滾動的網站。現在,當我點擊模式(模式關閉)的任何地方,但仍然有overflow-y樣式,因此我無法滾動我的頁面。

所以這就是我所做的,但我一直在這裏卡住,不知道我在哪裏犯錯。任何人都可以幫助我解決這個問題,如果可能的話給我一些建議,以便將來我能保重。

謝謝!

<script type="text/javascript"> 
    $('#myModal').modal('hide')    // initializes and invokes show immediately</p> 
    $('.note').delay(10000).fadeOut('slow'); 

    $(document).ready(function() { 
     var $html = $('html'); 
     var $button = $('.container > .btn-primary'); 
     var $modal = $('.modal-backdrop'); 

     $button.on('click', function(e) { 
      $html.css('overflow-y', 'hidden'); 
      if ($html.attr('style')) { 
       alert('WORKS!'); 
      } 

      else { 
       $modal.onclick(function() { 
        $html.css('overflow-y','scroll'); 
       }); 
      }; 
     }); 

    }); 

    </script> 
+0

你能告訴你的HTML? –

回答

0

你可以使用這樣的:

$button.on('click', function(e) { 
    $html.css('overflow-y','hidden' ? 'scroll' : 'hidden'); 
    e.preventDefault(); 
}) 
+0

我試過這個,但現在它只添加溢出-y滾動。 http://jsfiddle.net/uLv28/ –

0

這裏是題解:

$(document).ready(function() { 
       var $html = $('html'); 
       var $button = $('.container > .btn-primary'); 
       var $modal = $('.modal-backdrop'); 

       $button.on('click', function(e) { 
        $('.note').delay(10000).fadeOut('slow'); 
        $html.css('overflow-y', 'hidden'); 
        if ($html.attr('style')) { 
         console.log("overflow-y: hidden added"); 
        } 
       }); 

       $('#myModal').on('hidden.bs.modal', function() { 
        // do something… 
        console.log("fires myModal"); 
        $html.css('overflow-y','scroll'); 
       }); 
      }); 

     </script>