make a custom event for addEventListener in Javascript

Question

What I would like to do is register a custom event in Javascript (I'm working with Html + Css + Javascript + jQuery)

But this "custom event" is not a predefined event. What I'm looking for is something like this:

document.addEventListener($(#div1).css("width") == "35px" (OR, another example condition:) $(#div1).css("left") == "20px" (OR, another example condition:) $(#div1).css("color") == "#FF0000", function(););

Is this possible?. How is the correct syntax?, inside and if? I mean: document.addEventListener(if ($(#div1).css("width") == "35px"), function(););

I have no idea of how get this "customized daemon" working!.

developer.mozilla.org/en-US/docs/Web/API/CustomEvent

Mike 'Pomax' Kamermans
– Mike 'Pomax' Kamermans

2014-02-18 00:25:15 +00:00
Commented Feb 18, 2014 at 0:25 — Mike 'Pomax' Kamermans
– Mike 'Pomax' Kamermans, Commented Feb 18, 2014 at 0:25

jfriend00 · Accepted Answer · 2014-02-18 00:24:55Z

1

The browser does not have an event that will trigger when a particular div reaches a width of exactly 35px or a specific color so the type of code you are trying to write is not directly possible.

There are events for some of the other types of things that might cause that div to change it's width such as the window being resized. If you can tell us what operations are causing the div to change its width, then we might be able to offer other ideas for how to capture the situation you are trying to capture.

What you will likely have to do is to either register event handlers for other events (such as window resize) and then check to see if any of your conditions have been met or call your code that checks if any of these conditions have been met after your code has made other DOM modifications that might change one of these properties or using a polling timer to check if any of these conditions have been met (not recommended as it is inefficient).

answered Feb 18, 2014 at 0:24

jfriend00

711k104 gold badges1.1k silver badges1k bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

Reaversword Over a year ago

Hmmm, I see your point jfriend00, thanks, still doesn't fits, but gets closer. The fact is when user clicks a button, a div's width starts to growing over a second and then, something happens. If user clicks the button again, the div's width starts to shrinking, and after a second, something happens. But, -here is the problem-, if the user clicks while this second has not finished, I need cancel last action gonna happen (this is solved), but I need to "fire" the "other" last action being able to compensate the time. So if user clicks at 3/4 of seconds, action should fire at 3/4 of second.

jfriend00 Over a year ago

Well, unless you're going to disclose more info about the problem you're actually trying to solve, this is as much of an answer as can be provided.

Reaversword Over a year ago

(Sorry, I was editing) I can measure the time, of course, but I was thinking about get rid myself of timers and only use an EventListener with the width of the div.

jfriend00 Over a year ago

@Reaversword - such an event listener does not exist.

Reaversword Over a year ago

Yep. Bad luck. But thanks for your time anyway!. Time to lateral thinking!.

|

Collectives™ on Stack Overflow

make a custom event for addEventListener in Javascript

1 Answer 1

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related