Using OOP structure with JQuery

Hi guys,

Apologies if this question is a bit vague but I have an application which has lots of (mainly event driven JQuery javascript). I have finished all of the code from a procedural point of view but now I want a more object oriented structure because I need to learn to do it.

I have things like video players, (YouTube and Flowplayer) which have their own OO APIs so in a way I already have some object based code but it is the remaining event driven code that I want to square away neat and tidy. For example, I have lLOTS of JQuery event handlers as below because I have built my own player chrome.


         $("#fullscreen_effect, #YouTube_fullscreen_effect").hover(
		 function(e)
		 {
		 $("#fullscreen_hover").animate({width:"24",height:"18"}, "5000");
		     e.stopPropagation();
		 },
		 function(e)
		 {
		 $("#fullscreen_hover").animate({width:"15",height:"11"}, "10000");
		     e.stopPropagation();
		 }
		);
		
		$("#vol_btn, #YouTube_volume, #flowplayer_volume").hover(
		 function()
		 {
	    $("#YouTube_volume, #flowplayer_volume").stop().show().animate({"opacity": "1"}, "slow");
		 },
		 function()
		 {
		$("#YouTube_volume, #flowplayer_volume").stop().animate({"opacity": "0"}, 1900);
		 }
		);


Anyway, I am aware that when using JQuery mouse event handlers, the object created is $(this) so is it enough to just put the above code into functions like fullscreen() and volume() and to just pass them the $(this) object from the handler OR
is there some deeper OO structure that I can perform with them?

thanks

Silversurfer