Question

I recently came across fancy box located here, I've followed every step in the instructions perfectly, but it doesn't work, anyone know what might be the problem?

Here is a sample of my page source:

Included the links to scripts as required, and CSS:

<script src="jquery.fancybox-1.2.1/jquery.fancybox/jquery-1.3.2.min.js" type="text/javascript"></script>
    <script src="jquery.fancybox-1.2.1/jquery.fancybox/jquery.fancybox-1.2.1.js" type="text/javascript"></script>
    <link href="jquery.fancybox-1.2.1/jquery.fancybox/jquery.fancybox.css" rel="stylesheet"
        type="text/css" />
    <link href="css/main.css" rel="stylesheet" type="text/css" />

Then this should simply work:

<a id="single_image" href="images/279641.jpg"><img src="images/279641.jpg" /></a>

But it doesn't seem to do anything except open the image in a new window.

Any suggestions, and thanks in advance.

Was it helpful?

Solution

You forgot to implement step 4 (now step 5) from the manual, "Fire plugin using jQuery selector"

OTHER TIPS

Try to include this one:

$(document).ready(function() {
 $("a#single_image").fancybox({
 'titleShow' : false
 });
});

try to look at another javascript/jquery plugin you've implemented in your html page. cause some jquery plugin has a conflict with fancybox. it works for me.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top