Plugins:
Absolutize
Last changed: 35 weeks 5 days ago
An absolutizer for block level DOM elements.
It don't modify the DOM document
Require dimensions.
| Version | Date | Links |
|---|---|---|
| 0.0.1-rc-1 | 2007-Sep-06 |
Accessible
Last changed: 19 weeks 5 days ago
What is this ?
- This plugin aims to be a collection of snippets that improve accessibility for websites.
- It also includes a set of "recommendations" coded as tests to improve accessibilty (even beyond javascript).
- These recommendations can be tested against a page, and get a summary of the results.
How to use it ?
- First add a call to jquery.js (duh!).
- Add jquery.accessible.js. This contains the engine for rules/fixes and a set of predefined ones.
- Right after this, you are ready to run the fixes by calling jQuery.accessible(). You can pass in a hash to specify, with the id and true or false, which ones to run.
IMPORTANT: don't call this function inside document.ready, call it right away instead.
If you want to run the tests in your page:
- Add jquery.accessible.validator.js after jquery.accessible.js.
| Version | Date | Links |
|---|---|---|
| 0.1.0-dev | 2007-Dec-27 |
appendDom
Last changed: 39 weeks 5 days ago
This plugin allows for easier and more intuitive creation of dom elements.
| Version | Date | Links |
|---|---|---|
| 1.0.0 | 2007-Aug-09 |
appendText
Last changed: 46 weeks 1 day ago
Description
This (very) small plugins is the incestuous child of "append" and "text": it appends a new Text Node.
This is especially important when you want to append user-supplied input, because a Text Node is never interpreted as HTML.
Example
var $myLabel = $("<label/>")
.append("<input type='checkbox'/>")
.appendText("use HTML <a href=''>");Will add to the DOM the equivalent of the following HTML:
<label><input type='checkbox'/>use HTML <a href=''></label>| Version | Date | Links |
|---|---|---|
| 1.0.0 | 2007-Jun-25 |
Bubble
Last changed: 33 weeks 1 day ago
This plugin adds bubbling functionality to jQuery. The code is similar to jQuery.fn.trigger's because it's meant to extend it. It also generates it's own event object, that will remain untouched through the bubbling, meaning it's safe to attach attributes to it and grab them with the ancestors while the event bubbles up.
I tried to use jQuery's core functions as much as possible, but most functions I needed were not compatible, and would destroy the custom event object, still the code remains short.
NOTES:
- jQuery.Bubble 1.0 was tested with jQuery 1.3.1 and it's compatible with it's event system.
- jQuery.Bubble 1.2 and further versions will stick to the new system(1.2 's).
| Version | Date | Links |
|---|---|---|
| 1.0 | 2007-Aug-25 | |
| 1.2 | 2007-Sep-25 |
Chili
Last changed: 32 weeks 5 days ago
Chili is the jQuery code highlighter
Latest version: 1.9 (2007-09-24)
Chili directly supports highlighting of JavaScript, jQuery, PHP, XHTML, MySQL, Java, C++, C#, CSS, Delphi, and LotusScript. Additionally, it's fairly easy to add a new recipe for any other language by means of regular expressions.
- very fast coloring (3000 lines in less than 1 second)
- trivial setup
- fully customizable
- thoroughly documented
- MIT licensed
See also: Hot Chili
| Version | Date | Links |
|---|---|---|
| 1.9 | 2007-Sep-28 |
Copy Events
Last changed: 20 weeks 5 days ago
Provides method for copying events from one element to another. It also provides a cloneWithEvents method that will clone the element along with the events.
| Version | Date | Links |
|---|---|---|
| 1.0.1 | 2007-May-15 | |
| 1.1.0 | 2007-Dec-21 |
Countdown
Last changed: 17 weeks 3 days ago
A simple yet usefull plugin
It'll countdown time in seconds, untill zero. Then may reload the page.
example:
wait
It will show progressively:
50 secs = 00:50
3600 secs = 01:00:00
86400 secs = 1d 00:00:00
etc.
| Version | Date | Links |
|---|---|---|
| 1.0-beta | 2008-Jan-12 |
DOM Elements Creator
Last changed: 4 weeks 5 days ago
What is it?
DOM Elements Creator is a simple plugin for creating DOM elements on-a-fly which can be used as part of jQuery statements.
When you want to create new DOM element in pure jQuery you must use document.createElement() method and then new element must be wrapped in $() before it can be used in jQuery context. You can also use HTML code as a selector to create a new object but this way requires writing HTML, which is rarely comfortable. And you must also remember to espace any quotes.
This plugin provides more elegant way to achieve the same effect and requires writting less code.
| Version | Date | Links |
|---|---|---|
| 0.3.1 | 2008-Apr-11 | |
| 0.3.1-min | 2008-Apr-11 |
Expander
Last changed: 14 weeks 2 days ago
The Expander Plugin is a simple little jQuery plugin to hide/collapse a portion of an element's text and add a "read more" link so that the text can be viewed by the user if he or she wishes. By default, the expanded text is followed by a "re-collapse" link. Expanded text can also be re-collapsed at a specified time.
| Version | Date | Links |
|---|---|---|
| 0.1 | 2008-Feb-03 |
fastID
Last changed: 45 weeks 2 days ago
Note: this plugin has become redundant with jQuery 1.1.4, as the fix has been included!
This plugin speeds up use of $('#id'). Use of $('#id') may be anywhere
between 10 and 40 times slower than using $(document.getElementById('id')), depending
on the browser used. I don't know about you, but I personally use $('#id') a lot and
really need the speed up. With this plugin, $('#id') is typically only up to 10%
slower than $(document.getElementById('id')), and often not even measurable (110%
vs 4000%, not bad I would say!).
Note #1: Thanks to rformato for the improved RegEx.
Note #2: Though 1.1.3 speeds this up a little bit compared to 1.1.2, it's still very slow.
| Version | Date | Links |
|---|---|---|
| 1.0.0 | 2007-Jul-01 |
FastTrigger
Last changed: 5 weeks 3 days ago
What is it
This small plugin includes a clean and simplified version of jQuery.trigger, that will perform better and will specially scale better.
How is this achieved
Many useless steps are skipped when programatically triggering an event, this step that jQuery does no matter what, are not really necessary for triggered events, and some of them hit on perfomance badly. Most of them are not optimized for speed and scalability, but for reusability and code size.
Differences with trigger
This method supports array of data (can include an event object), namespaced events and exclusive triggering. The only known difference with jQuery.trigger is that this method doesn't trigger native handlers, so it's actually comparable to .triggerHandler().
Perfomance
This is method is at least 4 times faster than the regular trigger, and will scale much better as you call it on more elements at once.
Global triggering
| Version | Date | Links |
|---|---|---|
| 1.0.0 | 2008-Apr-05 |
FlyDOM: Create DOM on the Fly
Last changed: 41 weeks 2 days ago
Create DOM elements on the fly and automatically append or prepend them to another DOM object. There are also template functions (tplAppend and tplPrepend) that can take a simple HTML structure and apply a JSON object to it to make creating layouts MUCH easier. This plugin was inspired by "Oslow" [1], and since I could not get his code to work, I decided I write my own plugin. My hope is that this version will be easier to understand and maintain with future versions of jQuery. Update (July 13, 2007): Upgraded FlyDOM to 3.0; visit the FlyDOM homepage for more details.
| Version | Date | Links |
|---|---|---|
| 3.0.6 | 2007-Jul-17 | |
| 3.0.8 | 2007-Jul-29 |
HeatColor
Last changed: 23 weeks 5 days ago
HeatColor is a plugin that allows you to assign colors to elements, based on a value derived from that element. The derived value is compared to a range of values, either determined automatically or passed in, and the element is assigned a "heat" color based on its derived value's position within the range.
You bind a collection of elements such as table rows, divs or list members to heatcolor and let it do the work.
It can find the min and max values of the desired elements, or you can pass them in manually.
| Version | Date | Links |
|---|---|---|
| 0.0.1 | 2007-Nov-30 |
Intercept
Last changed: 9 weeks 1 day ago
This plugin simplifies the use of Event Delegation with multiple different descendants.
This concept is very useful for pages with dynamic content (f.e: AHAH) where DOM elements are created and removed constantly, requiring re-binding.
This method also saves a lot of resources, as it uses less event handlers to achieve the same objective.
It can be used in 2 ways:(I will exemplify with a table)
$('table')
.intercept('click', 'tr', function(e){...})
.intercept('click', 'td.happy', function(e){...})
.intercept('click', '#something', function(e){...});or
$('table').intercept('click', {
tr: function(e){...},
'td.happy': function(e){...},
'#something': function(e){...}
});By calling intercept on the same element/event, the new handler/s are appended to the old list.
| Version | Date | Links |
|---|---|---|
| 1.0.1 | 2007-Aug-24 | |
| 1.0.2 | 2007-Sep-11 | |
| 1.1.2 | 2008-Mar-10 |
jScrollHorizontalPane
Last changed: 4 weeks 14 hours ago
jScrollHorizontalPane is a plugin based off of Kevin Luck’s jScrollPane which override’s the browsers default horizontal on any block level element with an overflow:auto style. It’s built on top of the jQuery library and uses both the dimensions plugin and the mouse wheel plugin. Provided with the download of the plugin there is a default jScrollHorizontalPane.css which can be used as a basis to edit the stylings on the scroll bar.
This plugin is completely cross browser, and also provides the ability to resize gracefully when the reset option is set to true. Additionally, intervals can be set by adding a class of “scroll-interval” which automatically adds dash’s to the track and provides automatic snap-to on the elements.
Just include the following files in the head of your page:
* jQuery
* the dimensions plugin
* the mouse wheel plugin
* jScrollHorizontalPane.js (or the compressed)
* jScrollHorizontalPane.css
| Version | Date | Links |
|---|---|---|
| 1.0.0 | 2008-Apr-15 |
jTemplates
Last changed: 18 weeks 2 days ago
jTemplates is a template engine 100% in JavaScript.
Example of template:
<table>
{#foreach $T.table as row}
<tr>
<td>{$T.row.name.bold()}</td>
<td>{$T.row.mail}</td>
</tr>
{#/for}
</table>Download, demos, changelog, documentation are available on project homepage:
http://jtemplates.tpython.com
| Version | Date | Links |
|---|---|---|
| 0.5.1-2 | 2007-Dec-04 | |
| 0.4.3 | 2007-Aug-25 | |
| 0.6.6 | 2008-Jan-06 |
Listen
Last changed: 9 weeks 4 days ago
The release shown below is not the last. Please check 1.0.3 instead.
This plugin brings a clean, light solution, to websites with dynamic loaded content, or full of event bindings.
Intead of bound, handlers for events, are registered along with matching selectors.
And they'll still work for new added content.
This is achieved, using Event delegation, so the plugin will only work for events that bubble.
Update: jQuery.Listen can now handle both focus and blur events thanks to the focusin/focusout workaround.
Many thanks to Jörn Zaefferer for lending me the code!.
The plugin supports these kind of selectors:
- #id
- nodeName
| Version | Date | Links |
|---|---|---|
| 0.8.0-beta | 2007-Oct-13 | |
| 0.8.2-beta | 2007-Oct-19 |
Live Query
Last changed: 20 weeks 5 days ago
Live Query (formerly Behavior) utilizes the power of jQuery selectors by binding events or firing callbacks for matched elements auto-magically, even after the page has been loaded and the DOM updated.
| Version | Date | Links |
|---|---|---|
| 0.0.3 | 2007-May-14 | |
| 1.0.2 | 2007-Dec-20 |
LocalScroll
Last changed: 9 weeks 21 hours ago
This plugin will animate a regular anchor navigation [1] [2].
It will allow your visitors to navigate your site with a smooth scrolling effect.
Each time a link is clicked, the element you decide(can be the whole screen), will gradually scroll to the targeted element, instead of "jumping" as it'd normally do.
jQuery.ScrollTo is used for the animation.
- Check its Homepage, it includes extensive documentation.
| Version | Date | Links |
|---|---|---|
| 1.2.5 | 2008-Mar-11 |
Orange
Last changed: 9 weeks 19 hours ago
This plugin is a jQuery extension that is capable of inspecting javascript objects, and using Javascript objects to populate html templates. This allows easy composition and tweaking of html snippets, and keeps the data separate from display code until it actually needs to be rendered. Works in all IE and Firefox platforms.
Supports ajax loading of html templates, template naming, retrieval and setting of templates at any time. core utilities can be used either as jQuery methods or functions.
This extension is part of a larger web development toolkit called 'Orange Foundation' available on source forge.
| Version | Date | Links |
|---|---|---|
| 1.5.0 | 2008-Mar-11 |
Preload
Last changed: 8 weeks 6 days ago
Note: Patched a bug of Safari 2, and 2 other bugs of IE, please upgrade to 1.0.7.
This is an advanced multi-functional preloader, that has 4(actually 5) modes integrated.
Each mode suits a different, common situation.
The modes are:
- URL: Preload a JS array of static URLs.
- Rollover: Preload based on DOM images, slightly modifying their src.
Can be used for rollovers, or for image-thumb. - Placeholder : Take regular images and set a placeholder image while they load. Show each original image when fully loaded. Allows sequential loading with a threshold.
- Link: Preload the images that appear in the href of the given links.
The plugin also provides 3 callbacks to interact with the image URLs during the preloading process. All the callbacks get a hash of data, with details of the related image and global information.
| Version | Date | Links |
|---|---|---|
| 1.0.7 | 2008-Mar-13 |
pStack DOM element stack
Last changed: 2 weeks 8 hours ago
pStack plugin for jQuery.
Allows successive AJAX calls to replace contents of an element, whilst keeping previous contents in a stack.
Previous element contents can then be recalled by pop()ing them back off the stack.
Usage:
<script src="jquery.pagestack.js" type="text/javascript"></script>
<div id="myStack">
<p>this is the DOM chunk which dynamic things will happen to</p>
<p><a href="nextView.html" class="stackPush">Next ---</a></p>
</div>
<script type="text/javascript">
$('#myStack').pStack({
aPush: 'a.stackPush',
aPop: 'a.stackPop'
});
</script>nextView.html might look like this (ie, not a complete HTML document):
<p>This is my new DOM contents</p>
<p><a href="#" class="stackPop">--- Prev</a></p>| Version | Date | Links |
|---|---|---|
| 1.0.0 | 2008-Apr-30 |
Rule
Last changed: 10 weeks 5 days ago
Important:The release listed below is not the last. Please download 1.0.1 from here.
This plugin allows quick creation/manipulation of CSS Rules, in a "jQuery-way".
It includes features like chaining, iteration using each, selectors with context.
Many functions are available, like slice, pushStack, not, add, remove, append, css, and some more.
A full API is available. It contains the methods of jQuery.Rule, and the extensions to jQuery.
As far as it has been tested, the plugin should perform well in most browsers, some specials methods still need some more testing. Feedback is much appreciated.
| Version | Date | Links |
|---|---|---|
| 0.9.2 | 2007-Nov-23 |
ScrollShow
Last changed: 28 weeks 22 hours ago
I've made a new plugin, that is meant to supercede jQuery.ScrollShow. The latter has been in beta stage for too long.
Please check Query.SerialScroll
http://flesler.blogspot.com/2008/02/jqueryserialscroll.html
It's very small and it offers high customizability.
It can be used for slideshows, section navigation, news tickers, etc. (These 3 exemplified in the demo).ScrollShow is a very customizable slideshow, that relies on jQuery.ScrollTo, to slide(scroll) the items.
Documentation is included in the source file.
The plugin is still in beta stage, but will be soon (hopefully) stable.
Feedback and bug reports are very welcome.
| Version | Date | Links |
|---|---|---|
| 0.7-beta | 2007-Oct-30 |
ScrollTo
Last changed: 12 weeks 2 hours ago
With this plugin, you will easily scroll overflowed elements, and the screen itself.
It gives you access to many different options to customize and various ways to specify where to scroll.
- Check its Homepage to read a detailed documentation on its use.
- You can then visit its Demo to see all the possibilities in action.
- Finally, you can read about its 2 sons:
- jQuery.LocalScroll: Will add a scroll effect, to any anchor navigation. Ideal for slides, table of contents, etc. It's small, and incredibly easy to implement.
| Version | Date | Links |
|---|---|---|
| 1.3.3 | 2008-Feb-20 |
SerialScroll
Last changed: 7 weeks 4 days ago
This plugin allows you to easily animate any series of elements, by sequentially scrolling them.
It uses jQuery.ScrollTo to achieve the scrolling animation.
jQuery.SerialScroll doesn't have one definite purpose. It's generic and adaptable.
You can certainly use it as a section slider. That is, to sequentially navigate a group of screens.
This plugin can also animate a text scroller in no time.
It can definitely handle slideshows, the high customizability of the scrolling effect lets you easily create beautiful animations.
With no extra code, you can even build a news ticker!
Three of these uses are exemplified in the demo.
Remember, it's not restricted to these situations. It will take care of any collection of html elements that you want to scroll consecutively.
| Version | Date | Links |
|---|---|---|
| 1.1.2 | 2008-Mar-09 | |
| 1.2.1 | 2008-Mar-21 |
SuperFlyDOM
Last changed: 37 weeks 1 day ago
Create DOM elements on the fly and automatically append or prepend them to another DOM object.
Also included are template functions (tplAppend and tplPrepend) that can take a JSON-formatted HTML structure, apply a dataset, and create complex DOM nodes! New template system is much more forgiving and flexible than previous DOM element creation plugins.
Features
- Add any element with or without all types of properties or children in any order
- Chainable! Returns last appended/prepended element in jQuery object - but also works on plain DOM elements!
- Accepts inline HTML as string, innerHTML style
- Fixes IE special-cases, like input element creation and children of tables
- Lightweight yet fast! Uses internal jQuery functions for portability while creating DOM nodes and accessing appendChild directly for speed
- AJAX-friendly - SuperFlyDOM takes real JSON objects, perfect for lightweight AJAX (or jQuery's .getJSON) retrieval
| Version | Date | Links |
|---|---|---|
| 0.9.0-g | 2007-Aug-27 |
Survey
Last changed: 5 weeks 4 days ago
A plugin to quickly generate surveys with javascript. Based on JSON, XML, or anything.
This plugin is not fully functional to be used in production.
| Version | Date | Links |
|---|---|---|
| 1.0.0 | 2008-Apr-04 |
switchClass
This VERY simple plugin provides functionality similar to jQuery's built in toggleClass() function, but instead of adding/removing a single class from an element, switchClass toggles between TWO classes ensuring that one and only one of the two classes is assigned to an element (or elements) at one time. It leaves all other element classes untouched and only affects the two classes specified.
In practical terms, one example usage would be for toggling a table row's class from "odd" to "even" classes after a row has been deleted.
| Version | Date | Links |
|---|---|---|
| 1.0.0 | 2008-Apr-20 |
xml
Last changed: 1 year 1 week ago
Methods to generate XML/HTML tags programmatically. By default, they output XHTML compliant tags.
| Version | Date | Links |
|---|---|---|
| 1.0 | 2007-May-06 |
xmlObjectifier - Converts XML DOM to JSON
Last changed: 10 weeks 4 days ago
The end of DOM Tree walking is here!
This small and fast utility converts an XML file fetched through $.ajax to a JavaScript Object, completely eliminating a need to use DOM Tree walking to extract data. All attributes and values are accessible using dot (.) notation. Besides simplifying the way you access data you can also sort nodes prior further processing. This component can be easily used to write a SOAP or RSS client.
How JSON object is assembled? - this utility is a recursive walker that starts off at the root of your document and creates a new object for each node, and new field for each node attribute. Whenever a a tree walker encounters a text node or a CDATA within your node, it assigns it's value to a .Text field of that js object (object that represents a node). Ex: <node1>Hello World</node1> would be stored at node1.Text
| Version | Date | Links |
|---|---|---|
| 1.0.3 | 2008-Feb-29 |
XSLT (based on Google's AJAXSLT)
Last changed: 41 weeks 5 days ago
This is a jQuery Plugin for Google's AJAXSLT. It gives you the ability to transform XML/XSL from JavaScript. AJAXSLT is a parser itself, the library does not depend on your browser being able to do XSL transforms. The plugin also provides functionality to load XML/XSL through $.ajax() calls and transform them.
| Version | Date | Links |
|---|---|---|
| 0.7.0 | 2007-Jul-27 |