Jquery页面导航

2014-11-24 01:42:31 · 作者: · 浏览: 0

1.把悬停效果加到菜单项

html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script src="../Scripts/jquery-1.4.1.js" type="text/java script">

<script type="text/java script">

$(document).ready(function () {

$('a').hover(function () {

$(this).addClass('hover');

}, function () {

$(this).removeClass('hover');

});

});

2.折叠式菜单

<script src="../Scripts/jquery-1.4.1.js" type="text/java script">

<script type="text/java script">

$(document).ready(function () {

$("p.Menu").mouseout(function () {

$("div.menuitems").slideUp('slow');

$('p').css({ 'background-color': '' });

});

$('p.Menu').mouseover(function () {

$(this).next('div.menuitems').slideDown(500).siblings('div.menuitems').slideUp("slow");

$(this).siblings().css({ 'background-color': '' });

});

});