的jQuery - 添加圖片的文字說明

我用了一個很不錯的JQuery從這裏下載： http://tympanus.net/codrops/2010/10/07/slider-gallery/的jQuery - 添加圖片的文字說明

，這是我做了什麼： http://www.massimozompa.com/home.html

現在我想添加一個簡短的文字作爲大圖片的描述。有人可以幫助我做到這一點？謝謝！

2012-07-04 user1500613

*爲我做的*問題可能被忽略。如果您希望用戶注意，您應該嘗試瞭解生成滑塊的代碼;拿出一個計劃來改變它，並把你的計劃進行測試。如果它沒有達到你想要的，然後解釋你做了什麼並尋求幫助。 –

您應該從單個拇指圖像的屬性（例如：alt）獲取文本，然後將文本複製到大圖像的div中，但我沒有看到插件的代碼，但通常這是一種方法。 –

再舉DIV如下對每個類別= 「內容」，其由圖像描述的

<div class="content"> 
    <div> 
    <a href="#"><img src="images/album1/thumbs/1.jpg" alt="images/album1/1.jpg"  class="thumb"/</a> 
    </div> 
    <div id="description">Description about the image.........</div> 
</div>

appply CSS用於在div

#description { 
display:none 
}

現在，這個代碼

<div id="fp_overlay" class="fp_overlay"></div> 
<div id="fp_loading" class="fp_loading"></div> 
<div id="fp_next" class="fp_next"></div> 
<div id="fp_prev" class="fp_prev"></div> 
<div id="fp_close" class="fp_close">Close preview</div>

下

添加另一個用於顯示說明文字的div

<div id="displayDescription></div>

應用CSS，你要求上述DIV即在何處顯示...等

在現在這個功能

$fp_content_wrapper.find('.content') 
        .bind('click',function(e){ 
        var $current = $(this); 
        current = $current.index(); 
        centerImage($current,true,600); 
        e.preventDefault(); 
       });

添加以下代碼centerImage（$當前後」，真，600）;」

var descriptionText=$current.children(1).text(); 
$('#displayDescription').text(descriptionText);

並且還在var $ current = ....之後的if和else塊中的以下函數中添加上面的代碼。聲明

function navigate(way) { 
var $current = $fp_thumbScroller.find('.container:nth-child('+parseInt(gallery_idx+1)+')') 
              .find('.content:nth-child('+parseInt(current+1)+')'); 
}

在功能showPreviewFunctions（）添加以下代碼

$('#displayDescription').show();

而且在功能hidePreviewFunctions（）添加以下代碼

$('#displayDescription').hide();

現在完成了。

我都做到了，這是爲我工作...

點擊如果答案是有用

來源

2012-07-04 10:04:04

的jQuery - 添加圖片的文字說明

回答

相關問題