JavaScript + CSS Help

[rzzi]

Well, I'm trying to make a navbar that when you click on the "button" it moves down one pixel. However, this doesn't seem to work. Thanks.

<style type="text/css">
li{border:1px solid #4c4c4c;display:inline;
height:32px;
padding:7.5px;
width:79px;
margin:0 0 0 5px;cursor:pointer;
font-family:Arial;font-size:12px;}
</style>

<script type="text/javascript">
function down(id)
{
document.getElementById(id).style.margin='1px 0 0 5px';
}
function up(id)
{
document.getElementById(id).style.margin='0 0 0 5px';
}
</script>

<li id="h" onmousedown="down('h')" onmouseup="up('h')">Home</li>

[:awesome:]

You don't need javascript for mouseovers.

[css]
ul#nav li{border:1px solid #4c4c4c;display:inline;height:32px;padding:7.5px;width:79px;margin:0 0 0 5px;font-family:Arial;font-size:12px;}
ul#nav li:active{margin-top:1px;}
[/css]

[html]
<ul id="nav">
<li><a href="#">Home</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
</ul>
[/html]

[rzzi]

[QUOTE=:awesome:;25647862]You don't need javascript for mouseovers.

[css]
ul#nav li{border:1px solid #4c4c4c;display:inline;height:32px;padding:7.5px;width:79px;margin:0 0 0 5px;font-family:Arial;font-size:12px;}
ul#nav li:hover{margin-top:1px;}
[/css]

[html]
<ul id="nav">
<li><a href="#">Home</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
</ul>
[/html][/QUOTE]

Sorry if I wasn't clear, but I wanted it to go down 1 pixel when it's clicked and go back up when it's unclicked/off mouse down.

[:awesome:]

[QUOTE=R1Z3;25647911]Sorry if I wasn't clear, but I wanted it to go down 1 pixel when it's clicked and go back up when it's unclicked/off mouse down.[/QUOTE]

That's what it does?

[Siemens]

[QUOTE=R1Z3;25647911]Sorry if I wasn't clear, but I wanted it to go down 1 pixel when it's clicked and go back up when it's unclicked/off mouse down.[/QUOTE]

You don't need JS for that:

a:active {
    position:relative;
    top:1px;
}

[editline]26th October 2010[/editline]

[QUOTE=:awesome:;25647949]That's what it does?[/QUOTE]

No, yours works on mouseover

[:awesome:]

[QUOTE=Siemens;25651618]
No, yours works on mouseover[/QUOTE]

Ah, fixed.