Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9
  1. #1
    New Coder
    Join Date
    Dec 2007
    Posts
    51
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Multiple Onmouseclick events

    Can I string along multiple getelementbyid statements after a Onmouseclick event.

    Something like:

    Code:
    <div id="gungame_link" onmouseclick="document.getElementById('gungame_status').style.visibility = 'visible'; document.getElementById('reverse_gungame_status').style.visibility = 'hidden';document.getElementById('scrim_status').style.visibility = 'hidden';document.getElementById('cal_status').style.visibility = 'hidden'"><a href="#" >Gungame</a></div>
    Thanks in advance,

    Josh

  • #2
    Regular Coder kosstr12's Avatar
    Join Date
    Apr 2007
    Location
    Woodstock, Georgia
    Posts
    428
    Thanks
    7
    Thanked 5 Times in 5 Posts
    I believe if you put them all inside the same function in the javascript at the top of your page, you can do it.

  • #3
    New Coder
    Join Date
    Dec 2007
    Posts
    51
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Not to good with javascript, can you give me an example?

  • #4
    Regular Coder
    Join Date
    Nov 2006
    Posts
    246
    Thanks
    13
    Thanked 26 Times in 24 Posts
    Code:
    <script type="text/javascript">
    function myFunction() {
         document.getElementById('gungame_status').style.visibility = 'visible';
         document.getElementById('reverse_gungame_status').style.visibility = 'hidden';
         document.getElementById('scrim_status').style.visibility = 'hidden';
         document.getElementById('cal_status').style.visibility = 'hidden';
         return false;
    }
    </script>
    
    <div id="gungame_link" onmouseclick="return myFunction();"><a href="#">Gungame</a></div>
    Javascript isn't my strong point, but that should work.

  • #5
    New Coder
    Join Date
    Dec 2007
    Posts
    51
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Majoracle View Post
    Code:
    <script type="text/javascript">
    function myFunction() {
         document.getElementById('gungame_status').style.visibility = 'visible';
         document.getElementById('reverse_gungame_status').style.visibility = 'hidden';
         document.getElementById('scrim_status').style.visibility = 'hidden';
         document.getElementById('cal_status').style.visibility = 'hidden';
         return false;
    }
    </script>
    
    <div id="gungame_link" onmouseclick="return myFunction();"><a href="#">Gungame</a></div>
    Javascript isn't my strong point, but that should work.
    Tried this out. Doesn't seem to be working. Here is the example.

    http://www.pure-team.org

    The bottom div is the one I want to display each server status with the onclick functions.

    Also, on a side note, if i set the news_content div to height:auto it doesn't resize to fill the include statement. Any ideas here?

    Thanks again,
    Josh

  • #6
    The Apostate Apostropartheid's Avatar
    Join Date
    Oct 2007
    Posts
    3,215
    Thanks
    16
    Thanked 265 Times in 263 Posts
    It should do, it did for me. Here's the code I used:
    Code:
    <!DOCTYPE html>
    <html>
    <head>
    <title>onClicks</title>
    <style type="text/css">
    div, p { display: none; }
    span { display: block; }
    * { font: 100&#37;/1.8 Georgia, serif; margin: 0; padding: 0; }
    body { margin: 2em; }
    code { font-family: Consolas, "Courier New", monospace; color: #39f; }
    </style>
    <script type="text/javascript">
    function myFunction(){
    document.getElementById("myDiv").style.display = "block";
    document.getElementById("myPara").style.display = "block";
    document.getElementById("mySpan").style.display = "none";
    }
    </script>
    </head>
    <body>
    <a href="#" onclick="myFunction();">Click me to swap around!</a>
    <span id="mySpan">This should be displaying when you haven&rsquo;t clicked. (<code>span</code>.)</span>
    <div id="myDiv">This should be displaying when you have clicked. (<code>div</code>.)</div>
    <p id="myPara">This should be displaying when you have clicked. (<code>p</code>.)</p>
    </body>
    </html>

  • #7
    Regular Coder
    Join Date
    Nov 2006
    Posts
    246
    Thanks
    13
    Thanked 26 Times in 24 Posts
    Yeah, I don't think the return parts are needed. Seemed right, but guess not. I was trying to get it so the page wouldn't jump to the top when they click the link. It might be: onclick="myFunction(); return false;"

  • #8
    New Coder
    Join Date
    Dec 2007
    Posts
    51
    Thanks
    0
    Thanked 0 Times in 0 Posts
    It works now.

    The problem was declaring the div ids and the onclick command within the div.

    Instead using just the standard <a href onclick > command works just fine.

    However, I wonder if there is a way to make it so that the div that the php includes statement is in will scale its height. Currently it won't auto height and I have to declare a variable.

    example at http://www.pure-team.org

    Currently I have a fixed height set to solve the problem, but looks odd.

    Thanks,
    Josh

  • #9
    The Apostate Apostropartheid's Avatar
    Join Date
    Oct 2007
    Posts
    3,215
    Thanks
    16
    Thanked 265 Times in 263 Posts
    You don't necessarily have to include a href, but the a won't respond to the :visited pseudoclass.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •