使用縮略圖查看器來顯示縮略圖和放大圖像

Question

我有一個.js文件，它顯示目錄中圖像的縮略圖。它設置爲在鼠標懸停時觸發並顯示放大的圖像。我需要修改這個.js，以便在頁面加載時在兩個不同的分部的同一頁上顯示縮略圖和放大的圖像。

觸發的.js的代碼是：

<a href="http://www.marknutt.com/photos/storage/<?php echo $rows['file']; ?>" data-       lightbox="" name="<?php echo '<b><i>'.$rows['painting'].'</i></b>'.'&nbsp;&nbsp;&nbsp;'."<font color='#585858'>".$rows['year2'].'&nbsp;' .$medb.' on.$rows['material2'].'&nbsp;&nbsp;&nbsp;'.$pieces[0].' x '.$pieces[1].' x '.$pieces[2].'&nbsp;in.&nbsp;&nbsp;&nbsp;' 
."<sup><font size=&quot;1&quot;>".$location2a.'</font></sup>&nbsp;'.$rows['location2'].'&nbsp;&nbsp;&nbsp;'.$status3.'&nbsp;&nbsp;&nbsp;'. 
"<a id='displayText' href='javascript:toggle()'></font><font color=&quot;#31B404&quot;><i>Price</i></font></a><div id='toggleText' style='display: none' >&nbsp;&nbsp;".$pieces2a.$pieces2."</div>". 
'<br>'.$markcom.'<br>'.$com.$query4d.'</a>'; ?>" 

title="<?php echo $rows['painting']; ?>" 

onclick="return false" 

style="max-width:70px;max-height:70px;" rel="enlargeimage2" 
rev="targetdiv:loadarea,link:http://www.marknutt.com/photos/storage/ 
<?php echo $rows['file']; ?>"> 

這從目錄拉動圖像並將其顯示在與一列表的劃分。 rel =「enlargeimage2」激活此腳本。

<script type="text/javascript" src="thumbnailviewer_b.js"></script> 

ThumbnailViewer

您可以通過查看在行動這個腳本：

Loading a thumbnail with large image

目前我必須rolloever縮略圖放大。我知道如何將其改爲「點擊」，但不會在頁面加載時自動加載放大的圖像。 URL中的？name = Solanti可以更改爲任何圖像文件名。

我很快學習jQuery，但仍然有很多東西要學。誰能幫幫我嗎？

Answer 1

$(window).load(function(){ 
    $('#<yourImageID').fadeIn(1500); //fade image in once all the images (only 1?!) are loaded 


}) 

這應該做的伎倆，看起來不錯，因爲圖像會淡入，而不是加載uglily。