4

私の Web サイト ( http://amosjackson.com ) では、ナビゲーション リンクは CSS トランジションを使用して、ユーザーがカーソルを合わせると色が変わります。スタイルシートで色を白に設定しているにもかかわらず、ページが読み込まれると、リンクは青 (リンクのデフォルトの色) になります。これは通常の白に戻り、ページが更新されない限り再び発生しません。ページの他の場所でこの問題を再現できませんでした。このエラーは、連絡先ページ (ナビゲーション バーのリンクの 1 つ) では発生しません。

編集: Google Chrome でのみエラーが発生します。

4

5 に答える 5

2

あなたのHTMLファイルで:

<body class="preload">

CSSで:

.preload * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -ms-transition: none !important;
  -o-transition: none !important;
  transition: none !important;
}

JSで:

$(window).load(function() {
  $("body").removeClass("preload");
});
于 2015-04-28T15:01:43.900 に答える
2

.js遅いことはわかっていますが、これは私がしていることであり、関与していません。

1 つまたは 2 つのスタイルについては、次のように手動でページの先頭に含めることができます。

<head>
    ...
    <style>
        nav a.btn {
            color: white;
        }
    </style>
</head>

ブラウザーがこれらのスタイルをすぐにレンダリングできるようにすることで、FOUC が発生するのを防ぎます。大量のスタイルの場合は、役立つプリプロセッサーを調べる必要があります。

于 2016-01-31T10:36:52.947 に答える
2

style.cssの classで、.linksCSS トランジションを削除します。これにより、最初のトランジションが停止しますが、フェードアウトにも影響します。

.links{
    text-decoration:none;
    color:white;
    font-family:goudy;
    margin:0px;
    font-size:40px;
    padding:10px;
}

また、設定を試しa {color: white}て、影響があるかどうかを確認してください。

于 2012-08-19T11:52:47.903 に答える