0

我正在尝试slideToggle在 JQuery 中创建效果。我有一个 div 定位为：

someDiv {
   position : absolute;
   bottom : 100px; 
}

$("#someDiv").slideToggle();现在，当点击触发函数 ( ) 时，div从底部向上滑动而不是显示或向下滑动。

我希望它在如上定位时从 TOP 正常下降。我怎么做？我已经读过从底部定位可以产生这种效果，但在任何地方都找不到解决方案。

任何帮助将非常感激。

4

2 回答 2

2

您可以将函数与窗口resize事件结合使用，使用 CSS 属性从底部动态定位 div 100px，top以便slideToggle()按照您想要的方式进行操作：

CSS

#theDiv {
  position : absolute;
}​

HTML

<button>Toggle</button>
<div id="theDiv">...<div>​

JS

// Positions Div From Bottom //
function positionDiv($target, fromBottom){
    $target.css({
        top: $(window).height() - fromBottom
    });
}

// Bind positionDiv() to Window Resize and Trigger at Start //
$(window).resize(function(){
    positionDiv($('#theDiv'), 100);
}).trigger('resize');

// Bind Toggle to Button //
$('button').on('click', function(){
    $('#theDiv').slideToggle();
});​

在这里演示

我希望这有帮助！

于 2012-07-21T15:15:55.407 回答
0

那这个呢？ http://jsfiddle.net/fZGGG/6/

于 2012-07-21T15:17:07.740 回答