kurt.santo Posted April 15, 2008 Share Posted April 15, 2008 Is it possible to have a link, which when clicked upon opens a div with relevant content, which did not show before (and also did not use any space on page)? Found examples (and got great help) to hide/show the same element as such, but struggle how to associate a link placed elsewhere with div, which has a unique ID. Is this easily done?Kurt Link to comment Share on other sites More sharing options...
Ingolme Posted April 15, 2008 Share Posted April 15, 2008 <a href="java script: void(0);" onclick="B =document.getElementById('obj'); (B.style.display == "none")?B.style.display="block":B.style.display="none"; ">Click here</a><div id="obj">Some text</div> And some CSS for when the page loads: #obj {display: none;} Link to comment Share on other sites More sharing options...
kurt.santo Posted April 16, 2008 Author Share Posted April 16, 2008 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Test</title><style type="text/css">#obj {display: none;}</style></head><body><a href="java script: void(0);" onclick="B =document.getElementById('obj'); (B.style.display == "none")?B.style.display="block":B.style.display="none"; ">Click here</a><div id="obj">Some text</div></body></html> But seems it tried to load another page that it cannot find when clicked upon (IE7). In FF it just does not do anything. Did that work for you? Also, is there an option to show it as default and hide it if Javascript is enabled (obviously with option to bring it up)? Guess this way around would be better for people without javascript...Kurt Link to comment Share on other sites More sharing options...
Ingolme Posted April 16, 2008 Share Posted April 16, 2008 Some syntax errors from my part. I put double quotes within double quotes.And also, don't forget to remove the space between "java" and "script"I'll fix the code and add a feature to let it be visible when javascript is deactivated.This goes in the <head> <style type="text/javascript">function init() {document.getElementById('obj').style.display = "none";}function toggle() {B =document.getElementById('obj');(B.style.display == "none")?B.style.display="block":B.style.display="none"; }window.onload = init;</script> This goes in the body: <a href="javascript: void(0);" onclick="toggle()">Click here</a><div id="obj">Soem text</div> Link to comment Share on other sites More sharing options...
kurt.santo Posted April 16, 2008 Author Share Posted April 16, 2008 Ingolme,That would be great! Cheers, mate!Kurt Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.