使用jQuery向上/向下滑動

我需要向上/向下滑動或者只顯示和隱藏div，但它不起作用。我的代碼：使用jQuery向上/向下滑動

<div class="facilities"> 
      <div id="facheader"> 
       <div class="facheadname"> 
        Facilities 
       </div> 
       <div class="facheaderbutton"> 
        &#9651; 
       </div> 
      </div> 
      <div id="factable"> 
       <table border="0"> 
         <tr><div class="factableheader"> 
         <th>Name</th><th>City</th><th>Country</th><th>Compliance Certification</th><th>Audit History</th><th>Date</th><th>Remediation History</th><th>Date</th></div> 
         </tr> 
         <tr> 
         <td>Kowloon</td><td>Hong Kong</td><td>Hong Kong</td><td>cGMP-FDA</td><td>Compliant cGMP-SeerPharma</td><td>12/12/10</td><td>Clean room staff training – IRB-C</td><td>01/03/05</td> 
         </tr> 
       </table> 
      </div> 
     </div>

我試圖代碼 - 這是隱藏的內容，但再次按下時不顯示：

$('#facheader').click(function(){ 
      if ($('#factable').is(':hidden')){ 
       $('#factable').show();} 
      else{ 
       $('.contclickedinfo').hide(); 
      } 
      return false; 
     }); 



     $('#factable').click(function(e) { 
      e.stopPropagation(); 
     }); 
     $(document).click(function() { 
      $('#factable').hide(); 
     });

我也嘗試過這些，但他們根本不工作：

$(document).ready(function(){ 
    $('#facheader').click(function(){ 
     $('#factable').slideUp(), function(){ 
     $('#factable').slideDown(); 
    }); 
});

和

$('#facheader').toggle(function(){ 

     $('#factable').slideUp(800); // Text slides up 
     }, function(){ 

     $('#factable').slideDown(800); // Text slides down 
    });

來源

2011-11-15 user1047517

你最終的代碼片段適合我 - http://jsfiddle.net/QMLQC/ – ipr101

[也許你應該試試這個]（http://api.jquery.com/slideToggle/） – Nick

試過了，不工作在所有。 – user1047517

短，切換功能

$("#facheader").click(function(){ 
    $("#factable").slideToggle(); /* between() you can define speed in MS */ 
});

，因爲它不是觸發幻燈片上的鏈接，你並不需要返回false或stopPropagation。

一些東西，奇怪的是：

<tr><div class="factableheader">

瀏覽器看到這一點，他們就會把你的表外。

您是否使用具有相同ID的多個DIV？

來源

2011-11-15 14:13:42 Niels

我嘗試了所有的解決方案，但不起作用。你可以在這裏看到它，當我按下設施什麼也沒有發生：http://lordmonarch.net84.net/serviceProviders.html – user1047517

那是因爲你的.facilities有一個'z-index：-1'，這使得它不可點擊。刪除'z-index： - 1'，它會起作用。 – Niels

非常感謝它的工作。 – user1047517

$('#facheader').click(function() { 
    if ($('#factable').is(':visible')) 
     $('#factable').slideUp(800); // Text slides up 
    else 
     $('#factable').slideDown(800); // Text slides down 
});

來源

2011-11-15 14:11:40 OptimusCrime

$('#facheader').click(function() { 
    if ($('#factable').is(':visible')){ 
     $('#factable').hide(); 
    } else { 
     $('#factable').show(); 
    } 

    return false; 
});

這應該按照你想要的方式工作。我改變了你想隱藏的元素，因爲你選擇了一個不同的元素。此外，:visible選擇器比:hidden更好。我不確定爲什麼:hidden並不總是按照我們預期的方式工作。

來源

2011-11-15 14:12:10

使用jQuery向上/向下滑動

回答

相關問題