Use onmouseleave. Or, in jQuery, use mouseleave() It is the exact thing you are looking for. Example: <div class=”outer” onmouseleave=”yourFunction()”> <div class=”inner”> </div> </div> or, in jQuery: $(“.outer”).mouseleave(function(){ //your code here }); an example is here.
Actually, there is a “search” event that is fired whenever the user searches, or when the user clicks the “x”. This is especially useful because it understands the “incremental” attribute. Now, having said that, I’m not sure if you can tell the difference between clicking the “x” and searching, unless you use an “onclick” hack. … Read more
EDIT: As of 2019, e.metaKey is supported on all major browsers as per the MDN. Note that on Windows, although the ⊞ Windows key is considered to be the “meta” key, it is not going to be captured by browsers as such. This is only for the command key on MacOS/keyboards. Unlike Shift/Alt/Ctrl, the Cmd … Read more
Here is the simplest way: <select name=”ab” onchange=”if (this.selectedIndex) doSomething();”> <option value=”-1″>–</option> <option value=”1″>option 1</option> <option value=”2″>option 2</option> <option value=”3″>option 3</option> </select> Works both with mouse selection and keyboard Up/Down keys whes select is focused.
DOM event delegation is a mechanism of responding to ui-events via a single common parent rather than each child, through the magic of event “bubbling” (aka event propagation). When an event is triggered on an element, the following occurs: The event is dispatched to its target EventTarget and any event listeners found there are triggered. … Read more
I think that the fastest way to do this is to just clone the node, which will remove all event listeners: var old_element = document.getElementById(“btn”); var new_element = old_element.cloneNode(true); old_element.parentNode.replaceChild(new_element, old_element); Just be careful, as this will also clear event listeners on all child elements of the node in question, so if you want to … Read more
Performing a single click on an HTML element: Simply do element.click(). Most major browsers support this. To repeat the click more than once: Add an ID to the element to uniquely select it: <a href=”#” target=”_blank” id=”my-link” onclick=”javascript:Test(‘Test’);”>Google Chrome</a> and call the .click() method in your JavaScript code via a for loop: var link = … Read more
You can use element.scrollTop and element.scrollLeft to get the vertical and horizontal offset, respectively, that has been scrolled. element can be document.body if you care about the whole page. You can compare it to element.offsetHeight and element.offsetWidth (again, element may be the body) if you need percentages.
Use the oncontextmenu event. Here’s an example: <div oncontextmenu=”javascript:alert(‘success!’);return false;”> Lorem Ipsum </div> And using event listeners (credit to rampion from a comment in 2011): el.addEventListener(‘contextmenu’, function(ev) { ev.preventDefault(); alert(‘success!’); return false; }, false); Don’t forget to return false, otherwise the standard context menu will still pop up. If you are going to use a … Read more
Passive event listeners are an emerging web standard, new feature shipped in Chrome 51 that provide a major potential boost to scroll performance. Chrome Release Notes. It enables developers to opt-in to better scroll performance by eliminating the need for scrolling to block on touch and wheel event listeners. Problem: All modern browsers have a … Read more