jquery

2012-12-20 5 views
5

के साथ मेन्यू के पृष्ठभूमि रंग बदलें I Zenphoto के साथ एक फोटो गैलरी बनाने की कोशिश कर रहा हूं। वे php का उपयोग करें और एक इस तरह एक कस्टम menue जोड़ सकते हैं:jquery

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

अब मैं बदलना चाहते हैं व्यक्तिगत मेनू आइटम का पृष्ठभूमि-रंग, ताकि प्रत्येक मेनू आइटम का अपना रंग हो। यादृच्छिक या नहीं मुझे परवाह नहीं है। मैंने एक जेएस फ़ाइल बनाई है जिसे सही ढंग से वायर्ड किया गया है।

मैंने पाया कोड के कई बिट्स की कोशिश की है, लेकिन कुछ भी काम नहीं करता है। अब मैंने यह देखने के लिए ऐसा करने की कोशिश की कि क्या मैं रंग बदल सकता हूं:

$(document).ready(function() { 

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

काम नहीं करता है। मैं इस प्रोग्रामिंग के लिए नया हूं और मैं किसी भी मदद की सराहना करता हूं। यदि आप डमी के लिए जवाब दे सकते हैं तो यह बहुत अच्छा होगा, ताकि मैं समझ सकूं।

+1

"यहाँ कोड दर्ज"? अगली बार पोस्ट करने से पहले आप समीक्षा करना चाहेंगे। अब आप इसे क्लीनर बनाने के लिए संपादित कर सकते हैं (टूलबार में एक सहायता है)। –

+0

मुझे बहुत खेद है। मैं सवाल पूछने में भी गड़बड़ कर रहा था। – Anette

+0

चिंता न करें, आपके लिए कोई तय किया गया है;) आपको '$ (" # navmenu ") ',' $ (" navmenu ") 'नहीं कहना चाहिए, navmenu एक आईडी है! –

उत्तर

4

उपयोग:

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

आप आईडी # चयनकर्ता याद किया।

0

आपको आईडी या ए के लिए # का उपयोग करके 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') 
    }); 
}); 
0

आप इस एक कोशिश की तरह कुछ दे सकता है के रूप में यह hover पर एक random color लेने और hover out घटना पर #EEE पृष्ठभूमि वापस स्विच करेंगे:

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/