點擊圖片顯示圖片和彈出內容

我有一個WordPress的網站，我在頁面上顯示圖像。當你點擊一個圖像時，我想要一個彈出窗口來顯示與圖像相關的圖像和內容。每個圖像和內容都是一個帖子。我試圖使用代碼：點擊圖片顯示圖片和彈出內容

$post_id = get_the_ID(); 
$post = get_post($post_id, ARRAY_A); 
$title = $post['post_title'];

獲取內容的標題。然後，我需要使用jQuery，所以當你點擊圖片的標題（以及內容）顯示。我在哪個文件中放置jQuery代碼？如何鏈接圖像，所以onclick（）它顯示彈出？

來源

2014-12-07 LTech

你需要在這裏嘗試一些東西....你可以創建一個隱藏的div與信息和使用jquery顯示內容點擊時，像延遲關閉窗口。要麼或者使用ajax來獲取內容。 – David 2014-12-08 01:00:02

你有我如何使用jquery顯示點擊內容的例子嗎？我不知道如何做到這一點？ – LTech 2014-12-08 09:37:25

將此代碼添加到您的模板的底部。

<script type="text/javascript"> 

jQuery(document).ready(function(){ // wait until all document html loaded 

    jQuery('.unhide').click(function(){ // attach a function to elements with the class "unhide" 
     jQuery(this).closest('.holder').find('.hidden').show(); // Look for the closest parent of this item with the class "holder" and find the hidden div, show it 
     jQuery(this).closest('.holder').find('.hidden').delay(800).hide(1000); // find the same element and close after delay, take 1000 ms to close. 
    }); 

}); 
</script>

的jsfiddle：http://jsfiddle.net/5hrcsguu/1/，它假定父項目包含隱藏的內容和一個按鈕，單擊事件使用

簡單的例子。 http://api.jquery.com/有每個功能的例子。除此之外，您需要了解的僅僅是使用js的腳本標記，並使用jQuery而不是使用的$符號。

來源

2014-12-08 18:02:30 David

點擊圖片顯示圖片和彈出內容

回答

相關問題