1

時間帯に応じて、コード内のいくつかのクラスを変更しようとしています。背景はうまく変更できますが、メニューの色も変更する必要があります。ページ内のリンクにクラスを追加して、それらを変更することもできないようです! どこが間違っているのかわかりません。どんな助けでも大歓迎です、ありがとう!

PS jQuery css() も試しましたが、運もありません...

function getDayTime(hours) {
if (hours > 20 || hours < 5)
    return "night";

if (hours > 17)
    return "dusk";

if (hours > 8)
    return "day";

return "dawn";
}

$(function() {
    document.body.className = getDayTime(new Date().getHours());
});

それはすべて素晴らしいです、みんなの助けに感謝します、私はjavascriptを変更しました、そしてそれもうまくいきます. ただし、夜明けの色も白に変更しようとしています-白に変更するのと同じようにコーディングしているにもかかわらず、まだ赤のままです! ここの私のシステムには明らかに十分なコーヒーがありません...

body.dawn #menu a {
    color:#fff !important
}

body.day #menu a {
    color:#8a0000 !important
}

body.dusk #menu a {
    color:#fff !important
}

body.night #menu a {
    color:#fff !important
}
4

3 に答える 3

3

jQuery にはclassName. addClassなどを見てください。

ただし、CSSに次のようなものを含めることをお勧めします。

body.night a {
    /* your style for the 'nightlink' with !important to be sure */
}

したがって、ページ内のすべての A ノードを取得して反復するように JS に依頼する必要はありません。さらに、リンクを動的に追加する場合、CSS アプローチを使用すると、スタイルも自動的に適用されます。

編集：元の質問とは関係ありませんが、jsコードの条件を次のように単純化できると思います：

function getDayTime(hours) {
    if (hours > 20 || hours < 5)
        return "night";

    if (hours > 17)
        return "dusk";

    if (hours > 8)
        return "day";

    return "dawn";
}

$(function() {
    document.body.className = getDayTime(new Date().getHours());
});
于 2012-05-23T22:18:57.453 に答える
0

あなたのCSSがどのように見えるかはわかりませんが、これを行う方法は次のとおりです。

CSS が次のようになっているとします。

<style type="text/css">
  body { /* some stuff here */ }
  body.day { /* some day stuff here */ }
  body.night { /* some night stuff here */ }
  #menu { /* some stuff here */ }
  #menu a { /* some menu link styling here */ }

  /* To change #menu when body has class="day" */
  body.day #menu { // change menu when it's day }
  body.day #menu a { // change menu links */ }

  /* To change #menu when body has class"night" */
  body.night #menu { /* change menu when it's night */ }
  body.night #menu a { // change menu links */ }
</style>
于 2012-05-23T22:19:02.997 に答える
0 
$("a").addClass("nightlink")

動作するはずです

于 2012-05-23T22:19:22.450 に答える