2017-05-05 24 views
0

我有這樣的代碼,其中,當文本的人懸停應該了slideDown格但其沒有工作可有人請檢查並點什麼原因的JavaScript了slideDown鼠標懸停不工作

<script type="text/javascript" src="/js/jquery-1.9.1.min.js" ></script> 
<div class="good_main"> 
<div class="more_save_box"> 
     <div class="top_wholesaleInquiry_button_20161213 more_save"> 
      Wholesale Inquiry 
     </div> 
     <div class="more_save_tips" style="display: none;"> 
      <span class="arrow_a"><i><i></i></i></span> 
      <h3>Bulk Buy Discounts</h3> 
      Order 3 or more and enjoy the savings. Bulk prices will be shown in the shopping cart. 
      <table cellspacing="0" cellpadding="0" width="100%" border="1"> 
       <tbody><tr> 
        <th>Qty (unit)</th> 
        <th>1</th> 
        <th>3</th> 
        <th>10</th> 
        <th>30</th> 
        <th>100</th> 
       </tr> 
       <tr class="has"> 
        <td>Price <span>US$</span></td> 
       <td>12.99</td><td>12.53</td><td>12.36</td><td>12.21</td><td>12.04</td></tr> 
      </tbody></table> 
      <span class="top_wholesaleInquiry_button_20161213" id="more_save_tips_contact">Looking for more wholesale prices, <a rel="nofollow" target="_blank" href="/Contact-Us_hi558?products_id=975808">Wholesale Inquiry</a></span> 

     </div> 
    </div> 
    </div> 
    <script type="text/javascript"> 
$(".good_main .more_save_box").hover(
    function(){ 
     $(".good_main .more_save_tips").stop().slideDown(); 
    }, 
    function(){ 
     $(".good_main .more_save_tips").hide(); 
    }); 
</script> 

回答

0

包裝你的代碼文件準備好語句,可以使用鼠標懸停/鼠標移開事件

$(function(){ 
 
    $(".good_main .more_save_box").mouseover(function(){ 
 
      $(".good_main .more_save_tips").stop().slideDown(); 
 
     }) 
 
     .mouseout(function(){ 
 
      $(".good_main .more_save_tips").hide(); 
 
     }); 
 
    })
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="good_main"> 
 
    <div class="more_save_box"> 
 
    <div class="top_wholesaleInquiry_button_20161213 more_save"> 
 
     Wholesale Inquiry 
 
    </div> 
 
    <div class="more_save_tips" style="display: none;"> 
 
     <span class="arrow_a"><i><i></i></i></span> 
 
     <h3>Bulk Buy Discounts</h3> 
 
     Order 3 or more and enjoy the savings. Bulk prices will be shown in the shopping cart. 
 
     <table cellspacing="0" cellpadding="0" width="100%" border="1"> 
 
     <tbody> 
 
      <tr> 
 
      <th>Qty (unit)</th> 
 
      <th>1</th> 
 
      <th>3</th> 
 
      <th>10</th> 
 
      <th>30</th> 
 
      <th>100</th> 
 
      </tr> 
 
      <tr class="has"> 
 
      <td>Price <span>US$</span></td> 
 
      <td>12.99</td> 
 
      <td>12.53</td> 
 
      <td>12.36</td> 
 
      <td>12.21</td> 
 
      <td>12.04</td> 
 
      </tr> 
 
     </tbody> 
 
     </table> 
 
     <span class="top_wholesaleInquiry_button_20161213" id="more_save_tips_contact">Looking for more wholesale prices, <a rel="nofollow" target="_blank" href="/Contact-Us_hi558?products_id=975808">Wholesale Inquiry</a></span> 
 

 
    </div> 
 
    </div> 
 
</div>

+1

感謝,並感謝所有那些誰回答這個平臺在學習新的東西一直妄作。 –

0

首先,你把你的jQuery代碼裏面document.ready功能,就像這樣:

$(document).ready(function(){ 
    $(".good_main .more_save_box").hover(
    function(){ 
     $(".good_main .more_save_tips").stop().slideDown(); 
    }, 
    function(){ 
     $(".good_main .more_save_tips").hide(); 
    }); 
}); 
0

時當domready加載jQuery代碼你的代碼工作。

$(document).ready(function(){ 
 
    $(".good_main .more_save_box").hover(
 
    function(){ 
 
     $(".good_main .more_save_tips").stop().slideDown(); 
 
    }, 
 
    function(){ 
 
     $(".good_main .more_save_tips").hide(); 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div class="good_main"> 
 
<div class="more_save_box"> 
 
     <div class="top_wholesaleInquiry_button_20161213 more_save"> 
 
      Wholesale Inquiry 
 
     </div> 
 
     <div class="more_save_tips" style="display: none;"> 
 
      <span class="arrow_a"><i><i></i></i></span> 
 
      <h3>Bulk Buy Discounts</h3> 
 
      Order 3 or more and enjoy the savings. Bulk prices will be shown in the shopping cart. 
 
      <table cellspacing="0" cellpadding="0" width="100%" border="1"> 
 
       <tbody><tr> 
 
        <th>Qty (unit)</th> 
 
        <th>1</th> 
 
        <th>3</th> 
 
        <th>10</th> 
 
        <th>30</th> 
 
        <th>100</th> 
 
       </tr> 
 
       <tr class="has"> 
 
        <td>Price <span>US$</span></td> 
 
       <td>12.99</td><td>12.53</td><td>12.36</td><td>12.21</td><td>12.04</td></tr> 
 
      </tbody></table> 
 
      <span class="top_wholesaleInquiry_button_20161213" id="more_save_tips_contact">Looking for more wholesale prices, <a rel="nofollow" target="_blank" href="/Contact-Us_hi558?products_id=975808">Wholesale Inquiry</a></span> 
 

 
     </div> 
 
    </div> 
 
    </div>