我有这个page如果您滚动到中间,您将看到一个选择送货方式
下拉列表,然后单击它。它将向下推送查看条款和条件
链接...这是我的代码
HTML
<div class="shipping-box lf">
<div class="ship-box1 lf">
<div class="sel-ship lf">
<div class="ss lf">
<span class="lf">Select Shipping Method</span>
<a class="ship-btn" href="#"></a>
</div>
<div class="dropdown lf" style="display:none;">
<ul>
<li class="ss-1 lf">1 Location</li>
<li class="ss-2 lf">2 Location</li>
</ul>
</div>
</div>
<div class="terms lf">Review Terms & Conditions</div>
</div>
CSS
.shipping-box {
height: 65px;
padding-top: 0;
position: relative;
width: 700px;
}
.lf {
float: left;
}
.ship-box1 {
width: 220px;
}
.sel-ship {
width: 220px;
}
.terms {
color: #009900;
font-family: "helvetica neue";
font-size: 12px;
padding-left: 20px;
text-decoration: underline;
text-transform: uppercase;
width: 200px;
}
JQUERY
$('.ship-box1, .ship-btn').click(function () {
$(this).parents('.sel-ship').find('.dropdown').slideToggle();
$(this).parents('.ss').toggleClass('ship-btn:hover');
return false;
});
有关如何确保条款链接保持不变的任何想法
最佳答案
这将为您解决问题:
.sel-ship { position: relative; }
.dropdown { position: absolute; top: 25px; }
关于jquery - 为什么下拉菜单会压低下方的div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8313649/