位置：固定在铬合金中

Question

我为我的网站创建了一个模板（www.forum.clothingshop.ir）。当我在chrome中向上滚动鼠标时，菜单顶部的标题将隐藏在页面中。但在Firefox中没问题。

javascript是：

＆＃13;

＆＃13;

 var fixmeTop = $('#topBox').offset().top;
        $(window).scroll(function () {
            var currentScroll = $(window).scrollTop();
            if (currentScroll >= fixmeTop) {
                $('#topBox').css({
                    position: 'fixed',
                    top: '0',
                    left: '0'
                });
            } else {
                $('#topBox').css({
                    position: 'static'
                });
            }
        });

＆＃13;

the css is
#topBox {
    width:100%;
    background-color:#fff;
    z-index:999;
   
}

The html is

＆＃13;

 <div id="topBox">
        <div class="container-fluid nopadding">
            <div id='cssmenu' class="col-sm-8">
                <ul>
                    <li><a href='#'><span>Home</span></a></li>
                    <li class='active has-sub'>
                        <a href='#'><span>Products</span></a>
                        <ul>
                            <li class='has-sub'>
                                <a href='#'><span>Product 1</span></a>
                                <ul>
                                    <li><a href='#'><span>Sub Product</span></a></li>
                                    <li class='last'><a href='#'><span>Sub Product</span></a></li>
                                </ul>
                            </li>
                            <li class='has-sub'>
                                <a href='#'><span>Product 2</span></a>
                                <ul>
                                    <li><a href='#'><span>Sub Product</span></a></li>
                                    <li class='last'><a href='#'><span>Sub Product</span></a></li>
                                </ul>
                            </li>
                        </ul>
                    </li>
                    <li><a href='#'><span>About</span></a></li>
                    <li class='last'><a href='#'><span>Contact</span></a></li>
                    <li>
                        <div id="example2">
                            <div class="wrapper2">
                                <div class="content-wrapper2">
                                    <div class="search-button2">
                                        <span><img src="NextLevelSearch/images/search-icon-big.jpg" /></span>
                                    </div>
                                    <div class="search-box2">
                                        <input type="text" placeholder="جستجو..." />
                                        <img src="NextLevelSearch/images/close.png" />
                                    </div>
                                </div>
                            </div>

                        </div>
                    </li>
                    <li style="margin:30px auto 0;">
                        <button id="cart" value=""><span class="glyphicon glyphicon-shopping-cart"></span>&nbsp;سبد خرید</button>
                    </li>
                </ul>
            </div>
            <div class="col-sm-4 companyName" style="float:left">

            </div>
        </div>
    </div>

＆＃13;

＆＃13;

＆＃13;

Answer 1

删除或隐藏#topBox元素的样式

这

#topBox {
      width: 100%; 
      background-color: #fff; 
      z-index: 999; 
}

到

#topBox {
    /* width: 100%; */
    /* background-color: #fff; */
    /* z-index: 999; */
}

它会起作用..