個性化Facebook like按鈕

Question

我在Wordpress中創建了一個應用程序，用戶在喜歡視頻後下載視頻。視頻就像帖子。我有Facebook的按鈕，但如果用戶喜歡這個帖子，我想讓按鈕變成下載。任何想法我應該做什麼？謝謝。

Answer 1

只要把Facebook的Like按鈕在同一個地方的下載按鈕，例如把它們放在一個共同的div元素：

<div id="like_download_container"> 
    <div id="fb-like></div> 
    <div id="download_button><!-- button code here --></div> 
</div> 

，並給下載按鈕z-index值設置爲-1。然後，將Javascript中的事件綁定到Like按鈕上的單擊事件，然後將z索引碰撞到2。使用jQuery（嗯，即使沒有，但jQuery使它更簡單），你甚至可以應用一個不錯的動畫。既然你不能真正動畫一個z-index變化（它只是使底部構件突然儘快出現，因爲它傳遞的第二個的z-index值），一個想法是不透明度發揮：

$('#download_button').css({ 
    'opacity' : '0', 
    'z-index' : '2' 
}); 
$('#download_button').animate('opacity', '1');