0

現在作業中のWebサイトにナビゲーションバー(リボンスタイル)を追加し、jQuery Sticky Pluginを使用して、ユーザーがスクロールするとビューポートの上部に固定されるようにしました。

Firefox では完全に機能しますが、Chrome はバーがくっつくとすぐにリボンの側面の z-index を無視します。私はこれに対する解決策を求めて、過去 7 時間をグーグル検索に費やしました。バーのネストを解除し、すべての要素の位置と z-index 値を手動で設定するなど、さまざまな推奨事項を試しましたが、役に立ちませんでした。実際、私はそれを修正しようとして悪化させただけだったので、最初からやり直すことになりました。

Chromeでスクロールするときにリボンの側面を修正するために何を変更すればよいか教えてください。

4

4 に答える 4

0
$(document).ready(function(){
    $(function () {
        $(window).scroll(function () {
            if ($(this).scrollTop() > 50) {
                $('.nav').css({"position":"fixed", "top":"0"});
            } else {
                $('.nav').css({"position":"absolute","top":"50px"});
            }
        });


    });

});
于 2013-03-29T07:15:35.817 に答える
0

と の境界幅と下の位置を調整して、 の一貫性のない動作を回避してみ.DropMenu:beforeませ.DropMenu:afterz-indexか?

.DropMenu:before {
    border-color: transparent;
    border-color: rgba(40,54,44,.99) rgba(40,54,44,.99) transparent transparent;
    left: -1px;
    bottom: -12px;
}

.DropMenu:before, .DropMenu:after {
    content: "";
    position: absolute;
    border-style: solid;
    border-width: 6px;
}

.DropMenu:after {
    border-color: transparent;
    border-color: rgba(40,54,44,.99) transparent transparent rgba(40,54,44,.99);
    right: 0;
    bottom: -12px;
}

PS。疑似クラス:beforeは、:after下位バージョンの IE ではサポートされていない可能性があります。

于 2013-03-29T06:38:19.437 に答える
0

そのページにこのようなエラーがあります

      TypeError: Cannot read property 'msie' of undefined 

Jquery 1.9.1 を使用しているため、このエラーは明らかです。1.9 から削除されまし$.browserた。jQuery Migrateを使用して.$.browser support

エラーはこのjs ファイルにあります。

于 2013-03-29T06:40:23.467 に答える
0

私はあなたがどこで間違いを犯したかを見ました....すべてのブラウザで完璧に動作するようにするには、次のことを行ってください:

1) 本文からリボン イメージを削除します。

2) 新しいクラスを作成します。

.topbg{フロート:左; 幅:100%; 高さ:25px; z-index:9999; background: url(../images/border_top.png) repeat-x 上部中央; 位置:固定;}

3) この新しいクラスを HTML: とコンテンツに追加します。

お役に立てれば.....

于 2013-03-29T06:41:36.387 に答える