2012-02-08 102 views
0

我有一个页面有8个缩略图,当点击时弹出一个jquery灯箱,然后允许用户下一个和prev通过2-3个图像。每个缩略图都有自己的2-3张幻灯片库。Jquery Lightbox - 如何在页面加载时弹出特定幻灯片?

我需要时,从点击导航面板页面上的文本链接,它会将用户的页面与灯箱和弹出自动在页面加载该链接右边的幻灯片。

你可以看到正在进行的工作在这里>http://www.logoflair.com/concept1/print.html

这里是我使用的收藏夹码和2个缩略图在身:

<script type="text/javascript" src="js/jquery.js"></script> 
<script type="text/javascript" src="jquery.lightbox-0.5.js"></script> 

<script type='text/javascript'> 
var $jq132 = jQuery.noConflict(); 
</script> 

    <script type="text/javascript"> 
$jq132(function() { 
    $jq132('#belgo1 a').lightBox(); 
    $jq132('#versace1 a').lightBox(); 
    $jq132('#etv1 a').lightBox(); 
    $jq132('#versace2 a').lightBox(); 
    $jq132('#belgo2 a').lightBox(); 
    $jq132('#belgo3 a').lightBox(); 
    $jq132('#versace3 a').lightBox(); 
    $jq132('#fatpets a').lightBox(); 
    $jq132('#moschino a').lightBox(); 
    $jq132('#bay a').lightBox(); 
    $jq132('#sayhoo a').lightBox(); 
}); 
</script> 

<body> 

    <div id="belgo1" class="galleries"> 
     <a href="belgo1.jpg"><img src="belgothumb.jpg" alt="" width="232" height="189"   border="0"/></a> 
     <a class="hidden" href="belgo2.jpg"><img src="belgothumb.jpg" alt="" width="232" height="189" border="0"/></a> 
     <a class="hidden" href="belgo3.jpg"><img src="belgothumb.jpg" alt="" width="232" height="189" border="0"/></a> 
     </div> 



    <div id="versace1" class="galleries"> 
     <a href="versace1.jpg"><img src="versacethumb.jpg" alt="" width="232" height="189" border="0"/></a> 
     <a class="hidden" href="versace2.jpg"><img src="versacethumb.jpg" alt="" width="232" height="189" border="0"/></a> 
     </div> 

</body> 

请让我知道的代码是什么在页面加载时自动加载特定幻灯片。 非常感谢

回答

0

你可以尝试模拟点击指定的缩略图:根据您的代码粘贴这一行你的主要功能的结束

$('#thumbnailId').click(); 

例如:

$jq132('#etv1 a').eq(0).click(); 
+0

这就是排序我之后的事情,我希望页面单击幻灯片本身,而无需用户做任何事情,我应该在代码中放置此行?主要功能之后? – 2012-02-08 12:02:53

+0

我已更新代码 – antyrat 2012-02-08 12:06:33

+0

完美的作品,非常感谢! – 2012-02-08 12:14:43