JQuery的：在下拉菜單鏈接無法點擊

The Wikipedia button isn't clickable JQuery的：在下拉菜單鏈接無法點擊

我的問題是，在下拉菜單裏面的維基百科鏈接無法點擊。我已經嘗試用stopPropagation（）修復問題;但它不起作用。

HTML：

<section id="help_advanced_rules_section"> 
       <div class="bar_bottom_left"></div> 
       <div class="bar_mid" id="bar_mid_7"><h3>8. Rules</h3></div> 
       <div class="bar_bottom_right"></div> 
       <div class="bar_ear" id="bar_ear_7"></div> 
       <article id="article_7"> 
        <div class="image_section"> 
        <img src="images/help_1.png" id="image_7"> 
        </div> 
        <div class="text_section"> 
         <p>Look up the rules on Wikipedia.</p> 
         <p><a href="http://google.de"><img src="images/wikipedia_en.png" id="wikipedia"></a></p>  
        </div> 

       </article> 
    </section>

JQUERY：

<script> 
     function closeArticle(article) { 


      article.css("paddingTop", "0px"); 
      article.css("paddingBottom", "0px"); 
      article.animate({maxHeight: "1.2em"}, 200, function() { 
       article.children().css("display", "none");      
      }); 
      article.removeClass('expanded'); 

     } 

     function openArticle(article) { 
      closeAllArticle(); 
      article.children().css("display", "block"); 
      article.css("paddingTop", "1em"); 
      article.css("paddingBottom", "0.5em"); 
      article.animate({maxHeight: "2000px"}, 250, function() { 
       article.animate({maxHeight: article.height() + "px"}, 0); //maxheight wird auf die höhe gesetzt die das element nach dem ausfahren hat um die animation danach zu verkürzen 

       article.addClass('expanded'); 
       $('html, body').animate({scrollTop: article.offset().top - 40 
                }, 100); 
      }); 


     } 

     function closeAllArticle() { 
      $('.expanded').each(function(){ 
       closeArticle($(this)); 
      }); 

     } 
     function openCloseArticle(article) { 

      if(article.hasClass('expanded')) 
      { 
       closeArticle(article); 
      } 
      else 
      { 
       openArticle(article); 
      } 
     } 
     $(document).ready(function() {   
      var toggle = function(id, element_name) { 
            //Get ArticleID 
       var toRemove = element_name; 
       var number = id.replace(toRemove, ''); 

       var articleID = "#article_"+number; 
       var article = $(articleID); 

       openCloseArticle(article) 
      }; 

      $(".bar_mid").click (function() { 
       toggle($(this).attr("id"), "bar_mid_"); 
      }); 

      $(".bar_ear").click (function() { 
       toggle($(this).attr("id"), "bar_ear_"); 
      }); 


     }); 


     </script>

我嘗試了許多不同的方式與stopPropagation（）;但它沒有工作。也許我只是不明白它是如何工作的，或者我需要以另一種方式解決我的問題。

那麼使維基百科按鈕可點擊的最佳方式是什麼？

來源

2013-10-01 Stefan Gi

你可以添加一個jsFiddle嗎？ –

http://jsfiddle.net/TNTzg/ 佈局不像真正的那個，但功能是。非常感謝您的幫助:) –

我沒有找到您的錯誤。但是也許你可以嘗試用Bootstrap上存在的手風琴，然後像你想要的那樣風格化。我認爲你的代碼沒有優化。這很棒，因爲如果我把文章分爲幾個部分，我可以看到你的鏈接工作。 –

http://jsfiddle.net/TNTzg/1/

的問題是在z-index:-1在article CSS規則。文章區塊實際上位於區塊的後面。您可以通過右鍵單擊您的鏈接並選擇「檢查元素」，發現問題所在。它將打開選定鼠標光標下最頂端元素的開發人員工具。

來源

2013-10-01 09:26:23 pckill

JQuery的：在下拉菜單鏈接無法點擊

回答

相關問題