gpt4 book ai didi

jquery - 向上单击动画标题栏,向下滑动面板打开,如何再次单击以动画向下凸起的栏并关闭面板?

转载 作者:太空宇宙 更新时间:2023-11-04 04:32:17 25 4
gpt4 key购买 nike

我有一个带有标题栏和下方面板的容器,该面板在单击标题栏之前一直处于隐藏状态,然后它会向下滑动面板并将标题栏提升几个像素。这很好用。打开后我需要做的是单击标题栏并让它回到其起始位置,同时仍然关闭面板并再次隐藏。当我打开后单击标题栏时,面板关闭并消失,但标题栏仍保持在升高的位置(因为我没有什么可以将其降低)。我尝试了几种不同的选择。

html

<div id="specialsEventsContainer" style="float:left">
<div id="specialsEventsTitle" style="top: 90px">
<p>Specials & Events</p></div>
<div class="promobox">
<div id="revealDown" style="height: 0; display:block;">

<div id="specialscalendarPortals">
<div class="halfsizeBoxes" style="float:left">
<a href=""><p>text text text</p></a>
</div>
<div class="halfsizeBoxes">
<a href=""><p>Tulalip Resort-Casino Calendar Portal</p></a>
</div>
</div>
<div class="fullsizeBoxes">
<a href=""><img src="~/Content/Images/promoimage.jpg" /></a>
</div>
<div class="fullsizeBoxes">
<a href=""><img src="~/Content/Images/promoimage.jpg" /></a>
</div>
<div class="fullsizeBoxes" style="margin-bottom:5px;">
<a href=""><img src="~/Content/Images/promoimage.jpg" /></a>
</div>
</div>
</div>

jquery

     <script type="text/javascript">
$(document).ready(function () {

var $spTitle = $('#specialsEventsTitle');
var $promobox = $('#revealDown');

$($spTitle).click(function () {
$spTitle.animate({ top: '8px' });

if ($promobox.height() > 0) {
$promobox.animate({ height: 0 });
} else {
$promobox.animate('slow').animate({ height: '100%' });
}
});
});
</script>

最佳答案

而不是这个:

$spTitle.animate({ top: '8px' });

使用这个:

if (parseInt($spTitle).css('top') > 0 )
$spTitle.animate({ top: '0px' });
else
$spTitle.animate({ top: '8px' });

关于jquery - 向上单击动画标题栏,向下滑动面板打开,如何再次单击以动画向下凸起的栏并关闭面板?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17071903/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com