2014-09-26 80 views
0

我試圖用jquery做社交按鈕的類,但不知何故它不工作時,我將它添加到我的網站,在JsFiddle工作雖然很好。Jquery Toogle不工作在實時網站

繼承人的JsFiddle,這裏是我的website,所以你可以檢查,這不是在那裏工作。 它低於視頻。

我不知道我做錯了,我已經添加到了我的頭文件:

<script src="//code.jquery.com/jquery-1.10.2.js"></script> 
<script type="text/javascript"> 
$("#clickme").click(function() { 
    $("#share-stuff").slideToggle("slow", function() { 
    // Animation complete. 
    }); 
}); 

</script> 

這個地方我希望類出現:

<div id="clickme"> 
    Partilhar 
</div> 
<div id="share-stuff"> <!-- social share buttons --> 
    <ul class="crafty-social-buttons-list"> 
     <li><a class="crafty-social-button csb-facebook" href="http://www.facebook.com/sharer/sharer.php?u=<?php the_permalink() ?>" target="_blank"><img title="Facebook" alt="Facebook" width="38" height="38" src="../tv/wp-content/themes/trademark/share-buttons/facebook.png"></a></li> 
     <li><a class="crafty-social-button csb-google" href="https://plus.google.com/share?url=<?php the_permalink() ?>" target="_blank"><img title="Google" alt="Google" width="38" height="38" src="../tv/wp-content/themes/trademark/share-buttons/google.png"></a></li> 
     <li><a class="crafty-social-button csb-twitter" href="http://twitter.com/share?url=<?php the_permalink() ?>" target="_blank"><img title="Twitter" alt="Twitter" width="38" height="38" src="../tv/wp-content/themes/trademark/share-buttons/twitter.png"></a></li> 
     <li><a class="crafty-social-button csb-reddit" href="http://reddit.com/submit?url=<?php the_permalink() ?>" target="_blank"><img title="Reddit" alt="Reddit" width="38" height="38" src="../tv/wp-content/themes/trademark/share-buttons/reddit.png"></a></li> 
    </ul> 
</div> 

而且我怎麼才能讓它開始關閉而不是打開?

回答

2

嘗試使用$(document).ready

而且收share-stuff onload事件,第一隱藏:

http://jsfiddle.net/dirtyd77/omeedr9z/

// $(document).ready equivalent 
$(function(){ 
    // collapse share-stuff onload by using .hide() 
    $("#share-stuff").hide(); 

    $("#clickme").click(function() { 
     $("#share-stuff").slideToggle("slow", function() { 
     // Animation complete. 
     }); 
    }); 
}); 
1

您嘗試它是在DOM渲染之前clickme項目綁定。將您的jQuery代碼移到文檔的末尾。並最好用的文件準備代碼一樣包起來......

$(document).ready(function() { 

// your jquery codes 

}); 
+0

@Dom他是綁定文檔頭上的單擊事件。這就是爲什麼它在小提琴中工作,而不是在他的項目中。什麼是OP? – Azadrum 2014-09-26 03:58:54

+0

對不起,只有在這個問題中才讀到最後一個問題。你是對的。 – Dom 2014-09-26 04:00:11

1
$(document).ready(function() { 

// your jquery codes 

}); 

您必須包裝在上述方式jQuery的,而且似乎還有就是對網頁上的錯誤,請檢查這兩個。