1

このページの 2 つの紫色のボタン (または白い親コンテナーのスライド 2) を、スクロール時に赤いヘッダー div の下端に当たったときに、そのすぐ下にくっつけるにはどうすればよいですか?

私はこのフィドルを作成しました: http://jsfiddle.net/baumdexterous/K7NSX/

私が達成しようとしているものの同様の例: http://jsbin.com/ijexe

HTML:

<div id="container">

    <div class="menu">
        <div class="container clearfix">

            <div id="header" class="grid_12">
            </div>
        </div>
    </div>


    <div class="slide" id="slide1">
        <div class="container clearfix">

            <div id="section1" class="grid_12">
            </div>


        </div>
    </div>

    <div class="slide" id="slide2">
        <div class="container clearfix">

            <div id="test" class="grid_6">
                <a href="" target="_blank" class="btn1"></a>
            </div>

            <div id="test" class="grid_6 omega">
                <a href="" target="_blank" class="btn2"></a>
            </div>

        </div>
    </div>

    <div class="slide" id="slide3">
        <div class="container clearfix">

            <div id="section3" class="grid_12">
            </div>
        </div>
</div>

本当にありがとう！

4

2 に答える 2

0

このスクリプトを試してください。 

 var $window = $(window);
            $stickyEl = $('#youelementID');
            var elTop = $stickyEl.offset().top;
            $window.scroll(function() {
                var windowTop = $window.scrollTop();
                $stickyEl.toggleClass('sticky', windowTop > elTop);
            });

/// と Css

.sticky
{
    position: fixed;
    top: 0px;
}
于 2013-09-30T23:57:05.147 に答える