鼠標經過顯示DIV,移開隱藏DIV，這在制作網站二級導航菜單時，經常用到。

它的原理就是當鼠標經過時觸發(fā)“顯示”事件，鼠標離開時觸發(fā)“隱藏”事件。這樣的功能需要借助JQUERY。下面學做網站論壇來講一下如何實現(xiàn)鼠標經過顯示DIV,離開隱藏DIV功能�！救绻�你對代碼一點不懂，可以學習一下html入門教程】

方法/步驟

1. 給鼠標經過的DIV添加一個類 ，類名為submeau；如下圖：
   
2. 給顯示或者隱藏的DIV，添加一個ID，ID名為:id="oa_submeau"，如下圖：
   
3. 將以下的JQUERY代碼放在整個網頁的最底部，用于控制鼠標經過顯示DIV,離開隱藏DIV。

   
   <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
   
   <script type="text/javascript">
   
           $("#oa_submeau").hide();
   
   ?           $(".submeau").hover(function () {
   
   ?               $("#oa_submeau").show();
   
   ?           }, function () {
   
   ?               $("#oa_submeau").hide();
   
   ?           })
   
   ?           // 鼠標移動到list的div上的時候list div不會被隱藏
   
   ?           $("#oa_submeau").hover(function () {
   
   ?               $("#oa_submeau").show();
   
   ?           }, function () {
   
   ?               $("#oa_submeau").hide();
   
   ?           })
   
   
   
   ?   </script>
   
   

這樣就可以實現(xiàn)鼠標經過某個區(qū)域時顯示隱藏的DIV，離開時再次隱藏DIV�！緸楸苊庑率謱W建網站不懂代碼，這里提示了示例代碼下載：https://pan.baidu.com/s/1yOT_-TXvRarWhoqv064I0w】

標簽： 代碼 建網站 學建網站 制作網站

版權申明：本站文章部分自網絡，如有侵權，請聯(lián)系：west999com@outlook.com
特別注意：本站所有轉載文章言論不代表本站觀點！
本站所提供的圖片等素材，版權歸原作者所有，如需使用，請與原作者聯(lián)系。