...

View Full Version : Multiple Onmouseclick events



JoshTrav
12-17-2007, 10:29 PM
Can I string along multiple getelementbyid statements after a Onmouseclick event.

Something like:


<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

kosstr12
12-17-2007, 10:34 PM
I believe if you put them all inside the same function in the javascript at the top of your page, you can do it.

JoshTrav
12-17-2007, 10:39 PM
Not to good with javascript, can you give me an example?

Majoracle
12-17-2007, 10:45 PM
<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.

JoshTrav
12-17-2007, 11:10 PM
<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

Apostropartheid
12-17-2007, 11:57 PM
It should do, it did for me. Here's the code I used:
<!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>

Majoracle
12-18-2007, 12:16 AM
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;"

JoshTrav
12-18-2007, 12:24 AM
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

Apostropartheid
12-18-2007, 02:41 PM
You don't necessarily have to include a href, but the a won't respond to the :visited pseudoclass.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum