JQuery Tutorials, Tips & Tricks

jQuery is a cross-browser JavaScript library designed to simplify the client-side scripting of HTML. It was released in January 2006 at BarCamp NYC by John Resig. Used by over 49% of the 10,000 most visited websites, jQuery is the most popular JavaScript library in use today.

jQuery is free, open source software, dual-licensed under the MIT License or the GNU General Public License, Version 2. jQuery’s syntax is designed to make it easier to navigate a document, select DOM elements, create animations, handle events, and develop Ajax applications. jQuery also provides capabilities for developers to create plug-ins on top of the JavaScript library. This enables developers to create abstractions for low-level interaction and animation, advanced effects and high-level, theme-able widgets. The modular approach to the jQuery framework allows the creation of powerful and dynamic web pages and web applications.

jQuery window height is not correct

Quick fix for JQuery window height issue. Jquery sometime shows incorrect height for $(window). This is fix to correct that bug.

JQuery Trigger Event on Show/Hide of Element

JQuery provides powerful API to manage triggering of events. It provides a way to trigger the event handlers bound to an element without any user interaction via the .trigger() method. The .on() method (previously known as .live()) is a great way to add custom handlers to different browser events. When such events are triggered, these custom handlers ...

Lazy Load Image & WordPress Gravatar using JavaScript / JQuery

Lazy Load Image & Wordpress Gravatar using JavaScript / JQuery
A webpage load time plays a very crucial role in SEO and impacts your website ranking significantly. Google has already incorporated site speed as one of the several signals that it uses to determine search ranking. The faster your website loads the better it will perform in google ranking. There are several things one can do ...

jQuery :not() selector example

jQuery :not() selector example
It's been a while since I wrote about JQuery. I am spending most of my time these days on backend technologies. Recently while working on a typical requirement on UI, I had to play with some tricky JQuery selectors. Typically, most of the times we uses JQuery's class selectors or id selectors for example: $('#someid').hide(); $('div#container').css('height', '100%'); $('.someclass').hide(); $('div.entry').css('height', '100%'); But recently I had a requirement where I had to ...

Facebook Style Scroll Fixed Header in JQuery

While doing some UI changes of a website, we had to implement a FIX header which remains fix on top of screen while scrolling. Facebook has a similar header which remains on top of content. Now for this, there are number of jQuery plugins available out there! But in our case we weren't allowed to add any new plugins to the technology stack of application ...

Create a Clearable TextBox with jQuery

Create a Clearable TextBox with jQuery
Recently I came across a wonderful article by David Walsh on Clearable Textboxes with Dojo Toolkit . This is a simple implementation where a clear button (x) added in a textbox which lets user to clear the content of the textbox. I have seen this simple feature in many websites and feel its very ...

jQuery: Get the Text of Element without Child Element

While writing code in jQuery, I often use .text() method to get the content of any element from DOM. This function is straight forward, it strips off all the html element from a selected element and returns the remaining text. So for below element the .text() method will return "A quick brown fox". <div id="foo"> A quick brown fox </div> <script> $("#foo").text(); ...

Dynamically shortened Text with “Show More” link using jQuery

Dynamically shortened Text with
Update: The plugin is now on GitHub: https://github.com/viralpatel/jquery.shorten Facebook user updates has a great functionality. If the comment text is larger than few characters, the extra words are hide and a show more link is presented to user. This way you can keep long text out of the view to user and stop the ...
Tags: , ,

jQuery Ajax – Handling unauthenticated requests via Ajax

jQuery Ajax - Handling unauthenticated requests via Ajax
Since few days I am working on a small project where I have to deal with lot of Ajax requests. The whole UI is designed such that only appropriate parts are refreshed with required information through Ajax. The application needs user authentication before accessing any part of it. Although this is easy to achieve in any MVC ...

Multiple Checkbox Select/Deselect using jQuery – Tutorial with Example

Multiple Checkbox Select/Deselect using jQuery - Tutorial with Example
Almost all the user interfaces that I have created had this functionality of selecting multiple items from a list to process them or delete them. Although its very very easy to implement this functionality in Javascript, using jQuery for this is real fun. I will show you a simple implementation of adding multiple checkbox select and ...
Page 1 of 41234