Jquery Lightbox - 如何在页面加载时弹出特定幻灯片?

时间:2012-02-08 11:54:55

标签: jquery lightbox onload slide pageload

我有一个包含8个缩略图的页面,点击它时弹出一个jquery灯箱支架,然后允许用户下一个并显示2-3张图像。每个缩略图都有自己的2-3幻灯片库。

我需要的是当从导航面板点击页面上的文本链接时,它会将用户带到带有灯箱的页面,并在页面加载时自动弹出该链接的右侧幻灯片。

您可以在此处查看正在进行的工作> 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>

请告诉我在页面加载时自动加载特定幻灯片的代码。 非常感谢

1 个答案:

答案 0 :(得分:0)

您可以尝试模拟指定缩略图上的点击:

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

例如根据你的代码在主函数的末尾粘贴这一行:

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