5

Zenphotoでフォトギャラリーを作ろうとしています。彼らはphpを使用し、次のようなカスタムメニューを追加できます:

    <div id="navmenu">
    <?php printCustomMenu('main_menue'); ?>
    </div>

sylesheet の全体の外観を次のように変更しました。

#navmenu {
        width: 1000px;
        height: 42px;
        margin: 0px auto 30px auto;
        font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
        text-align: left;
        font-size: 21px;
        background-color: #000000
        }

#navmenu li {
        display: inline; 
        }

#navmenu a {
        color: #eee;
        display: inline;
        line-height: 2em;
        padding: 0.375em 0.5em;
        text-decoration: none;
            }

#navmenu a:hover {
        font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
        font-size: 21px;
        color: #000000;
        background-color: #ffff33;
        padding: 0.375em 0.5em;
            }

ここで、個々のメニュー項目の背景色を変更して、すべてのメニュー項目が独自の色になるようにします。ランダムかどうかは気にしません。正しく配線されたjsファイルを作成しました。

見つけたコードをいくつか試してみましたが、何も機能しません。今、私はこれを行って、色をまったく変更できるかどうかを確認しようとしました:

 $(document).ready(function() {

 $("navmenu").hover(function(){
  $(this).css('background-color', '#eeeeee')
 });
});

動作しません。私はこのすべてのプログラミングに慣れていないので、助けていただければ幸いです。私が理解できるように、ダミーで答えていただければとてもうれしいです。

4

3 に答える 3

4

使用する：

$("#navmenu").hover(function(){

ID#セレクターを見逃しました。

于 2012-12-20T18:33:19.493 に答える
0

IDまたは。に＃を使用してdivを適切にアドレス指定する必要があります。クラスの場合：

$(document).ready(function() {

$("#navmenu").hover(function(){
  $(this).css('background-color', '#eeeeee')
 });
});

初心者向けのヒント：期待する結果が得られない場合は、次のようなコンソールログメッセージをスローすることで、関数が呼び出されていることを確認できます。

$(document).ready(function() {
    console.log("document ready!");
    $("#navmenu").hover(function(){
        console.log("hover activated");
        $(this).css('background-color', '#eeeeee')
    });
});
于 2012-12-20T18:41:13.507 に答える
0

次のようなものを試してみてください。イベントをrandom colorオンにしてバックグラウンドにhover戻すことができます。#EEEhover out

jQuery:

$(function () {
    $("#navmenu a").hover(function () {
        var newColor = Math.floor(Math.random() * 16777215).toString(16);
        $(this).css('background-color', '#' + newColor);
    }, function () {
        $(this).css('background-color', '#EEE')        
    });
});​

作業例: http://jsfiddle.net/Qc4R7/

于 2012-12-20T18:41:52.650 に答える