滾動事件(商城標題向下滾標題固定,向上恢復)

在做移動端商城時,在商城列表往下拉時讓標題固定在頂部,網上滾到頭時恢復原樣
1.<script type="text/javascript">
        $(document).ready(function () {
            //綁定滾動事件
            $(window).bind("scroll", function () {
                scroll();
            });
        });


        //滾動事件
        function scroll() {
            var hh = $(document).scrollTop();
            if (hh > 60) {
                $("#menu_list").addClass("fixed");
            } else {
                $("#menu_list").removeClass("fixed");
            }
        }
    </script>

2.

<style>

#menu_list.fixed{ position: fixed;width: 100%;background: #fff;left: 0;top: 0;z-index: 999;}

</style>


3.<div id="menu_list" class="menu_list">
            <ul>
                <li>
                    <a id="goods_item_01" class="active" href="#">全部</a>
                </li>
                <li>
                    <a id="goods_item_02" href="#">銷量</a>
                </li>
                <li>
                    <a id="goods_item_03" href="#">評分</a>
                </li>
                <li>
                    <a id="goods_item_04" href="#">價格</a>
                </li>
                <li>
                    <i class="fa fa-th-large change"></i>
                </li>
            </ul>
        </div>


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章