Trigger hover pseudo class using javascript?
in [JavaScript]
|
From: Ry Nohryb on 30 Apr 2010 10:19 On Apr 30, 3:33 pm, Scott Sauyet <scott.sau...(a)gmail.com> wrote: > Thomas 'PointedEars' Lahn wrote: > > Scott Sauyet wrote: > >> I'm curious as to this. The original question was > > >> | Is it possible to trigger the hover state of an element using > >> | javascript? > >> [ ... ] > >> Are you suggesting that there are circumstances where this can > >> be done? If so, could you elaborate? > > > In W3C DOM Level 2+ Events-compliant implementations you can create and > > dispatch events programmatically. If you create a `mouseover' event and > > dispatch it to an element object, it should trigger whatever "hover state" > > is supposed to mean of the corresponding element. > > > Cf. <https://developer.mozilla.org/en/DOM/document.createEvent> > > Thank you. I had never really looked at that before. It's a shame > that this is not implemented universally. I think it's been implemented in most browsers for a few years now. But there's something very important to watch out with events emitted in this way: they are handled *synchronously*, they are not queued as events usually are, they are instead handled from within the call to dispatchEvent(): (function () { var evt = document.createEvent("MouseEvents"); evt.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null); var ctr= 0; document.body.onclick= function () { ctr++; }; document.body.dispatchEvent(evt); console.log(ctr); setTimeout(function(){ console.log(ctr); }); })(); --> 1, 1 -- Jorge.
From: Ciaran on 3 May 2010 22:01 On 30 Apr, 15:19, Ry Nohryb <jo...(a)jorgechamorro.com> wrote: > On Apr 30, 3:33 pm, Scott Sauyet <scott.sau...(a)gmail.com> wrote: > > > > > > > Thomas 'PointedEars' Lahn wrote: > > > Scott Sauyet wrote: > > >> I'm curious as to this. The original question was > > > >> | Is it possible to trigger the hover state of an element using > > >> | javascript? > > >> [ ... ] > > >> Are you suggesting that there are circumstances where this can > > >> be done? If so, could you elaborate? > > > > In W3C DOM Level 2+ Events-compliant implementations you can create and > > > dispatch events programmatically. If you create a `mouseover' event and > > > dispatch it to an element object, it should trigger whatever "hover state" > > > is supposed to mean of the corresponding element. > > > > Cf. <https://developer.mozilla.org/en/DOM/document.createEvent> > > > Thank you. I had never really looked at that before. It's a shame > > that this is not implemented universally. > > I think it's been implemented in most browsers for a few years now. > But there's something very important to watch out with events emitted > in this way: they are handled *synchronously*, they are not queued as > events usually are, they are instead handled from within the call to > dispatchEvent(): > > (function () { > var evt = document.createEvent("MouseEvents"); > evt.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, > false, false, false, false, 0, null); > var ctr= 0; > document.body.onclick= function () { ctr++; }; > document.body.dispatchEvent(evt); > console.log(ctr); > setTimeout(function(){ console.log(ctr); }); > > })(); > > --> 1, 1 > -- > Jorge. Thanks Jorge. I can't understand why 'PointedEars' did not mention any of this interesting detail in his initial reply on this thread, or in even afterwards when I probed further ...But my question has at last been answered! Cheers, Ciaran (OP)
From: Ry Nohryb on 4 May 2010 12:32
On May 4, 4:01 am, Ciaran <cronok...(a)hotmail.com> wrote: > On 30 Apr, 15:19, Ry Nohryb <jo...(a)jorgechamorro.com> wrote: > (...) > > I think it's been implemented in most browsers for a few years now. > > But there's something very important to watch out with events emitted > > in this way: they are handled *synchronously*, they are not queued as > > events usually are, they are instead handled from within the call to > > dispatchEvent(): > > > (function () { > > var evt = document.createEvent("MouseEvents"); > > evt.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, > > false, false, false, false, 0, null); > > var ctr= 0; > > document.body.onclick= function () { ctr++; }; > > document.body.dispatchEvent(evt); > > console.log(ctr); > > setTimeout(function(){ console.log(ctr); }); > > > })(); > > > --> 1, 1 > > Thanks Jorge. I can't understand why 'PointedEars' did not mention any > of this interesting detail in his initial reply on this thread, or in > even afterwards when I probed further ...But my question has at last > been answered! > Cheers, > Ciaran (OP) You're welcome. -- Jorge. |