Austen
Austen

Reputation: 293

jQuery "uniform" plugin code doesn't work

So, I've never used jQuery before, but there is a script I want called Uniform, but I can't seem to get it to work. In the Safari debugger it is giving me 3 errors:

[Error] SyntaxError: Unexpected token '<' (jquery.js, line 1)
[Error] SyntaxError: Unexpected token '<' (jquery.uniform.js, line 1)
[Error] ReferenceError: Can't find variable: $
    global code (index.php, line 8)

Here is the beginning of my index.php file:

<html>
<head>
<title>PattersonCode.ca</title>
<link rel="stylesheet" type="text/css" href="/incls/style.css">
<script src="incls/jquery.js"></script>
<script src="incls/jquery.uniform.js"></script>
<script type="text/javascript">
$(function() {
   $("select, input, a.button, button").uniform();
})
</script>
</head>

Solved it by using a full URL (http://pattersoncode.ca/incls/uniform.jquery.js)

Upvotes: 2

Views: 7880

Answers (2)

Sp3igel
Sp3igel

Reputation: 286

Is it possible that you need to use the document.ready() block to make sure everything has loaded up before you execute the script? (shot in the dark here)

$(document).ready(function() {
   // code here
   $(function() {
     $("select, input, a.button, button").uniform();
   })
});

also from the uniform site:

<!-- Make sure your CSS file is listed before jQuery -->
<link rel="stylesheet" href="uniform.default.css" media="screen" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script src="jquery.uniform.js"></script>

SO you might need Jquery 1.8

EDIT:

this works for me ... Using both jQuery 1.8 and 1.10.1 I downloaded Uniform 2.1.1 and extracted it into the incls folder

<html>
<head>
<title>PattersonCode.ca</title>
<link rel="stylesheet" href="incls/themes/default/css/uniform.default.css" media="screen" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script src="incls/jquery.uniform.js"></script>
<script type="text/javascript">
$(document).ready(function() {
   // code here
   $(function() {
     $("select, input, a.button, button").uniform();
   })
});
</script>
</head>
 <body>
<input type="text" value="banana" size="15" />
</body>
</html>

Upvotes: 1

Ravi Gadag
Ravi Gadag

Reputation: 15881

may be you are jquery path is wrong or you don't have file in that folder..

i would like to suggest use jquery CDN with fallback code.

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script type="text/javascript">
if (typeof jQuery == 'undefined') {
    document.write(unescape("%3Cscript src='incls/jquery.js' type='text/javascript'%3E%3C/script%3E"));
}
</script>
<script src="incls/jquery.uniform.js"></script>

Upvotes: 0

Related Questions