javascript 原生代码

<ul class="nav">

<li><a href="/">&nbsp;首页&nbsp;</a></li>

<li id="li_1" onmouseover="show(1)" onmouseout="hide(1)"><a href="http://www.wufangbo.com/category/css/">css</a>

        <dl id="dl_1">

        <dd><a href="#">老凡CSS</dd>

        <dd><a href="#">中凡CSS</dd>

        <dd><a href="#">小凡CSS</dd>

    </dl>

</li>

<li id="li_2" onmouseover="show(2)" onmouseout="hide(2)"><a href="http://www.wufangbo.com/category/css3-html5/">css3</a>

        <dl id="dl_2">

        <dd><a href="#">老凡CSS</dd>

        <dd><a href="#">中凡CSS</dd>

        <dd><a href="#">小凡CSS</dd>

    </dl>

</li>

<li><a href="http://www.wufangbo.com/category/javascript/">javascript</a> </li>

<li><a href="http://www.wufangbo.com/category/jquery/">jquery</a> </li>

<li id="li_3" onmouseover="show(3)" onmouseout="hide(3)"><a href="http://www.wufangbo.com/category/yhty/">ued</a>

        <dl id="dl_3">

        <dd><a href="#">老凡CSS</dd>

        <dd><a href="#">中凡CSS</dd>

        <dd><a href="#">小凡CSS</dd>

    </dl>

</li>

<li><a href="http://www.wufangbo.com/category/linux/">linux</a> </li>

<li><a href="http://www.wufangbo.com/category/wordpress/">wordpress</a> </li>

 

</ul>

function show(i)

        {

                document.getElementById('dl_'+i).style.display='block';

               

        }

        function hide(i)

        {

                document.getElementById('dl_'+i).style.display='none';

        }

jquery的原生代码

$("document").ready(function(){

                $(".nav li").hover(function(){

                                                $(this).find('dl').show();                     

                                                                },function(){

                                     $(this).find('dl').hide();

                                                     })

              $(".nav li").mouseover(function(){

                                                         $(this).find('dl').fadeIn('slow');                      

                                                                                  })

                 

                  $(".nav li").mouseout(function(){

                                                         $(this).find('dl').hide();                      

                                                                                  })                                                             

           })