2012-12-20 16 views
5

Próbuję zbudować galerię zdjęć z Zenphoto. Używają PHP i można dodać niestandardową menue tak:Zmień kolor tła menu z jquery

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

zmieniłem wygląd całej sprawy w sylesheet, który wygląda tak:

#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; 
      } 

Teraz chcę zmienić kolor tła poszczególnych elementów menu, dzięki czemu każdy element menu ma swój własny kolor. Losowo czy nie, nie obchodzi mnie to. Stworzyłem plik js, który jest poprawnie podłączony.

Próbowałem kilku bitów kodu, które znalazłem, ale nic nie działa. Teraz próbowałem to zrobić, aby zobaczyć, czy mogę zmienić kolor w ogóle:

$(document).ready(function() { 

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

Nie działa. Jestem nowy w całym tym programowaniu i byłbym bardzo wdzięczny za każdą pomoc. Byłoby miło, gdybyś mógł odpowiedzieć na manekiny, żeby móc to zrozumieć.

+1

"wpisać kod tutaj"? Przed opublikowaniem kolejnego posta możesz chcieć przejrzeć. Teraz możesz edytować, aby było czystsze (pomoc na pasku narzędzi). –

+0

Bardzo mi przykro. Zepsułem nawet zadanie pytania. – Anette

+0

nie martw się, ktoś ustalony dla ciebie;) Powinieneś zadzwonić '$ (" # navmenu ")', a nie '$ (" navmenu ")', navmenu to id! –

Odpowiedz

4

Zastosowanie:

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

Przegapiłeś ID # selektora.

0

Musisz poprawnie zaadresować div używająC# dla identyfikatora lub. dla klasy:

$(document).ready(function() { 

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

Wskazówka dla początkujących: jeśli nie dostajesz wynik można oczekiwać, można sprawdzić, czy funkcja jest wywoływana przez rzucanie w wiadomości dziennika konsola nigdzie tak:

$(document).ready(function() { 
    console.log("document ready!"); 
    $("#navmenu").hover(function(){ 
     console.log("hover activated"); 
     $(this).css('background-color', '#eeeeee') 
    }); 
}); 
0

można dać coś takiego spróbować jak to będzie wybrać random color na hover i powrócić do #EEE tle na razie hover 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')   
    }); 
});​ 

Przykład pracy: http://jsfiddle.net/Qc4R7/