http://jspears8.mydevryportfolio.com/gallery1.html
我上传到我的学校作品集,希望对正在发生的事情有一个真实的看法。您打开的第一个 fancybox 元素不起作用。我正在使用预建的fancybox css。我已经尝试了其他几个。在我的实际页面中,它会加载一个空的花式框,并会加载循环通过的任何内容,但是当您漫步到该页面时,第一次点击每次都是空白的。
我究竟做错了什么?这是下面的画廊。
<div id="gallery">
<a href="images/AlatheusEberwolf.jpg" rel="Gallery" title="Alatheus Eberwolf"><img src="images/thumbs/AlatheusEberwolf_t.jpg" width="94" height="94" alt="Alatheus Eberwolf"></a>
<a href="images/Quentin_II.jpg" rel="Gallery" title="Quentin II"><img src="images/thumbs/Quentin_II_t.jpg" width="94" height="94" alt="Quentin II"></a>
<a href="images/RolithAlinaEngaged.jpg" rel="Gallery" title="Rolith and Alina Get Engaged"><img src="images/thumbs/RolithAlinaEngaged_t.jpg" width="94" height="94" alt="Rolith and Alina Get Engaged!"></a>
<a href="images/RolithAlinaMarried.jpg" rel="Gallery" title="Rolith and Alina Get Married"><img src="images/thumbs/RolithAlinaMarried_t.jpg" width="94" height="94" alt="Rolith and Alina Get Married"></a>
<a href="images/Spear-of-the-Ancients.jpg" rel="Gallery" title="Spear of the Ancients"> <img src="images/thumbs/Spear-of-the-Ancients_t.jpg" width="94" height="94" alt="Spear of the Ancients"></a>
<a href="images/Tep_Itaki.jpg" rel="Gallery" title="Tep Itaki"><img src="images/thumbs/Tep_Itaki_t.jpg" width="94" height="94" alt="Tep Itaki"></a>
</div>
Javascript
$(document).ready(function() { $('#gallery a').fancybox({ overlayColor: '#0CF', overlayOpacity: .3, transitionIn: 'elastic', transitionOut: 'elastic', easingIn: ' easeInSine', easingOut: 'easeOutSine', titlePosition: 'outside' ,
循环: true }); }); // 结束准备