Thomas’ Developer Blog

October 16, 2008

Combining/Imposing Event Code in JavaScript

Filed under: javascript — Tags: , , , , , — sanzon @ 7:35 am

In JavaScript there may be times you want to combine code onto an existing window event. In this case we will use window.onscroll.

In this example we already have assigned window.onscroll as the following:

window.onscroll = function() {  
     setTimeout("document.getElementById('myDiv').style.color='red';",200);
     setTimeout("document.getElementById('myDiv').style.color='green';",400);  
};

This causes the text color to blink within our div as we scroll. Of course this is only for example and serves no practical use… normally at least. Anyway, now we want to combine this with some other code.

So we now want to impose the new onscroll code:

function() { moveDiv() }

moveDiv in this case moves the div so it is always on screen while you move. (fyi, this is how I personally get around IE5’s lack of support for position:fixed)

So how do we impose our old code onto the new code? Well it’s kind of strange, but we have to be a bit sneaky about it and take advantage of JavaScript’s JSON logic. To do this, we simply add the old code within the declaration of the new code, such as:

var ScrollCode = eval(window.onscroll);
window.onscroll = function() { moveDiv(ScrollCode()) };

Yes I am using eval, and yes most people hate using eval, but if used correct it is actually very useful! So there is no harm in this case since the eval code does not involve any sort of user input.

So what happens in this code is simple. We call the new function moveDiv which references the variable ScrollCode which calls the function for the current onscroll code. As a result both codes are ran at the same time. This makes adding new code easy, and you can continue to add code in this same manor. It just continues to impose the code onto each other.

Anyway hope this helps, and please let me know if you have any issues with it. Good luck.

PS: Note that this method is meant to be used with window events. click events do not always require function usage. (i.e. window.onscroll = function() {};) Most window events do require this on modern browsers.

Advertisements

19 Comments »

  1. I really like reading through an article that can make men and women think.
    Also, thank you for allowing me to comment!

    Comment by how to configure best comcast dsl cable modem for xbox — August 12, 2014 @ 11:17 pm

  2. Hello there! Do you use Twitter? I’d like to follow you if that would be ok.
    I’m undoubtedly enjoying your blog and look forward to new posts.

    Comment by how to configure best arris tg862g \/ct arris tg862 wireless — August 13, 2014 @ 5:21 am

  3. Have you ever considered about adding a little bit more than just your articles?
    I mean, what you say is valuable and all. Nevertheless think about if you added
    some great images or video clips to give your posts
    more, “pop”! Your content is excellent but with images and clips,
    this site could certainly be one of the very best in its field.
    Fantastic blog!

    Comment by how to configure best best docsis 3 buy cable modem for comcast — August 23, 2014 @ 3:37 pm

  4. Hi there colleagues, its great post about tutoringand completely defined, keep it up
    all the time.

    Comment by how to configure best best cable best comcast modem for — September 9, 2014 @ 7:37 am

  5. Hello to all, how is everything, I think every one is getting
    more from this website, and your views are good in favor
    of new viewers.

    Comment by how to configure best best wireless wireless cable modem for — September 19, 2014 @ 5:53 pm

  6. Hmm is anyone else experiencing problems with the images on this blog loading?
    I’m trying to find out if its a problem on my end or if
    it’s the blog. Any feed-back would be greatly appreciated.

    Comment by how to configure best best comcast best comcast modem for — September 20, 2014 @ 1:09 am

  7. Hello to every one, it’s in fact a fastidious for me
    to pay a visit this web page, it consists of useful Information.

    Comment by how to configure best best best modem for xbox live — September 20, 2014 @ 2:59 am

  8. Wonderful, what a weblog it is! This blog gives helpful
    facts to us, keep it up.

    Comment by dgn2200v4 custom firmware — September 20, 2014 @ 7:30 am

  9. whoah this weblog is excellent i really like studying your posts.

    Stay up the great work! You realize, a lot of people are
    looking round for this info, you could aid
    them greatly.

    Comment by how to configure best comcast best cable modem for gaming — September 20, 2014 @ 7:57 am

  10. Aw, this was a really nice post. Taking a few minutes and actual effort to produce a great
    article… but what can I say… I put things off a lot and don’t manage to get anything done.

    Comment by how to configure best cable dsl best modem for xbox live — September 23, 2014 @ 4:53 am

  11. Heya i’m for the first time here. I found this board and
    I find It really useful & it helped me out much. I hope to give something back and aid others like
    you helped me.

    Comment by how to configure best comcast best comcast modem for triple — September 23, 2014 @ 10:59 pm

  12. Hi! Do you know if they make any plugins to protect
    against hackers? I’m kinda paranoid about losing everything I’ve worked hard on. Any suggestions?

    Comment by worst date stories girlfriend — September 25, 2014 @ 5:12 am

  13. I enjoy looking through an article that will make people think.
    Also, many thanks for allowing me to comment!

    Comment by how to configure best cable dsl modem for xbox live — September 25, 2014 @ 9:59 am

  14. It’s actually very difficult in this busy life to listen news on TV, so I only use web for
    that purpose, and obtain the newest news.

    Comment by how how how to configure modem db102 — September 30, 2014 @ 5:03 pm

  15. Asking questions are genuinely good thing if you are not understanding anything fully,
    however this piece of writing provides nice understanding even.

    Comment by how to configure bsnl wireless adsl modem — September 30, 2014 @ 9:41 pm

  16. I know this web page gives quality based articles
    and additional material, is there any other web page which
    presents these kinds of information in quality?

    Comment by how to configure best comcast how to configure modem h5001 — September 30, 2014 @ 9:49 pm

  17. Hello there! I know this is kinda off topic however I’d figured I’d ask.
    Would you be interested in exchanging links or maybe guest authoring a blog article or vice-versa?
    My website covers a lot of the same topics as yours
    and I feel we could greatly benefit from each other.
    If you are interested feel free to shoot me
    an e-mail. I look forward to hearing from you! Wonderful
    blog by the way!

    Comment by Il mondo dell’archeologia — October 3, 2014 @ 2:07 am

  18. Thanks for any other magnificent article. Where else may just anyone get that kind of information in such an ideal approach of writing?
    I’ve a presentation next week, and I am at the look for such information.

    Comment by Il mondo dell’archeologia — October 3, 2014 @ 9:02 pm

  19. Pantalla de Inicio/Bloqueo. http://www.4shared.com/office/U3R0cRX2ba/Jurado_Regional_De_Valoracione.html

    Comment by Darci — February 4, 2017 @ 6:12 pm


RSS feed for comments on this post. TrackBack URI

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

Create a free website or blog at WordPress.com.

%d bloggers like this: