2012-04-12 103 views
1

我正在創建照片庫幻燈片並使用本網站的代碼:http://www.gcmingati.net/wordpress/wp-content/lab/jquery/imagestrip/imageslide-plugin.htmljquery slideViewer無法正確顯示

我已經編寫了代碼,因爲它已經寫好了,我得到了幻燈片工作,但它不能正常工作。第一張圖像顯示正確,但每張後續圖像都沒有正確排列,最後一張圖像根本沒有顯示。無論我有多少圖像,最後一張圖像的問題都會發生。如果我只顯示4張圖像,則圖像#4不顯示。如果我顯示8張圖像,則圖像#8不顯示。

你可以在這裏查看我的幻燈片:http://jvidell.com/harlowlake.html

爲什麼它不是第一個圖像後排隊正確和不顯示最後一個圖像的任何想法或意見?

下面是圖片的HTML:

<div id="galleryMargin"> 
<div id="gallery" class="svw" style="width: 750px; height: 498px;"> 
<ul> 
<li><img src="img/harlowLake/HL001a.jpg" /></li> 
<li><img src="img/harlowLake/HL002a.jpg" /></li> 
<li><img src="img/harlowLake/HL003a.jpg" /></li> 
<li><img src="img/harlowLake/HL004a.jpg" /></li> 
</ul> 
</div> 
</div> 

這裏是腳本:

<script type="text/javascript"> 
$(window).bind("load", function() { 
$("div#gallery").slideView() 
}); 
</script> 

回答

1

問題是你已經設置邊框你的幻燈片圖像,這使得整個圖像的寬度大於容器寬度。所以只要刪除邊框,然後你應該看到最後一張圖片。

img { 
/*border: 1px solid black;*/ /*Remove this line*/ 
display: inline; 
} 
+0

非常感謝!我忘記了我早先在CSS中爲圖像設置了邊框。我刪除了它,解決了這個問題。 – Mock26 2012-04-12 03:41:09