How do I auto load Lightbox 2?

Question

I want the image to auto start but page opens with text links. The links work to open he box and the box works correctly but I want the box to open on page load instead of having to click a link. I have tried many combinations of auto start script but I must be missing something

<link href="lightbox.css" rel="stylesheet"/>

<script src="lightbox-plus-jquery.js"></script>
<script>
$(document).ready(function() {
    $('.MyClass').click();
});
</script>

<script src="lightbox.js"></script>

    <script type="text/javascript">
        // Automagically load Lightbox on Page Load - by Bramus! (http://www.bram.us/)
        // Code modded from http://www.huddletogether.com/forum/comments.php?DiscussionID=1269&page=1#Item_0
        function autoFireLightbox() {
            //Check if location.hash matches a lightbox-anchor. If so, trigger popup of image.
            setTimeout(function() {
                if(document.location.hash && $(document.location.hash.substr(1)).rel.indexOf('lightbox')!=-1) {
                    myLightbox.start($(document.location.hash.substr(1)));
                }},
                250
            );
        }
        Event.observe(window, 'load', autoFireLightbox, false);
</script>


</head>

<body>


<a href="images/bike1/1.jpg" data-lightbox="roadtrip">Image #1</a>
<a href="images/bike1/2.jpg" data-lightbox="roadtrip">Image #2</a>
<a href="images/bike1/3.jpg" data-lightbox="roadtrip">Image #3</a>
<a href="images/bike1/4.jpg" data-lightbox="roadtrip">Image #4</a>
<a href="images/bike1/5.jpg" data-lightbox="roadtrip">Image #5</a>
<a href="images/bike1/6.jpg" data-lightbox="roadtrip">Image #6</a>
<a href="images/bike1/7.jpg" data-lightbox="roadtrip">Image #7</a>


<script src="lightbox.js"></script>
</body>
</html>

How do I auto load Lightbox 2?

0 Answers0