Question

我有这个（简单？）问题：在我的页面中我有一个popover，其元素是动态生成的。如何在弹出窗口底部修改一个div（具体来说，id =“foot-notification-pop”的元素），当它滚动时？在代码下方。谢谢！

HTML

<ul class="navbar-nav pull-right"> 
    <li><a href="#" data-toggle="popover" title="Notifications" data-html="true" data-content="<a href='?Profile'><div class='pop-text'>Notification 1</div></a><hr /><a href='?Profile'><div class='pop-text'>Notification 2</div></a><hr /><a href='?Profile'><div class='pop-text'>Notification 3</div></a><hr /><a href='?Profile'><div class='pop-text'>Notification 4</div></a><hr /><div><p id='foot-notification-pop'><a href='?notification'>Show all</a></p></div>">Notification</a></li>
</ul>

CSS

.popover-content {
max-height: 200px;
overflow-y: scroll;
}

JAVASCRIPT

$('[data-toggle="popover"]').popover({placement: 'bottom', trigger: 'click' });

Answer 1

一种方法是使用position: absolute css属性

#foot-notification-pop {
    position: absolute;
    bottom: 0px;
    background-color:#fff;
    width:70%
}

我还将段落标记中的id移动到div标记。

<div id='foot-notification-pop'><p><a href='?notification'>Show all</a></p></div>

Bootstrap 3如何在弹出滚动时修复内容

1 个答案: