Javascript Rollup
Hi,
I cannot seem to find anything about what I believe are called Javascript Rollup's, meaning a mechanism that usually is initiated with at + or - and opens part of a screen (web page) and/or closes it. Normally used as a mechanism to allow the page user to organise the content on the screen better such that they only see the parts they need.
So for instance I may have a web page divided into say 5 distinct parts and want to allow the user to open and or close each of those five parts individually, similar to how a folder view in explorer would work on a desktop file system.
I cannot seem to find anything about what I believe are called Javascript Rollup's, meaning a mechanism that usually is initiated with at + or - and opens part of a screen (web page) and/or closes it. Normally used as a mechanism to allow the page user to organise the content on the screen better such that they only see the parts they need.
So for instance I may have a web page divided into say 5 distinct parts and want to allow the user to open and or close each of those five parts individually, similar to how a folder view in explorer would work on a desktop file system.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Very Nice, I've implemented this and I'm having an issue, implemented here:
http://support.faulknertechnologies.com/rollups
when you click on the open and close you get the content and then the screen refreshes to the root of the portal, how do you stop this. I was not sure if I need to do something with the # specification in the href
Thanks for your help!
http://support.faulknertechnologies.com/rollups
when you click on the open and close you get the content and then the screen refreshes to the root of the portal, how do you stop this. I was not sure if I need to do something with the # specification in the href
Thanks for your help!
ASKER
Secondary question:
Could the <a href ....... > be replaced with some kind of input instead, like a button ?
That would be handy as well
Could the <a href ....... > be replaced with some kind of input instead, like a button ?
That would be handy as well
OK. It's cousing problems :);
To avoid executing links, change the href value from "#" to "javascript:void(0);". This thingy only executes event listeners such as onClick, etc.
Ofcourse you can make this action with almost any html objects like images, buttons, inputs, divs,...
Just include onClick="posk('b1_cont');"
And remeber, if this object is form element such as input or button, remember to add RETURN FALSE to prevent form from submiting:
<button onClick="posk('b1_cont'); return false;">HIDE / CLOSE</button>
Nice page you have there :)
To avoid executing links, change the href value from "#" to "javascript:void(0);". This thingy only executes event listeners such as onClick, etc.
Ofcourse you can make this action with almost any html objects like images, buttons, inputs, divs,...
Just include onClick="posk('b1_cont');"
And remeber, if this object is form element such as input or button, remember to add RETURN FALSE to prevent form from submiting:
<button onClick="posk('b1_cont'); return false;">HIDE / CLOSE</button>
Nice page you have there :)
ASKER
Schweet! Excellento!
Thanks for the quick turnaround!
Thanks for the quick turnaround!
function posk(el_id) {
elem = (ducument.all) ? document.all[el_id] : document.getElementById(el
elem.style.display = (elem.style.display=="none
}
</script>
<div id="b1">
<a href="#" onClick="posk("b1_cont");"
<div id="b1_cont" style="display: none;">stuff displayed</div>
</div>