鼠標(biāo)經(jīng)過顯示DIV,移開隱藏DIV，這在制作網(wǎng)站二級導(dǎo)航菜單時，經(jīng)常用到。

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

方法/步驟

1. 給鼠標(biāo)經(jīng)過的DIV添加一個類 ，類名為submeau；如下圖：
   
2. 給顯示或者隱藏的DIV，添加一個ID，ID名為:id="oa_submeau"，如下圖：
   
3. 將以下的JQUERY代碼放在整個網(wǎng)頁的最底部，用于控制鼠標(biāo)經(jīng)過顯示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();
   
   ?           })
   
   ?           // 鼠標(biāo)移動到list的div上的時候list div不會被隱藏
   
   ?           $("#oa_submeau").hover(function () {
   
   ?               $("#oa_submeau").show();
   
   ?           }, function () {
   
   ?               $("#oa_submeau").hide();
   
   ?           })
   
   
   
   ?   </script>
   
   

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

標(biāo)簽： 代碼 建網(wǎng)站 學(xué)建網(wǎng)站 制作網(wǎng)站

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