Bootstrap材料设计 - 在popover中没有显示的涟漪

时间:2015-05-29 13:51:03

标签: javascript html css twitter-bootstrap bootstrap-material-design

我正在使用自助材料设计:https://fezvrasta.github.io/bootstrap-material-design/bootstrap-elements.html

这包括按下按钮时整齐的连锁效果,这在我的页面中的任何地方都有效,除了在html中有display:none的popover div,但用javascript对用户可见。

HTML:

ricSubscription.to_html(classes='mf')

JS:

<a href="#" class="pop" data-id="#popover_div1" data-container="body" data-placement="top" title="Popover title">Click to open popover</a>
<div id="popover_div1" style="display: none">
    <div>
        <img class="img-rounded" src="img/temp.png" alt="temp" height="25" width="25"/>
        This is your div content
    </div>
    <div>
        <div class="btn-group">
            <a href="javascript:void(0)" class="btn btn-default">5</a>
            <a href="javascript:void(0)" class="btn btn-default">6</a>
            <a href="javascript:void(0)" class="btn btn-default">7</a>
        </div>
    </div>
</div>

如果我取出style =“display:none”,涟漪效果会起作用,但包含它会使涟漪效果对div内的按钮不起作用,真的很奇怪。有什么方法可以让我保持显示:none(因为popof的工作原理就像我想要的那样),但仍然会对div中的按钮产生涟漪效应?

1 个答案:

答案 0 :(得分:0)

在显示弹出窗口后尝试调用$.material.ripples()