CODEWITHSUNDEEP
javascriptjqueryexceptionfancybox
Shawn Taylor
Shawn Taylor

Reputation: 1454

FancyBox Implementation Problems

I'm having some problems getting FancyBox to work...I figure its something pretty simple but I'm still a beginner with web design and the process is a little confusing to me right now. This is what I have so far:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="chrome=1">


    <!-- ******************* CSS ******************* -->
    <link rel="stylesheet" href="/fancybox/jquery.fancybox.css" type="text/css" media="screen" />

    <!-- ******************* Javascript ******************* -->
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    <script type="text/javascript" src="./fancybox/jquery.fancybox.pack-1.3.4.js"></script>
    <script type="text/javascript" src="./fancybox/jquery.fancybox.pack-1.3.4.pack.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $("a.iframe").fancybox();
        });
    </script>
</head>
<body>
    <a class="iframe" href="./iFrameFancy.html">Test FancyBox Here!</a>
</body>

The error I'm getting is pretty popular on SO but I've looked for all the fixes mentioned and nothing has worked yet. This is what I'm getting:

Uncaught TypeError: Object #<Object> has no method 'fancybox'

Any help with this would be greatly appreciated! Thanks all!

Upvotes: 0

Views: 260

Answers (2)

Anthony Hatzopoulos
Anthony Hatzopoulos

Reputation: 10537

You are loading fancybox twice (the normal source one and the packed one). Also remove the dot from your src attributes and make sure the file is where you say it is

So change this

<script type="text/javascript" src="./fancybox/jquery.fancybox.pack-1.3.4.js"></script>
<script type="text/javascript" src="./fancybox/jquery.fancybox.pack-1.3.4.pack.js"></script>

To this

<script type="text/javascript" src="/fancybox/jquery.fancybox.pack-1.3.4.js"></script>

or only this

<script type="text/javascript" src="/fancybox/jquery.fancybox.pack-1.3.4.pack.js"></script>

but not both

Upvotes: 1

Ryan Lynch
Ryan Lynch

Reputation: 7776

Try not including the fancybox js file twice on the same page.

Upvotes: 0

Related Questions