滑動固定股利

我看着，你必須對錨錨和onclick事件的例子顯示了一個隱藏的div如下所示：http://jsfiddle.net/apaul34208/SW6Mv/6/滑動固定股利

不過我已經想有在底部的固定面板我從瀏覽器的一側跨越到另一側。基本上是這樣的100％寬度：
enter image description here

而當我按下按鈕（半圈）面板滑出。
enter image description here

但是因爲我的面板固定在頁面與底部：

#panel { 
    position: fixed; 
    left:0; 
    bottom:0; 
    z-index:1000; 
    width:100%; 
    background:#FFFFFF; 
}

從jQuery的不會工作滑出。主要的問題是，因爲這是固定的底部，即使我可以滑動第二個div的主要股利總是超過它的頂部，而它應該已經滑落。如何讓我的div粘貼到頁面的底部，但是當按下按鈕時，它會向下滑動，因爲第二個div會出現在下面。

來源

2014-02-09 Sterling Duchess

例如下面的代碼可以幫助你。簽出jsfiddle代碼。示例代碼：http://jsfiddle.net/Q3yR8/1/

HTML代碼：

<section id="header-bar" class="txt-highlight-color bg-color bg-pattern"> 
    <span id="close-bar" class="hide-bar">close button</span> 
</section>

CSS代碼：

#header-bar {position:fixed; bottom:0; left:0; width:200px; background-color:grey; height:50px;} 
#close-bar { position:absolute; top:-20px; background:red; color:white;}

JS代碼

var speed = 300; 
     $('#close-bar').on('click', function(){ 

      var $$ = $(this); 

      if($$.is('.hide-bar')){ 
       $('#header-bar').animate({bottom:-50}, speed); 
       $$.removeClass('hide-bar') 
      } else { 
       $('#header-bar').animate({bottom:0}, speed); 
       $$.addClass('hide-bar') 
      } 

     });

來源

2014-02-09 15:30:35

您可以設置底部屬性-100px（例如）隱藏元素，然後，利用.animate()以顯示它：

$('.circle').on('click', function(){ 
    $('#panel').animate({bottom: '100px'}); 
});

來源

2014-02-09 15:23:33 Codel

滑動固定股利

回答

相關問題