background preloader

jQuery

Facebook Twitter

jQuery News Ticker (BBC Style) Commonly Confused Bits Of jQuery. Advertisement The explosion of JavaScript libraries and frameworks such as jQuery onto the front-end development scene has opened up the power of JavaScript to a far wider audience than ever before. It was born of the need — expressed by a crescendo of screaming by front-end developers who were fast running out of hair to pull out — to improve JavaScript’s somewhat primitive API, to make up for the lack of unified implementation across browsers and to make it more compact in its syntax.

All of which means that, unless you have some odd grudge against jQuery, those days are gone — you can actually get stuff done now. A script to find all links of a certain CSS class in a document and bind an event to them now requires one line of code, not 10. To power this, jQuery brings to the party its own API, featuring a host of functions, methods and syntactical peculiarities.

Some are confused or appear similar to each other but actually differ in some way. Parent(selector) parents(selector) bind() Real Person. This plugin is designed to help overcome automated form submission by requiring a "real person" to identify text made up of dots. The entered value is compared on the server with the generated value to determine whether processing should continue. The real person functionality can easily be added to an input field with appropriate default settings. You can also remove the real person functionality if it is no longer required. Show code $('#defaultReal').realperson(); $('#disableReal').toggle(function() { $(this).text('Enable'); $('#defaultReal').realperson('disable'); }, function() { $(this).text('Disable'); $('#defaultReal').realperson('enable'); } ); $('#removeReal').toggle(function() { $(this).text('Re-attach'); $('#defaultReal').realperson('destroy'); }, function() { $(this).text('Remove'); $('#defaultReal').realperson(); } ); You can override the defaults globally as shown below: Customise the real person functionality through additional settings.

Different length: Java. Path animation. Sexy AlertBox. Sexy Alert Box es un clon "sexy" del clásico alert de javascript. Con un aire a lightbox, cambia las feas alertas de windows por alertas mas atractivas!. Copyright (c) 2008 www.coders.me (Eduardo D. Sada) Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

Bubble Tooltip. Textarea expandable. Pretty Date. One method that I’ve been wanting for quite a while now was a simple way to format old JavaScript dates in a “pretty” way. For example “2008-01-28T20:24:17Z” becomes “2 hours ago”. Here’s some more examples: prettyDate("2008-01-28T20:24:17Z") // => "2 hours ago"prettyDate("2008-01-27T22:24:17Z") // => "Yesterday"prettyDate("2008-01-26T22:24:17Z") // => "2 days ago"prettyDate("2008-01-14T22:24:17Z") // => "2 weeks ago"prettyDate("2007-12-15T22:24:17Z") // => undefined Note that I only care about dates in the past (by far the most common use case) and only dates within the past month (anything beyond a month becomes fuzzy and impractical). JavaScript Pretty Date pretty.js (Also include a .prettyDate() jQuery plugin, for convenience.)Demo (Some examples of date conversion using basic DOM manipulation.) Example Usage In the following examples I make all the anchors on the site, that have a title with a date in it, have a pretty date as their inner text.

With plain DOM: With jQuery: About. Sweet page (pagination) Beautiful Background Image Navigation.