说明:1.利用jquery做一个鼠标移到dt标签上改变dt的值,鼠标移出后恢复原来的值。
      2.使用的是jquery 1.3的
     [code=jquery]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>testtitle>
<link href="css/master.css" rel="stylesheet" type="text/css"/>
<link href="css/layout.css" rel="stylesheet" type="text/css"/>
<script src="js/images.js" type="text/javascript"></script>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
 $("dd").hide();
 $("dt#mainMenu_1").hide();$("dt#mainMenu a").mouseenter(function(){
  $(this).parent().next().slideToggle("");
  $(this).parent().prevAll("dd").slideUp("slow");
  $(this).parent().next().nextAll("dd").slideUp("slow");
  return true;
  }); 
   
   
   /*
    $("dt#mainMenu a").mouseout(function(){
  $("dt#mainMenu a").show(); 
    $(this).parent().prevAll("dd").slideUp("slow");
  $(this).parent().next().nextAll("dd").slideUp("slow");
  return false;
  });*/
  
});
</script><SCRIPT type=text/javascript src="js/jquery-1.3.2.min.js"></SCRIPT></head><body>
<div id="body">
<div id="header">
  <div style="margin-bottom:17px"><a href="/zh-CN/index.html"><img src="http://www.girdear.net//tpl/2012/g/www.girdear.net/zh-CN/images/logo.png" /></a></div>
  <dt id="mainMenu"><a href="/zh-CN/introduce.html"><img  src="http://www.girdear.net//tpl/2012/g/www.girdear.net/zh-CN/images/m1.png" alt="哥弟" /></a></dt>
<!--   <dt id="mainMenu_1"><a href="/zh-CN/introduce.html">哥弟</a></dt>-->
  <dd id="listNav">
    <div><a href="/zh-CN/introduce.html?introID=6361">品牌理念</a></div>
    <div><a href="/zh-CN/introduce.html?introID=6372">品牌文化</a></div>
    <div><a href="/zh-CN/introduce.html?introID=6373">品牌说明</a></div>
    <div><a href="/zh-CN/introduce.html?introID=6374">品牌打假</a></div>
  </dd>
  <dt id="mainMenu"><a href="/zh-CN/newproducts.html"><img src="http://www.girdear.net//tpl/2012/g/www.girdear.net/zh-CN/images/m2.png" alt="New Products" /></a></dt>
  <dd id="listNav">
    <div><a href="/zh-CN/newproducts.html?proTypeID=15875&proTypeName=2011%E6%98%A5%E5%A4%8F">2011春夏</a></div>
    <div><a href="/zh-CN/newproducts.html?proTypeID=15702&proTypeName=2011%E7%A7%8B%E5%86%AC">2011秋冬</a></div>
    <div><a href="/zh-CN/newproducts.html?proTypeID=15701&proTypeName=2012%E6%98%A5%E5%A4%8F">2012春夏</a></div>
    <div><a href="/zh-CN/newproducts.html?proTypeID=15700&proTypeName=2012%E7%A7%8B%E5%86%AC">2012秋冬</a></div>
    <div><a href="/zh-CN/newproducts.html?proTypeID=16523&proTypeName=%E9%A5%B0%E5%93%81">饰品</a></div>
    <div><a href="/zh-CN/newproducts.html?proTypeID=24151&proTypeName=%E4%B8%9D%E5%B7%BE">丝巾</a></div>
  </dd>
  <dt id="mainMenu"><a href="/zh-CN/products.html"><img src="http://www.girdear.net//tpl/2012/g/www.girdear.net/zh-CN/images/m3.png" alt="Element" /></a></dt>
  <dd id="listNav">
    <div><a href="/zh-CN/products.html?proTypeID=15715&proTypeName=2008">2008</a></div>
    <div><a href="/zh-CN/products.html?proTypeID=15714&proTypeName=2009">2009</a></div>
    <div><a href="/zh-CN/products.html?proTypeID=15713&proTypeName=2010">2010</a></div>
    <div><a href="/zh-CN/products.html?proTypeID=15712&proTypeName=2011">2011</a></div>
    <div><a href="/zh-CN/products.html?proTypeID=15711&proTypeName=2012">2012</a></div>
  </dd>
  <dt id="mainMenu"><a href="/zh-CN/news.html"><img src="http://www.girdear.net//tpl/2012/g/www.girdear.net/zh-CN/images/m4.png" alt="Health" /></a></dt>
  <dd id="listNav">
    <div><a href="/zh-CN/news.html?newsTypeID=15692&NewsType=%E5%81%A5%E5%BA%B7">健康</a></div>
    <div><a href="/zh-CN/news.html?newsTypeID=15691&NewsType=%E5%B0%8F%E7%9F%A5%E8%AF%86">小知识</a></div>
    <div><a href="/zh-CN/news.html?newsTypeID=15690&NewsType=%E4%B9%A6%E5%B1%8B">书屋</a></div>
    <div><a href="/zh-CN/news.html?newsTypeID=15689&NewsType=%E5%88%86%E4%BA%AB">分享</a></div>
  </dd>
  <dt id="mainMenu"><a href="/zh-CN/products001.html"><img src="http://www.girdear.net//tpl/2012/g/www.girdear.net/zh-CN/images/m5.png" alt="Shop" /></a></dt>
  <dd id="listNav">
    <div><a href="/zh-CN/products001.html">店铺</a></div>
    <div><a href="/zh-CN/products002.html">店铺展示</a></div>
  </dd>
  <dt id="mainMenu"><a href="javascript:void(null)"><img src="http://www.girdear.net//tpl/2012/g/www.girdear.net/zh-CN/images/m6.png" alt="Brand" /></a></dt>
  <dd id="listNav">
    <div><a href="http://www.girdear.cn" target="_blank">哥弟商城</a></div>
    <div><a href="http://girdear.tmall.com" target="_blank">哥弟淘宝旗艦店</a></div>
    <div><a href="http://www.amasswww.com" target="_blank">阿玛施服饰</a></div>
    <div><a href="http://www.amass-eye.com" target="_blank">阿玛施眼科全飞秒激光中心</a></div>
  </dd>
</div>
<!-- 图片切换宽度100% ====================================== -->
<style>
.MainBox {
Z-INDEX: 1;
POSITION:relative;
WIDTH: 100%;
height:610px;
width:auto!important;
width:100%;
min-width:1003px;
overflow:hidden;
}
</style>
<style>
.MainBox .bbBox .bb_list {
/* POSITION: absolute; WIDTH: 100%; DISPLAY: none; HEIGHT:610px; TOP: 0px; LEFT: 0px*/
POSITION: afix; WIDTH: 600px; DISPLAY: none; HEIGHT:610px; TOP: 0px; LEFT: 20%;
}
.MainBox .bbBox .bb_list_1 {
BACKGROUND:url(http://images02.cdn86.net/kps01/M00/4F/09/wKiAiVECUG7cARfTAADiIjptz5M498.jpg) center top no-repeat;
}
.MainBox .bbBox .bb_list_2 {
BACKGROUND:url(http://images02.cdn86.net/kps01/M00/4F/0E/wKiAiVEDJMPngeSuAADRLJc_iUQ406.jpg) center top no-repeat;
}
.MainBox .bbBox .bb_list_3 {
BACKGROUND:url(http://images02.cdn86.net/kps01/M00/4F/0E/wKiAiVEDJPq8zdIEAACxN1V2RnA783.jpg) center top no-repeat;
}
.MainBox .bbBox .bb_list_4 {
BACKGROUND:url(http://images02.cdn86.net/kps01/M00/4F/0E/wKiAiVEDJQmMjxIDAADBYhkRi0Y650.jpg) center top no-repeat;
}
.MainBox .bbBox .bb_list_5 {
BACKGROUND:url(http://images02.cdn86.net/kps01/M00/4F/0F/wKiAiVEDJSWQjMpLAAC0PPxdlM0352.jpg) center top no-repeat;
}
.MainBox .bbBox .bb_list_6 {
BACKGROUND:url(http://images02.cdn86.net/kps01/M00/4F/0F/wKiAiVEDJTH_bfDpAADeYEW86cA896.jpg) center top no-repeat;
}
.MainBox .bbBox .bb_list_7 {
BACKGROUND:url(http://images02.cdn86.net/kps01/M00/4F/0E/wKiAiVEDJOm2JBKuAACuUvP78-Q374.jpg) center top no-repeat;
}
.bb_ico_warpper{
position:relative;
z-index:99;
width:1003px;
margin:auto;
}
.bb_ico{
position:absolute;
right:10px;
top:250px;
}
.bb_ico li{
width:22px;
height:22px;
overflow:hidden;
cursor:pointer;
background:url(http://www.girdear.net//tpl/2012/g/www.girdear.net/zh-CN/images/dian.png) center center no-repeat;
}
.bb_ico li.ico_now{
background:url(http://www.girdear.net//tpl/2012/g/www.girdear.net/zh-CN/images/dian1.png) center center no-repeat;
}
.png{
cursor:pointer;
}
</style></body></html>[/code]
    特效鼠标jquery标签