Search code examples
jqueryfancybox

fancybox not working in firefox


i have been looking into this for a bit now and have become stuck.

i have loaded a simple fancybox pop up onto my site, it works perfect in IE9 and Chrome but for some reason its not working at all in firefox.

i am running this locally at the moment using IIS

the code for the incudes are:

<script type="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<script type="text/javascript">
$(document).ready(function() {

    /* This is basic - uses default settings */

    $("a.imagepop").fancybox();

});
</script>

and the html is:

<a class="imagepop" href="/wp-content/uploads/2011/11/imageTest1.png"><img class="alignnone size-full wp-image-30" title="imageTest1" src="http://localhost:8084/wp-content/uploads/2011/11/imageTest1.png" alt="" width="327" height="328" /></a>

i have tried to use firebug but all its telling me is: Use of getAttributeNodeNS() is deprecated. Use getAttributeNS() instead.


Solution

  • This is how I did and worked fine in Firefox:

        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
        <link href="jquery.fancybox-1.3.4/fancybox/jquery.fancybox-1.3.4.css" rel="stylesheet"
            type="text/css" />
        <script src="jquery.fancybox-1.3.4/fancybox/jquery.mousewheel-3.0.4.pack.js" type="text/javascript"></script>
        <script src="jquery.fancybox-1.3.4/fancybox/jquery.fancybox-1.3.4.pack.js" type="text/javascript"></script>
    
    
    
        <script type="text/javascript">
        $(document).ready(function () {
    
            /* This is basic - uses default settings */
    
            $("a.imagepop").fancybox();
    
        });
        </script>
    
        <div>
        <a class="imagepop" href="http://wallpapers.leovacity.be/images/Beautiful_flowers.jpg"><img class="alignnone size-full wp-image-30" title="imageTest1" src="http://wallpapers.leovacity.be/images/Beautiful_flowers.jpg" alt="" width="327" height="328" /></a>
        </div>