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

发布于 2025-01-03 14:22:21 字数 1980 浏览 1 评论 0原文

我有一个包含 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>

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

原文

I have a page with 8 thumbnails, which when clicked pop up a jquery lightbox holder, which then allows the user to next and prev through 2-3 images. Each thumbnail has its own 2-3 slide gallery.

What I need is when a text link is clicked on the page from the navigation panel, it takes the user to the page with the lightbox and pops up the right slide for that link automatically on page load.

You can see a work in progress here > http://www.logoflair.com/concept1/print.html

Here is the code I am using for the lightbox and 2 thumbnails in the body:

<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>

Please let me know what the code is to auto load a specific slide when the page loads.
Many Thanks

分享到QQ

分享到微博