Forum Moderators: open
Specific Goal: Change display: block; to display: none;
Why?: Safari does not support changing classes via JavaScript but does support changing values of propertys.
Below I have a full file working example of the CLASS changer. The JavaScript looks for the element with the ID, and then changes it's class (when the anchor is clicked in this example).
Create a file, paste the code in, check it out, and then continue below please...
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>CSS and JavaScript Property Changer</title><script type="text/javascript">
//<![CDATA[function change(id, newClass)
{
identity=document.getElementById(id);
identity.className=newClass;
}////]]></script>
<style type="text/css">
div.testhide {
display: none;
}
div.testshow {
background: #000;
border: #000 solid 2px;
color: #fff;
}
</style>
</head><body>
<a href="#" onclick="change('testid', 'testhide');">Hide</a>
<a href="#" onclick="change('testid', 'testshow');">Show</a><div class="testhide" id="testid"><span>Test Div</span></div>
</body>
</html>
I am assumming we need to find the ID of the element, then select it's property (display), and then change it's value (preferably to none).
I've got some ideas how to do this but nothing is working yet. Any suggestions would be helpful! :)
- John
Perhaps some other change can get your current script working in those versions and you won't have to recode otherwise good code.
