javascript - Different alternatives for making the Jquery Library work -


i wondering how make jquery library work. have of course research on before asking question, , have book suggest doing following:

<script src="scripts/jquery-1.6.2.min.js"><script> 

however, reason, stuff on page not respond code this. confused. tried was, moving files working on same directory jquery-1.6.2.min.js, since jquery js library, didnt work. wondering be? have search syntax errors mad, reallllllyyyy doubt thats problem. wondering did wrong? other option can think of using website tag (which havnt tried yet):

<head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> </head> 

or

<head> <script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery- 1.6.2.min.js"></script> </head> 

which wanted avoid because didnt want rely of being on web when work, never know... thanks!

this full code way:

<!doctype html> <html> <head> <title>jquery goes dom-ville</title> <style> #change_me { position: absolute; top: 100px; left: 400px; font: 24px arial; } #move_up #move_down #color #disappear { padding: 5px; } </style> <script src="scripts/jquery-1.6.2.min.js"></script> </head> <body> <button id="move_up">move up</button> <button id="move_down">move down</button> <button id="color">change color</button> <button id="disappear">disappear/re-appear</button> <div id="change_me">make me stuff!</div> <script> $(document).ready(function() { $("#move_up").click( function() { $("#change_me").animate({top:30},200); });//end move_up $("#move_down").click( function() { $("#chage_me").animate({top:500},2000); });//end move_down $("#color").click( function() { $("#change_me").css("color", "purple"); });//end color $("disappear").click( function(){ $("#change_me").toggle("slow"); });//end disappear });//end doc ready </script> </body> </html> 

the problem path... using html pages? if so, there couple of things note:

1.) when path begins / means starts @ root folder.

2.) when path not start / means going start relative current folder in.

to fix:

inside folder html, make javascripts folder (you call anything, "js" example), , place jquery javascript files within it.

then use path jquery:

 <script type="text/javascript" src="/javascripts/jquery.min.js" 

this reference absolute path, if later on, have html files in nested folders, won't relative path absolute one.

as if want use google version when have internet, , local version when don't can use snippet:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.js"></script> <script type="text/javascript"> window.jquery || document.write("<script src='/path/to/jquery.js'><\/script>") </script> 

addendum:

fixed post reflect fabrício matté correction.

the absolute path can bit funky if you're not running behind webserver (apache example). why work on server, , not on computer.

if you're running locally, without webserver (don't this, install mamp or xamp, apache, nginx, iis, anything...), you'll need specify full path:

mac: /users/yourusername/sites/website/index.html

pc: c:/somethign/something/else/index.html


Comments