CODEWITHSUNDEEP
javascriptjqueryhtmlcolorbox
Javacadabra
Javacadabra

Reputation: 5758

Colorbox JQuery not opening on click

I'm a little confused as to why this isn't working for me. I've checked the network panel in firebug and I seem to be loading all my libraries fine.

Basically, I am using a library called Colorbox to create a lightbox when the user clicks on an image. However currently when they click on the image nothing happens.

This is my html:

<section style="padding-left:2px; margin-bottom: 20px;">
    <a rel="lightbox" href="images/classes1.jpg" class="lbox_gallery_img" title="one"><img src="images/classes1.jpg" width="77" height="52" alt="" /></a>
    <a rel="lightbox" href="images/classes2.jpg" class="lbox_gallery_img" title="two"><img src="images/classes2.jpg" width="77" height="52" alt="" /></a>
    <a rel="lightbox" href="images/classes3.jpg" class="lbox_gallery_img" title="three"><img src="images/classes3.jpg" width="77" height="52" alt="" /></a>
<section>

this is my JQuery:

$(document).ready(function(){
    $('a.lbox_gallery_img').colorbox();
});

Anybody know what might be going wrong?

Upvotes: 0

Views: 88

Answers (1)

newDevGeek
newDevGeek

Reputation: 373

I would suggest using either Firebug and/or Google Chrome's developer tools inspector (it is already present in chrome, press F12). Check the Network tab and look at the requests. This will help you figure out if there is a mistyped path, or any unreachable files. Also, you can check if there are any javascript errors when you click the 'console' button. Also, try adding jQuery.noConflict(); in your tag.

Upvotes: 1

Related Questions