Stumped with jQuery plugin
Posted: Thu Oct 21, 2010 4:06 pm
I'd like to think I'm a relative expert with jQuery, but for some reason this isn't working. I wrote a complex plugin, which didn't work, and then I narrowed it down to a simple alert just to test, which still didn't work. I can't for the life of me figure out why.
Here's the header portion of my html file:
[syntax]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="google-site-verification" content="kYAfS0_rnpGfDYLkRycSbqUd9uh9gliRO8obwFhwSQk" />
<link href="<?= cn_template_url()?>jquery-ui.css" rel="stylesheet" type="text/css" />
<link href="<?= cn_template_url()?>style.css" rel="stylesheet" type="text/css" />
<link rel="shortcut icon" href="<?= cn_template_url()?>images/favicon.ico"/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jq ... "></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jq ... "></script>
<script type="text/javascript" src="<?=CN_URL?>modules/niteflipper/niteflipper.js"></script>
<script type="text/javascript" src="<?=CN_URL?>includes/js/jquery-ratings.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#niteflipper').niteflipper();
});
</script>
<?php cn_header();?>
</head>
[/syntax]
...and here's the content of my niteflipper.js file:
[syntax]
(function($){
$.fn.niteflipper = function() {
alert('test');
};
})(jQuery);
[/syntax]
I tried just having a regular Javascript function called niteflipper in the include file, and when calling that function by itself, the alert appeared, so the file is being included fine. And I also tried just changing the html of $('#niteflipper') to make sure it was selecting correctly, and that was also fine. For some reason the jQuery plugin isn't working.
Any ideas?
Thanks.
Here's the header portion of my html file:
[syntax]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="google-site-verification" content="kYAfS0_rnpGfDYLkRycSbqUd9uh9gliRO8obwFhwSQk" />
<link href="<?= cn_template_url()?>jquery-ui.css" rel="stylesheet" type="text/css" />
<link href="<?= cn_template_url()?>style.css" rel="stylesheet" type="text/css" />
<link rel="shortcut icon" href="<?= cn_template_url()?>images/favicon.ico"/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jq ... "></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jq ... "></script>
<script type="text/javascript" src="<?=CN_URL?>modules/niteflipper/niteflipper.js"></script>
<script type="text/javascript" src="<?=CN_URL?>includes/js/jquery-ratings.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#niteflipper').niteflipper();
});
</script>
<?php cn_header();?>
</head>
[/syntax]
...and here's the content of my niteflipper.js file:
[syntax]
(function($){
$.fn.niteflipper = function() {
alert('test');
};
})(jQuery);
[/syntax]
I tried just having a regular Javascript function called niteflipper in the include file, and when calling that function by itself, the alert appeared, so the file is being included fine. And I also tried just changing the html of $('#niteflipper') to make sure it was selecting correctly, and that was also fine. For some reason the jQuery plugin isn't working.
Any ideas?
Thanks.