2012-04-23 44 views
0

我想使用jqzoom圖庫應用程序而不是magiczoom。 我有兩個問題:如何在Jqzoom上顯示縮略圖標題

  1. Jqzoom在所有縮放顯示相同的標題。我想在放大的大圖像頂部顯示縮略圖標題。我怎樣才能做到這一點?
  2. 在magiczoom應用程序中,有一個小型放大鏡圖像和「縮放」文本,位於中等大小(要放大)圖像的頂部。我怎麼能在jqzoom上實現它?

回答

1

如果你有幾個元素與一些縮略圖來放大你必須命名「rel」屬性附加傷害到各組,以便它可以正確顯示您的圖片:

<a href="images/bora/bora1_lrg.jpg" class="jqzoom" rel='gal1' title="BORA"> 
    <img src="images/bora/bora1_md.jpg" title="BORA" style="border: 5px solid #666;"> 
</a> 
<br/> 
<a href='javascript:void(0);' rel="{gallery: 'gal1', smallimage: './images/bora/bora1_md.jpg',largeimage: './images/bora/bora1_lrg.jpg'}"><img src='images/bora/bora1_th.jpg'></a> 
<a href='javascript:void(0);' rel="{gallery: 'gal1', smallimage: './images/bora/bora2_md.jpg',largeimage: './images/bora/bora2_lrg.jpg'}"><img src='images/bora/bora2_th.jpg'></a> 
<a href='javascript:void(0);' rel="{gallery: 'gal1', smallimage: './images/bora/bora3_md.jpg',largeimage: './images/bora/bora3_lrg.jpg'}"><img src='images/bora/bora3_th.jpg'></a> 
<a href='javascript:void(0);' rel="{gallery: 'gal1', smallimage: './images/bora/bora4_md.jpg',largeimage: './images/bora/bora4_lrg.jpg'}"><img src='images/bora/bora4_th.jpg'></a> 
</div> 
<div class="example_column2" align="center"> 
    <a href="images/bora/bora5_lrg.jpg" class="jqzoom" rel='gal2' title="BORA"> 
    <img src="images/bora/bora5_md.jpg" title="BORA" style="border: 5px solid #666;"> 
    </a> 
    <br/> 
    <a href='javascript:void(0);' rel="{gallery: 'gal2', smallimage: './images/bora/bora5_md.jpg',largeimage: './images/bora/bora5_lrg.jpg'}"><img src='images/bora/bora5_th.jpg'></a> 
    <a href='javascript:void(0);' rel="{gallery: 'gal2', smallimage: './images/bora/bora6_md.jpg',largeimage: './images/bora/bora6_lrg.jpg'}"><img src='images/bora/bora6_th.jpg'></a> 
    <a href='javascript:void(0);' rel="{gallery: 'gal2', smallimage: './images/bora/bora7_md.jpg',largeimage: './images/bora/bora3_lrg.jpg'}"><img src='images/bora/bora7_th.jpg'></a> 
    <a href='javascript:void(0);' rel="{gallery: 'gal2', smallimage: './images/bora/bora7_md.jpg',largeimage: './images/bora/bora4_lrg.jpg'}"><img src='images/bora/bora7_th.jpg'></a> 
</div>