Define a UI element like the ones in jQuery UI

Question

In jQuery UI, widgets are created like this:

$("#selector").accordion({ //options });

How would I go about creating my own widget that would be created like this? Mainly, I need to know how to define a function that can be called on a DOM element (I'm a javascript newbie and the jQuery UI code isn't so readable).

Sinetheta · Accepted Answer · 2012-03-05 06:59:17Z

2

worlds smallest jQuery plugin! jsfiddle

$.fn.myFunc = function(){
    alert($(this).length)
};
$('div').myFunc();

answered Mar 5, 2012 at 6:59

Sinetheta

9,4495 gold badges33 silver badges52 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Tx3 Over a year ago

+1 for compactness. It's still good to point out that this is not considered as a best practice. Namespacing, defaults etc. should also be handled correctly. docs.jquery.com/Plugins/Authoring

anthonyvd Over a year ago

Very straight to the point. It really gave me a feel of how things are declared.

Lucius · Accepted Answer · 2012-03-05 06:51:52Z

1

Learn how to create a jQuery plug-in. It's pretty great for organizing your code and makes it easier to reuse functionality.

answered Mar 5, 2012 at 6:51

Lucius

3,7452 gold badges24 silver badges44 bronze badges

1 Comment

anthonyvd Over a year ago

This is exactly the kind of documentation I was looking for. Thanks a lot!

Collectives™ on Stack Overflow

Define a UI element like the ones in jQuery UI

2 Answers 2

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related