[英]show/hide buttons if another div height is overflow
I need to show/hide div buttons according to nav-list div height overflow, if list is overflow then show buttons otherwise hide it.我需要根据 nav-list div 高度溢出显示/隐藏 div 按钮,如果列表溢出则显示按钮,否则隐藏它。
JQuery JQuery
// didnt work for me!
if($('#nav-list').prop('scrollHeight') < $('#nav-list').height()){
$('#updown-arrows').hide();
}else{
$('#updown-arrows').show();
}
HTML HTML
<div id="nav-list">
<!-- wordpress nav menu -->
<?php
wp_nav_menu(
array(
'theme_location' => 'primary',
'depth' => 2,
'menu_class' => 'list-unstyled components',
'menu_id' => 'sidebarnav',
'fallback_cb' => 'wp_bootstrap_navwalker::fallback',
'walker' => new wp_bootstrap_navwalker()
)
);
?>
</div>
<!-- up/down arrows buttons -->
<div id="updown-arrows">
<a id="up" href="#"><span class="glyphicon glyphicon-menu-up" aria-hidden="true"></span></a>
<a id="down" href="#"><span class="glyphicon glyphicon-menu-down bounce" aria-hidden="true"></span></a>
</div>
if someone faced the same issue如果有人遇到同样的问题
function checkOverflow() {
if ($('#nav-list').prop('scrollHeight') <= $('#nav-list').prop('clientHeight')){
$('#updown-arrows').hide();
} else {
$('#updown-arrows').show();
}
}
checkOverflow();
$(window).resize(function () {
checkOverflow()
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.