1

上からdiv を使用したこの例がshow / hideありますが、下から上にそれが必要です。コードを変更しようとしましたが、変更できず、例が見つかりませんでした。

<script type="text/javascript">
$(document).ready(function(){
    $(".btn-slide").click(function(){
        $("#panel").slideToggle("slow");
        $(this).toggleClass("active"); return false;
    });
});
</script>

スライド パネル

<div id="panel">
    <!-- you can put content here -->
</div>
4

3 に答える 3

0

jqueryでanimateオプションを使用したい場合があります。コードは次のとおりです

HTML

<button class="btn-slide">Some Text</button>
<div id="box">
<div id="panel">Sample Text here<br/> Sample Text here<br/>Sample Text here</div>
</div>

CSS

#box
{
height: 100px;
width:200px;
position:relative;
border: 1px solid #000;
}
#panel
{
position:absolute;
bottom:0px;
width:200px;
height:20px;
border: 1px solid red;
display:none;
}

Jクエリ

var panelH = $('#box').innerHeight();
$(".btn-slide").click(function(){
$("#panel").stop(1).show().height(0).animate({height: panelH},500);
});
});
于 2013-04-03T10:07:04.397 に答える