jquery in Blogger / Blogspot |
How to add jquery to Blogger
To add jquery to your Blogspot Blog you need to host the jquery.main.js file some where.. i use Google codes to host jquery files and link them to my blogs. Recently i created a blog of jquery events that have a lot of jquery tutorials in blogger. some menus galleries and many more.You can download the above file if you want to host it to your own at google Codes.
add this jquery file to your Blogger Blogspot ater <Hear> tags
<script src="http://jshosting.googlecode.com/files/jquery.min.js" type="text/javascript"> </script>
Some basic Jquery events in Blogger
Link Hover animation.
jquery Toggle or slide panel.
Sgow | hide with jquery.
Smooth Scroll to top with jquery.
Link Hover animation:
Demoonce you have added jquery to your Blogger lets test this simple jquery animation. this is a link hover animation that addes opecity to the link the code is given below copy the code and past it above </head> or after the jquery.main.js
<script type='text/javascript'> $(document).ready(function() { $('.sidebar a, .menu li, .post-body a, .post h3 a, #footer a').hover(function() { //mouse in $(this).animate({ opacity: '0.4px' }, 1000); }, function() { //mouse out $(this).animate({ opacity: 1 }, 1000); }); }); </script>
Comments
Post a Comment