HI-TRANSFER

jQuery is the most popular java script library is used in today.it greatly simplifies java script programming.Here I listed most popular and very useful jQuery cheat sheet collection on the Internet,for anyone who like to learn jQuery.You can get more cheat sheets mentioned here as pdf files or image(.png,.jpeg) files.

jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. jQuery is designed to change the way that you write JavaScript.

From http://jquery.com/

1. jQuery 1.4.2 Visual Cheat Sheet

jQuery Visual Cheat Sheet, the refined and updated version of the popular woork's jQuery Cheat Sheet. The new edition includes all the reference you will ever need for jQuery 1.4.2 API!



Article : http://woorkup.com/2010/06/13/jquery-1-4-2-visual-cheat-sheet/

Download : http://woorkup.com/wp-content/uploads/2010/06/jQuery-Visual-Cheat-Sheet-1.4.2.pdf


2. jQuery 1.4 Cheat Sheet

This cheet sheet attempts to better align with the new documentation structure jQuery is now using and clearly marks all new and updated functions for jQuery 1.4.



Article : http://labs.impulsestudios.ca/jquery-cheat-sheet

Download : http://labs.impulsestudios.ca/downloads/impulse_studios-jquery_cheat_sheet-1.0.pdf


3. jQuery Selectors

jQuery selectors are one of the most important aspects of the jQuery library. These selectors use familiar CSS syntax to allow page authors to quickly and easily identify any set of page elements to operate upon with the jQuery library methods. Understanding jQuery selectors is the key to using the jQuery library most effectively. This reference card puts the power of jQuery selectors at your very fingertips.

You must register(it is free) to get this cheat sheet.



Article : http://refcardz.dzone.com/refcardz/jquery-selectors


4. jQuery 1.4.4 API Cheat Sheet



Article : http://www.futurecolors.ru/jquery/

Download :
http://www.futurecolors.ru/jquery/jquery.cheatsheet.1.4.pdf
http://www.futurecolors.ru/jquery/jquery.cheatsheet.1.4.png


5. jQuery 1.3 cheat sheet wallpaper



Article : http://www.gmtaz.com/jquery-13-cheatsheet-wallpaper/


6. jQuery Cheat Sheet - jQuery 1.3.2



Article : http://www.javascripttoolbox.com/jquery/cheatsheet/


7. jQuery Cheat Sheet - jQuery 1.1.3



Article : http://www.javascripttoolbox.com/jquery/cheatsheet/


8. jQuery - YUI3 Rosetta Stone



Article : http://carlos.bueno.org/jq-yui.html#start


9. jQuery 1.3 Cheatsheet



Article : http://blog.acodingfool.com/cheatsheets/jquery-1-3-cheatsheet/


10. jQuery 1.3 Visual Cheat Sheet



Article : http://woork.blogspot.com/2009/09/jquery-visual-cheat-sheet.html

Download : http://www.scribd.com/doc/20161482/jQuery-Visual-Cheat-Sheet-by-WOORK


11. jQuery cheatsheet wallpaper



Article : http://chris4403.blogspot.com/2008/01/jquery-cheatsheet-wallpaper.html

Download :
http://cheatsheet.googlecode.com/svn/trunk/cheatsheet/src/jquery/jquery1.2-cheatsheet-1280-001.png
http://cheatsheet.googlecode.com/svn/trunk/cheatsheet/src/jquery/jquery1.2-cheatsheet-1280-002.png


12. jQuery 1.2 Cheat Sheet (colorcharge.com)



Article : http://colorcharge.com/jquery/


13. jTouch � jQuery Cheat Sheet for iPhone



Article : http://jtouch.colorcharge.com/


14. jQuery 1.2 Cheat Sheet



Article : http://www.gscottolson.com/weblog/2008/01/11/jquery-cheat-sheet/

Download : http://www.gscottolson.com/jquery/jQuery1.2.cheatsheet.v1.0.pdf


15. jQuery Selectors by codylindley.com



Article : http://codylindley.com/jqueryselectors/

This is a free service and it is provided by http://www.onlineleaf.com/.Their standby engine is deliver a fully functional and simple way to help your website run requiring less energy to generate. It hides heavy animations, covers the window in dark colors (as these, in many cases are less energy consuming) and pauses heavily running background processes.

When your visitors are inactive, this engine launch a standby screen, with the text "Energy saving mode".



This is very easy to add to your website or blog with in few seconds.

Login to your Blogger dashboard --> Design --> Edit HTML.

You don't need to click on "Expand Widget Templates".

Scroll down to where you see the </head> tag of your template.

Now copy below code and paste it just before the </head> tag.

<script language='javascript' src='http://www.onlineleaf.com/savetheenvironment.js' type='text/javascript'/>

This standby engine uses the jQuery Javascript library, so if you are using other Javascript libraries or code, add below code instead of above code :

<script language='javascript' src='http://www.onlineleaf.com/savetheenvironment.js' type='text/javascript'/>

<script>jQuery.noConflict();</script>

Time of inactivity

Also you can easily define how long time your visitors have to be inactive, for the engine to launch the standby screen, by adding ?time=X where X should be replaced with the number of seconds you would like to define the time interval. An example could be:

<script language="javascript" type="text/javascript" src="http://www.onlineleaf.com/savetheenvironment.js?time=120"></script>

... which will set the time of inactivity to 2 minutes (120 seconds).

This can be configured to display in any of the supported languages, if you add ?lang=code, where code is one of the language short codes below.

Supported languages

ak - Akan
da - Danish
de - German
en - English
es - Spanish
fr - French
fi - Filipino
gr - Greek
hr - Croatian
id - Indonesian
jp - Japanese
it - Italian
nl - Dutch
pl - Polish
pt - Portuguese
bpt - Brazilian Portuguese
ro - Romanian
sl - Slovenian
se - Swedish
sk - Slovak
sw - Swahili
tr - Turkish
vi - Vietnamese

The following example will be using Spanish for the standby screen:

<script language="javascript" type="text/javascript" src="http://www.onlineleaf.com/savetheenvironment.js?lang=es"></script>

If you are using WordPress, just download their plugin, activate it and everything should work instantly.

If you are using Internet Explorer version 6, you can see png images of web pages showing inside a white background. It add a bad appearance to your website or blog.This is a problem because still some people are using Internet Explorer version 6,it is the default browser for windows XP.So this quick and simple tutorial will show you how to fix this PNG transparency problem in Internet Explorer 6.

Login to your Blogger dashboard --> Design --> Edit HTML.

You don't need to click on "Expand Widget Templates".

Scroll down to where you see the </head> tag of your template.

Now copy below code and paste it just before the </head> tag.

<!--[if lt IE 7]>
<script type="text/javascript" src="http://bnote.googlecode.com/files/unitpngfix.js"></script>
<![endif]-->

I have hosted "unitpngfix.js" file on google code.

Note : Best thing is, hosting this "unitpngfix.js" file yourself.So you can download it from HERE.

Now save your template and you are done.You can check updates and more details of this script from http://labs.unitinteractive.com/unitpngfix.php.

If you use MooTools(http://mootools.net/) script inside your blogger template, mostly your Google Friend Connect widget will disappear from your blogger blog and only shows a white space.This is a serious problem to more bloggers.I also have faced to this problem and finally find the solution for this problem.I thinks this little trick will also helpful to others and decide to explain how to solve this problem.

MooTools is a compact, modular, Object-Oriented JavaScript framework designed for the intermediate to advanced JavaScript developer. It allows you to write powerful, flexible, and cross-browser code with its elegant, well documented, and coherent API.

MooTools can be included in your template in 2 ways.

First way:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/mootools/1.2.4/mootools-yui-compressed.js"></script>

Second way:

<script src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("mootools", "1.2.4");
</script>

You can do this with in few seconds.Now follow the steps given below.



Login to your Blogger dashboard --> Design --> Edit HTML.

You don't need to click on "Expand Widget Templates".

Scroll down to where you see the </head> tag of your template.

Now copy below code and paste it just before the </head> tag.

<script type='text/javascript'>
//<![CDATA[

JSON.extend({
parse: function(string) {
return JSON.decode(string);
},
stringify: function(obj) {
return JSON.encode(obj);
}
});

//]]>
</script>

Save your template and you are done.

When your problem is fixed, please don't forget to leave a comment.

Using jQuery,we can do many things very easily than normal JavaScript.So jQuery has became the most popular JavaScript library in use today.I wrote my previous article about popular jQuery featured content sliders,that are used by web designers.In this article I am going to show you a better jQuery Tabs collection you can use for your websites or blogs.When we go to websites,we can see different types of jQuery Tabs.If you add a tab view to your website,it save a lot of space in your web pages.Also it gives a better appearance to your website or blog.

You can visit authors websites for configuration instructions/guides,can view live demos of these jQuery Tabs and also you can download files of these tabs using the URLs given below.I checked all of these links and they are working correctly.But in future if this links doesn't work, please leave a comment.I hope to add more jQuery tabs to this article in the future ,so bookmark this web page for future reference.If there is a jQuery tab you like,but you can not add it to your website or blog yourself,you can contact me,I can do it for you.

1. Simple Tabs w/ CSS & jQuery



Article : http://www.sohtanaka.com/web-design/simple-tabs-w-css-jquery/

Demo : http://www.sohtanaka.com/web-design/examples/tabs/


2. jQuery Tabbed Interface / Tabbed Structure Menu Tutorial



Article : http://www.queness.com/post/106/jquery-tabbed-interfacetabbed-structure-menu-tutorial

Demo : http://www.queness.com/resources/html/tabmenu/jquery-tabbed-menu-queness.html

Download : http://www.queness.com/resources/archives/jquery-tab-menu.zip


3. jQuery Sliding Tab Menu for Sidebar Tutorial



Article : http://www.queness.com/post/274/jquery-sliding-tab-menu-for-sidebar-tutorial

Demo : http://www.queness.com/resources/html/scrollto/index.html

Download : http://www.queness.com/resources/archives/jquery-scrollto.zip


4. Create a smooth tabbed menu in jQuery


Article : http://yensdesign.com/2008/12/create-a-smooth-tabbed-menu-in-jquery/

Demo : http://yensdesign.com/tutorials/tabs/

Download : http://www.yensdesign.com/tutorials/tabs/tabs.zip


5. Updated JQuery Nested Tab Set with Demo



Article : http://blog.cutterscrossing.com/index.cfm/2007/6/15/Updated-JQuery-Nested-Tab-Set-with-Demo

Demo : http://blog.cutterscrossing.com/index.cfm/2007/6/15/Updated-JQuery-Nested-Tab-Set-with-Demo

Download : http://blog.cutterscrossing.com/enclosures/JQueryTabsDemo.zip


6. Sweet AJAX Tabs With jQuery 1.4 & CSS3



Article : http://tutorialzine.com/2010/01/sweet-tabs-jquery-ajax-css/

Demo : http://demo.tutorialzine.com/2010/01/sweet-tabs-jquery-ajax-css/demo.html

Download : http://demo.tutorialzine.com/2010/01/sweet-tabs-jquery-ajax-css/demo.zip


7. Animated tabbed content with jQuery



Article : http://www.gayadesign.com/diy/animated-tabbed-content-with-jquery/

Demo : http://www.gayadesign.com/scripts/tabbed/

Download : http://www.gayadesign.com/scripts/tabbed/tabbedContent.zip


8. Tab Navigation with Smooth Horizontal Sliding Using jQuery



Article : http://www.learningjquery.com/2009/09/tab-navigation-with-smooth-horizontal-sliding-using-jquery

Demo : http://www.learningjquery.com/2009/09/tab-navigation-with-smooth-horizontal-sliding-using-jquery

Download : http://assets.learningjquery.com/zips/tab-nav.zip


9. jQuery idTabs



Article : http://www.sunsean.com/idTabs/

Demo : http://www.sunsean.com/idTabs/

Download : http://www.sunsean.com/idTabs/jquery.idTabs.min.js


10. Flowplayer Tabs



Article : http://flowplayer.org/tools/tabs/index.html

Demo : http://flowplayer.org/tools/demos/tabs/index.html

Download : http://flowplayer.org/tools/img/tabs/tabs.zip
http://flowplayer.org/tools/download/index.html


11. Create a Slide Tabbed Box using jQuery



Article : http://www.hieu.co.uk/blog/index.php/2009/01/28/how-easy-to-create-a-slide-tabbed-box-using-jquery/

Demo : http://www.hieu.co.uk/Examples/SlideTabs/index.html

Download : http://www.hieu.co.uk/Examples/SlideTabs.zip


12. Flipping Content Tabs Using jQuery



Article : http://webdeveloperplus.com/jquery/create-flipping-content-tabs-using-jquery/

Demo : http://demo.webdeveloperplus.com/flipping-tabs/

Download : http://demo.webdeveloperplus.com/source-code/flipping-tabs.zip


13. Create A Tabbed Interface Using jQuery



Article : http://net.tutsplus.com/javascript-ajax/create-a-tabbed-interface-using-jquery/

Demo : http://nettuts.s3.amazonaws.com/042_jQueryUITabs/demo/index.html

Download : http://nettuts.s3.amazonaws.com/042_jQueryUITabs/source.zip


14. Create a Slick Tabbed Content Area using CSS & jQuery



Article : http://net.tutsplus.com/html-css-techniques/how-to-create-a-slick-tabbed-content-area/

Demo : http://nettuts.s3.amazonaws.com/001_Tabbed/site/jQuery.html

Download : http://nettuts.s3.amazonaws.com/001_Tabbed/TabsPSD.zip


15. Dynamic Fun with SimplePie and jQuery



Article : http://net.tutsplus.com/javascript-ajax/building-a-better-blogroll-dynamic-fun-with-simplepie-and-jquery/

Demo : http://nettuts.s3.amazonaws.com/036_BetterBlogRoll/sourceFiles/index.html

Download : http://nettuts.s3.amazonaws.com/036_BetterBlogRoll/sourceFiles.zip


16. Creating Rotating Tabs using jQuery



Article : http://www.ilovecolors.com.ar/rotating-jquery-tabs/

Demo : http://www.ilovecolors.com.ar/wp-content/uploads/rotating-jquery-tabs/

Download : http://www.ilovecolors.com.ar/wp-content/uploads/2009/12/rotating-jquery-tabs1.zip


17. Ultra simple jQuery tabs



Article : http://justfreetemplates.com/blog/2009/08/31/ultra-simple-jquery-tabs.html

Demo : http://justfreetemplates.com/blog/wp-content/uploads/2009/08/simple-jquery-tabs.html


18. jQuery To Fade Effects tabs



Article : http://www.roseindia.net/ajax/jquery/fadeEffectTabs.shtml

Demo : http://www.roseindia.net/ajax/jquery/fadeEffectTab.html


19. Playing with jQuery Tabs



Article : http://insideria.com/2009/03/playing-with-jquery-tabs.html

Demo : http://www.coldfusionjedi.com/demos/jquerytabs/test.cfm


20. Degradable Tabs With jQuery UI



Article : http://www.ultramegatech.com/blog/2009/09/degradable-tabs-with-jquery-ui/

Demo : http://www.ultramegatech.com/blog/examples/tabs.htm


21. jQuery UI Tabs with Next/Previous



Article : http://css-tricks.com/jquery-ui-tabs-with-nextprevious/

Demo : http://css-tricks.com/examples/TabsNextPrev/

Download : http://css-tricks.com/examples/TabsNextPrev.zip

jQuery is a cross-browser JavaScript library designed to simplify the client-side scripting of HTML.Also jQuery is the most popular JavaScript library in use today.In this article,I have listed most popular 17 jQuery featured content slideshows/sliders for your blog or website.You can visit authors websites for configuration instructions and can view live demos of these sliders using the URLs given below.But if you can not add these sliders to your website or blog yourself,you can contact me,I can do it for you.

Using the Wonderful jFlow Plugin



Article : http://net.tutsplus.com/articles/news/using-the-wonderful-jflow-plugin-screencast/

Demo : http://nettuts.s3.amazonaws.com/078_screencast2/jFlowTutorial/index.htm


Automatic Image Slider w/ CSS & jQuery



Article : http://www.sohtanaka.com/web-design/automatic-image-slider-w-css-jquery/

Demo : http://www.sohtanaka.com/web-design/examples/image-slider/


Easy Slider 1.7 - Numeric Navigation jQuery Slider



Article : http://cssglobe.com/post/5780/easy-slider-17-numeric-navigation-jquery-slider

Demo : http://cssglobe.com/lab/easyslider1.7/02.html


Beautiful jQuery slider tutorial



Article : http://www.dreamcss.com/2009/04/create-beautiful-jquery-sliders.html

Demo : http://gadgetinspiration.com/blog/wp-content/uploads/jquery%20sliders/index.html


jCarousel Lite



Article : http://www.gmarwaha.com/jquery/jcarousellite/

Demo : http://www.gmarwaha.com/jquery/jcarousellite/


Featured Content Slider Using jQuery UI



Article : http://webdeveloperplus.com/jquery/featured-content-slider-using-jquery-ui/

Demo : http://demo.webdeveloperplus.com/featured-content-slider/


jQuery Tools Scrollable



Article : http://flowplayer.org/tools/demos/scrollable/index.html

Demo : http://flowplayer.org/tools/demos/scrollable/index.htm


AnythingSlider jQuery Plugin



Article : http://css-tricks.com/anythingslider-jquery-plugin/

Demo : http://css-tricks.com/examples/AnythingSlider/


Animate Panning Slideshow with jQuery



Article : http://buildinternet.com/2010/02/animate-panning-slideshow-with-jquery/

Demo : http://s3.amazonaws.com/buildinternet/live-tutorials/panning-slideshow/panning-slideshow.htm


Moving Boxes



Article : http://css-tricks.com/moving-boxes/

Demo : http://css-tricks.com/examples/MovingBoxes/


Making a Content Slider with jQuery UI



Article : http://net.tutsplus.com/tutorials/javascript-ajax/making-a-content-slider-with-jquery-ui/

Demo : http://nettuts.s3.amazonaws.com/377_slider/slider_sourcefiles/slider.html


Supersized � Full Screen Slideshow jQuery Plugin



Article : http://buildinternet.com/2009/02/supersized-full-screen-backgroundslideshow-jquery-plugin/

Demo : http://buildinternet.com/live/supersized/


Sliding Boxes and Captions with jQuery



Article : http://buildinternet.com/2009/03/sliding-boxes-and-captions-with-jquery/

Demo : https://buildinternet.s3.amazonaws.com/live-tutorials/sliding-boxes/index.htm


Creating a Slick Auto-Playing Featured Content Slider



Article : http://css-tricks.com/creating-a-slick-auto-playing-featured-content-slider/

Demo : http://css-tricks.com/examples/FeaturedContentSlider/


Simple Controls Gallery v1.3



Article : http://www.dynamicdrive.com/dynamicindex4/simplegallery.htm

Demo : http://www.dynamicdrive.com/dynamicindex4/simplegallery.htm


loopedSlider



Article : http://github.com/nathansearles/loopedSlider

Demo : http://nathansearles.com/loopedslider/example-1.html


CrossSlide



Article : http://tobia.github.com/CrossSlide/

Demo : http://tobia.github.com/CrossSlide/