javascript-如何使Bootstrap 3在下拉菜单中下推页面内容

Google AdSense禁止网站掩盖广告中的任何元素-甚至包括扩展的下拉菜单-因此,我正在寻找一种方法,当单击下拉菜单时告诉Bootstrap向下推页面内容,因此将页首横幅下推掩盖.

我已经看过stackoverflow,到目前为止,我能找到的所有问题都在问如何覆盖内容而不是压低内容.我想做相反的事情(我认为这在Bootstrap 3中一定已经改变了).

我知道这是有可能的,因为在网站的响应版本中,右上方的切换按钮会向下推送页面内容,我确实希望下拉菜单执行以下操作：

http://getbootstrap.com/examples/navbar/

(打开此链接并缩小浏览器窗口,然后单击右上角的三行).

当菜单未折叠时,如何在下拉菜单项中添加该功能？

谢谢！

编辑：

这是我添加的基于@ hsb1007的响应来解决该解决方案的jQuery：

$('.class-name-1').on('show.bs.dropdown', function () {
     $('.leaderboard').css('margin-top', 450);       
})
$('.class-name-2').on('show.bs.dropdown', function () {
     $('.leaderboard').css('margin-top', 200);       
})
$('.dropdown').on('hide.bs.dropdown', function () {
     $('.leaderboard').css('margin-top', 0);         
})

解决方法:

不知道您的网站结构,很难解释

现在,从头开始,您必须在内容栏上添加“边距/填充”才能下推.

否则,当下拉菜单出现时,您的菜单将变得不便.

使用其基于事件的API.见下文

$('#myDropdown').on('show.bs.dropdown', function () {
     // this part will be trigged when dropdown is called

     // add margin / padding to your adsense container
})

要获得动态高度,

$('#myDropdown').on('shown.bs.dropdown', function () {
     // this part will be trigged after dropdown is shown

     // Grab height of dropdown
     var height = $('.dropdown').outerHeight();
})

再说一次,我实际上没有尝试过上面的任何代码,但是应该可以. =)

标签：twitter-bootstrap,css,javascript
来源： https://codeday.me/bug/20191122/2059016.html