JavaScript - Change two classes with one click
Posted: Sun Jul 23, 2006 5:09 pm
Weirdan | Please use
So if you have a link and two divs (and just did something really simple like their associated classes would just change their border or background color) and you clicked the link both divs would change color.
Weirdan | Please use[/syntax]
Code: Select all
,Code: Select all
and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read: [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]
With the below code I can change the class of one element.
However I need to change two classes with a single click using JavaScript.
[syntax="html"]<?xml version="1.0" encoding="iso-8859-1"?>
<!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">
<head>
<title>example</title>
<style type="text/css">
.hideme {
display: none;
}
div.example {
border: #f0f solid 1px;
}
</style>
<script type="text/javascript">
//<![CDATA[
function change(id, newClass)
{
identity=document.getElementById(id);
identity.className=newClass;
}
//]]>
</script>
</head>
<body>
<div><a href="#" onmouseout="change('example', 'example');">mouseover to bring div back</a></div>
<div class="example" id="example" onmouseover="change('example', 'hideme');">
<span>example</span>
</div>
</body>
</html>So if you have a link and two divs (and just did something really simple like their associated classes would just change their border or background color) and you clicked the link both divs would change color.
Weirdan | Please use[/syntax]
Code: Select all
,Code: Select all
and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read: [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]