Question

尝试使用bootstrap affix插件，以便在滚动时修复共享按钮部分

但是当向下滚动并传递元素时，它会开始闪烁。你可以在这里看到它： http://kohelet.org.il/event/%D7%9E%D7%99%D7%A6%D7%92-%D7%94%D7%A9%D7%95%D7%A7-%D7%94%D7%97%D7%95%D7%A4%D7%A9%D7%99

向下滚动并向右看共享图标，当affix-top切换到affix时，出现问题。

我使用的代码：

<div class="col-sm-3 share">

    <ul class="share-links" data-spy="affix" data-offset-top="1020" data-offset-bottom="567">
        <li class="print_page">
            <i class="fa fa-print red"></i>
            <?php if(function_exists('pf_show_link')){echo pf_show_link();} ?>
        </li>
        <li>
            <i class="fa fa-envelope gray"></i>
            <a  class="em" href="" target="_blank">שלח</a>
        </li>

        <li>
            <i class="fa fa-facebook blue"></i>
            <a class="fb" href="" target="_blank">שתף</a>
        </li>

        <li>
            <i class="fa fa-twitter lightblue"></i>
            <a class="tw" href="" target="_blank">צייץ</a>
        </li>
        <li class="w_app_li">
            <i class="fa fa-whatsapp green"></i>
            <a class="wh_app" href="" data-action="share/whatsapp/share">וואטסאפ</a>
        </li>

    </ul>

</div>

还有一些css：

.affix{
    top: 40px;
}
.affix-bottom{
    position: absolute; !important;
}

非常感谢任何帮助！

Answer 1

您需要将data-offset-bottom="[[affix_bottom]]"添加到<ul>。很可能affix_bottom大约在1710年左右。你可以从这里找到它。（我假设你想在主标题结束后停止滚动。）

var selector = '.main-heading-main';
$(selector).offset().top + $(selector).outerHeight(true);

您也可以尝试动态设置词缀底部。

向下滚动时，词缀元素闪烁

1 个答案: