views:

878

answers:

4

Such as the <div class="grippie" style="margin-right: 59px;"/>
on stackoverflow when you post a question or answer. I get a nice css curser which lets me know of the moveable edge but how is the Java script which resizes the field finding out I clicked on the 'Grippie'?

Thank you.

Edit: Thank you for the answers which lead to Jquery and describe the handler. Could I please have a simple use of the handler that determines when the element is clicked. IE:
addListener('myElement',performFunction();).onclick;
or however this may work?

Thank you.

A: 

The JavaScript in use on the site listens to click events and looks for the ID of the element being interacted with. The script will then either ignore the event or do something if the element ID is one of the expected objects that requires action.

invenetix
+3  A: 

If you look at the generated source with Firefox Web Developer plugin you'll see that it adds a DIV of class "grippie", using the TextAreaResizer mentioned by @grepsedawk. This DIV has the resize sprite for a background and has a click handler attached to it that performs the resize.

tvanfosson
A: 

I have researched a few methods which I will outline. Further comments as to which is best would be appreciated. The goal is to hide the "onClick" listener from the generated source.

document.getElementById('ID').addEventListener('click',function();,false);  
//Problems: Has to be terminated and false/true is something tricky I don't understand yet (please see link I post)

document.getElementById('ID').onclick = function();
//Problems: Cannot be terminated directly and heirachy issue where function including 'this' keyword applies to the child divs or something (please again see link I post)

//an iterartion of setInterval(checkFunction,interval);
//Problems: Very very slow and in most cases requires an onClick to check for a change anyway!

So at the end of my research, this website came out on top for explaining very well how eventListeners in Java can be hooked effectively: http://www.howtocreate.co.uk/tutorials/javascript/domevents

Supernovah