jQuery plugin dev - Adding aditional functionaity to jQuery funcs

[Omirion]

Hello there,

So my story is this.

 

I want to add functionality to the CSS function.

 

Example:

Lets say we have some div with defined height and width (The values are irrelevant) and an id="foo"

So we have

$("#foo").css("height").myFunc();

 

I want myFunc to receive the value from css("height") and do something with it.

 

I tried the examples given at jQuery site, but the created methods only tap into the main object, that is to say

$("#foo").myFunc()

 

 

So , any idea how a can hook custom function further down the jQuery line?

[nogray]

Just use a standard function syntax, after all, this is just JavaScript.

 

myFunc( $("#foo").css("height") );

 

If you want to go with chaining style, you would need to extend the prototype of String and Number (since that's the return of the jquery css function)

e.g.

String.prototype.myFunc = function(){// this will be the value...};
Number.prototype.myFunc = function(){// this will be the value...};

[Omirion]

Just use a standard function syntax, after all, this is just JavaScript.

myFunc( $("#foo").css("height") );

My current setup is this. But it's just really bothersome and breaks my flow.

Also , makes the code ugly as hell.

 

AH! Thank you man!!!

I will try it and come back with details.

 

Jesus so simple... why didn't i think of it...

[Omirion]

Doesn't seem to work...

 

It works on newly created objects like so:

var foo = new String();

 

But not on values returned by Css.

Which is weird because the typeOf off the returned value is indeed - string.

 

Any ideas?

I'm currently looking into the jQuery source to see if i can hook it in there somehow... but the code is a mess...

Just to large and unorganized. Or i have just gotten too used to the  Java OOP style of programing...

 

Blah anyway sidetracked...

If you  have any other idea let me know mate.

[Omirion]

Working method:

 

Turns out you just need to prototype the Object object.

I remembered that since everything is basically it's extension of Object it should work.

 

A little caveman approach but for now it will have to do.

Here is the solution.

 

Object.prototype.a = function () { //do things with this};

[Omirion]

Oops...

 

Turns out prototyping the Object object breaks jQuery.... great...

 

Idea deposit still open i guess.

[trq]

Have you looked at any tutorials on extending jQuery?

[Omirion]

I can't seem to find any... weird i know.

Every tutorial i find is about developing plugins or doesn't work ;/

 

Any good links?

Or e-books maybe?

[trq]

Actually, looking at the way your doing things, you would be better going with:

 

$("#foo").myFunc()

 

Then having your function find the 'width' itself internally.

[nogray]

Not sure why the prototype didn't work for you, I just did this example and it worked

<div style="height:15px;" id="my_div"></div>
<script type="text/javascript">
String.prototype.my_func = function(){
	alert(this);	
}

$('#my_div').css('height').my_func();
</script>

[Omirion]

@thorpe

That will work. Thanks.

 

@nogray

Strange... Might be a browser issue i'm on the beta channel with firefox. Maybe that's the problem, will give it a run on other browsers.

Thanks for the heads up.