Меню с Javascirpt част 2

Автор: Gonke

Здравейте,първо извинявайте за закъснението на втората част ама се наложи да преинсталирам.Днес ще довършим менюто което започнахме.
1.Първо се е нашият навигациoнен контейнер #navigation, Останалото е почти стандартни неща. В клас „nav_links a:hover” ще бъде нашата смяна, ние ще се създаде образ, че в моменти. Другите клас е „. Withdiv“ Помните ли, когато написахме навигация ни в нашите HTML документ? Всички връзки добавите този клас добавя, с изключение на първия. Ако погледнете в Dreamweaver в „Design View“, трябва да има нещо подобно.

2.Сега може да се наложи да променят ляво & дясно в „. Nav_links А“ клас, ако е годна навигация в цялата 850pixels, това ще се дължи на някои думи е по-дълго от другите. Както можете да видите използва същия вид текст на всеки бутон, за да направи по-лесно. Сега да направим нашите бутон ховър, за да получите действителните размери взема печат екрана на вашия Design View в Dreamweaver, да го поставите в Photoshop и направете селекция като тази.

3.Сега си направете файл cumsom.js и в него поставете

$(function() {
// OPACITY OF BUTTON SET TO 100%
$(".nav_links a").css("opacity","1.0");

// ON MOUSE OVER
$(".nav_links a").hover(function () {

// SET OPACITY TO 30%
$(this).stop().animate({
opacity: 0.3
}, "slow");
},

// ON MOUSE OUT
function () {

// SET OPACITY BACK TO 100%
$(this).stop().animate({
opacity: 1.0
}, "slow");
});
});

4.В страницата която ще е менюто задължително трябва да има този код

<link href="styles.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="custom.js"></script>

Това беше от мен.Надявам се уроците да са ви харесали 🙂