1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

How to add window mouseup event to this javascript toggle

Discussion in 'JavaScript' started by ketting00, Apr 12, 2016.

0
  1. #1
    Hi guys,

    I've tried pure CSS show/hide event, but it isn't cool and isn't lived up to modern web trend.
    So I get back to JavaScript and I've got struck on how to mix these two events together.

    Here's the code I've tried so far:
    
<!DOCTYPE html>
<html>
    <head>
        <style>
            #showme { display: none; }
        </style>
    </head>
    <body>
        <div id=button>Button</div>
        <div id=showme>
            I'm revealed!
        </div>
        <script>
            var d = document, w = window
             , b = d.getElementById('button')
             , a = d.getElementById('showme')
             ;

            b.addEventListener('click', function() {
                if (a.style.display !== 'block')
                    a.style.display = 'block';
                else
                    a.style.display = 'none';
            });
            w.addEventListener('mouseup', function(e) {
                a.style.display = 'none';
            });
        </script>
    </body>
</html>
    Code (markup):
    Any suggestion is appreciated.
    Thank you,
     
    ketting00, Apr 12, 2016 IP
  2. ketting00

    ketting00 Well-Known Member

    Messages:
    772
    Likes Received:
    27
    Best Answers:
    3
    Trophy Points:
    128
    #2
    It turns out I used the wrong method. It's window onload event, not element clicking event.
     
    ketting00, Apr 12, 2016 IP