Uncaught TypeError: Object [object Object] has no method 'fancybox'

Question

I'm getting the following error when trying to use a plugin for JQuery.

Strangely, this was working perfectly (and still does) when it's inside a basic HTML file, but when I start filling things in with PHP I get this error.

`Uncaught TypeError: Object [object Object] has no method 'fancybox'`

The error is occurring on the line that includes...

 $('#show-slider').fancybox(function() {

Here's my html.

<?php
    require_once('includes/functions.php');

    $id = $_GET['id'];
    connect();

    $q = "select * from urls where id = $id";
    $r = mysql_query($q);

    if($r === FALSE) {
        die(mysql_error());
    } else {
        $arr = mysql_fetch_array($r);
    }

    mysql_close();
?>
<html>
<head>
<title><?=$arr[2]?></title>
<link rel="stylesheet" type="text/css" href="/includes/fancybox/jquery.fancybox-1.3.4.css" media="screen" />
<link rel="stylesheet" type="text/css" href="/includes/css/style.css" media="screen" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript" src="/includes/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<script type="text/javascript">
    function go() {
        $('#show-slider').fancybox(function() {
            $('#slider').css('display', 'inline');
        });

        $('#show-slider').click();
    }
</script>
</head>
<body>
<iframe src="<?=$arr[1]?>" width="100%" height="100%" onload="go();">
  <p>Your browser does not support iframes.</p>
</iframe>
<a id="show-slider" href="#slider" style="display: none;">Inline</a>
<div style="display: none;">
    <div id="slider">
        <?=$arr[3]?>
    </div>
</div>
</body>
</html>

EDIT: It looks like my .htaccess is messing with things a bit.

RewriteEngine On  
RewriteRule ([0-9]+) show.php?id=$1

What it should be doing is only taking URLs that are numbers and sending them to show.php, which is the file I posted above.

When I visit my css or javascript files in my browser, I get sent to the show.php page instead.

EDIT 2: Yep, it was the htaccess.

Here's the new version and everything is working great now.

RewriteEngine On  
RewriteRule ^([0-9]+)$ show.php?id=$1

Is anything your PHP outputs causing your HTML to become invalid? — Michael Berkowski
I just noticed that when I try to access a css or javascript file my .htaccess is interfering. I'll edit the original post with that info. — Chris R.

Adriano Adriano · Accepted Answer · 2011-12-20T13:42:13

Try to change the order of js files. place block of javascript code in body and the "fancybox-1.3.4.pack.js" before . for me works, good luck!

Uncaught TypeError: Object [object Object] has no method 'fancybox'

2 Answers