Expanding information window

Information and discussion on Javascript.

Moderators: rcrisler1, saltybeagle

Expanding information window

Postby dsockrider » Fri Dec 16, 2005 12:25 pm

Check out this expanding information/submenu info using CSS and Javascript.

http://www.sockrider.com/javascriptEXPANDO/

Would it be alright to use something similar in my pages? I'm just assuming a couple styles would need to be added to the master .CSS sheet.
dsockrider
 
Posts: 189
Joined: Fri Dec 16, 2005 10:37 am
Location: Engineering

Postby saltybeagle » Fri Dec 16, 2005 1:17 pm

Would it be alright to use something similar in my pages?


No problem. I think the css styles would be better suited inline, as the css isn't anything more complex than style="display:none" and a selector for that in the stylsheet seems a little useless.

I would change the javascript to just take in the ID of the element, which would make it a little more flexible.
Peoplefinder uses a similar technique... which could be simplified to use the ternary conditional like your javascript.
Brett Bieber
Image
saltybeagle
 
Posts: 376
Joined: Fri Jan 16, 2004 3:10 pm
Location: 321 Admin

Code changes

Postby dsockrider » Fri Dec 16, 2005 1:38 pm

What would the code look like? Not sure how to simplify it like you're referring.
dsockrider
 
Posts: 189
Joined: Fri Dec 16, 2005 10:37 am
Location: Engineering

Postby saltybeagle » Fri Dec 16, 2005 3:19 pm

I was just suggesting to change it to take in any element ID instead of hard-coding the 'expand' prefix for the elements.
It could work something like this...
Code: Select all
<script type="text/javascript">
function showHide(e)
{
   document.getElementById(e).style.display=(document.getElementById(e).style.display=="block")?"none":"block";
   return false;
}
</script>


Callable by:
Code: Select all
<a href="#" onclick="return showHide('details');" onkeypress="return showHide('details');">Show/Hide</a>
<div id="details" style="display:none;">Yadayada</div>


I wasn't suggesting anything more complicated than that. But that's a useful technique David, thanks.
Brett Bieber
Image
saltybeagle
 
Posts: 376
Joined: Fri Jan 16, 2004 3:10 pm
Location: 321 Admin


Return to Javascript

Who is online

Users browsing this forum: No registered users and 0 guests