Bootstrap词缀重置附加元素?

时间:2016-10-01 14:49:17

标签: jquery html css twitter-bootstrap

我正在尝试实现侧边栏,这是我的代码:

HTML

EF6

CSS

string input = "= (value 1,value 2,\"value3,value4,value5\",value 6)";
string pattern = "(?<=\".*),(?=.*\")";
string result = Regex.Replace(input, pattern, "@");

JQuery的

<section class="mySection">
    <div class="container">
        <div class="row">
            <header class="col-md-12">
                <h3>Heading</h3>
                <p><em>Some text</em></p>
            </header>

            <!--Main Content Container - Make full width on smaller devices-->
            <article class="col-md-9 col-sm-12" role="main">
                <p>Text to enable scrolling</p>
                <p>Text to enable scrolling</p>
                <p>Text to enable scrolling</p>
                <p>Text to enable scrolling</p>
                <p>Text to enable scrolling</p>
                <p>Text to enable scrolling</p>
                <p>Text to enable scrolling</p>
                <p>Text to enable scrolling</p>
                <p>Text to enable scrolling</p>
                <p>Text to enable scrolling</p>
                <p>Text to enable scrolling</p>
                <p>Text to enable scrolling</p>
                <p>Text to enable scrolling</p>
                <p>Text to enable scrolling</p>
                <p>Text to enable scrolling</p>
                <p>Text to enable scrolling</p>
            </article>
            <!--Sidebar - Hide on Small and extra small devices-->
            <aside class="col-md-3 hidden-sm hidden-xs" role="complementary" data-spy="affix">
                <section class="card">
                    <header>
                        <h4 class="card-title">Card title</h4>
                    </header>
                    <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
                    <a href="#" class="btn btn-primary">Go somewhere</a>
                </section>
                <section class="card">
                    <header>
                        <h4 class="card-title">Card title</h4>
                    </header>
                    <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
                </section>
            </aside>
        </div>
    </div>
</section>

一切正常,除非我将页面一直向上滚动到顶部,旁边/我的侧边栏从场景中消失。 如何解决此问题?

Bootplay: http://www.bootply.com/FjJlykT5e5

1 个答案:

答案 0 :(得分:0)

问题是当词缀元素返回其原始状态时,它的位置不会返回到原始位置。所需要的只是处理Bootstrap词缀事件affix-top.bs.affix,它在词缀元素返回其原始状态之前被触发,并且该类从.affix变为.affix-top even处理程序只是删除内联style属性。

$ ( 'aside' ).on ( 'affix-top.bs.affix', function ( event ) {
    /**Remove inline style attributes from the element**/
    $ ( this ).removeAttr ( 'style' );
} );