PDA

View Full Version : my onclick function only works on second click

nicolanicola
07-12-2009, 01:34 PM
I have a function that displays text when the text "more" is clicked. Except, the text is only displayed initially after clicking twice.

How can I make it respond immediately?

The item is in a table, here is a section from the table:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<link href="stylesheet.css" rel="stylesheet" type="text/css"/>
<title>Absolute Websites | Prices</title>
<script type= "text/javascript" src="script.js">
</script>
</head>

<body>
....
.....
<tr>
<td>Design & single page website
<span class="plusArrow" onclick ="moreInfo('onePage')"/>more...</span>
<span id="onePage">hshshshshshs</span>
</td>
<td>&pound;80</td>
</tr>

My javascript:

function moreInfo(id)
{
var elementId = document.getElementById(id);
if(elementId.style.display=="none")
{
elementId.style.display="block"
}else{
elementId.style.display="none"
}
}

My css is just display:none.

Anyone know why it's doing this and how to fix it?

Thank you in advance.
¥åßßå
07-12-2009, 01:39 PM
js doesn't "see" your css display:none, just reverse your logic "if( element.style.display == 'block' )........."

¥
nicolanicola
07-12-2009, 01:41 PM
js doesn't "see" your css display:none, just reverse your logic "if( element.style.display == 'block' )........."

¥

Thank you very much, that has done the trick!
¥åßßå
07-12-2009, 01:45 PM
no worries ;)

¥
nicolanicola
07-12-2009, 02:55 PM
Do you know for what reason my whole page would move a few pixels along when clicking the first more icon to show the rest of the text? I have set my table widths and everything, I thought maybe that was causing it but it hasn't made any difference.