470,631 Members | 1,782 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 470,631 developers. It's quick & easy.

Java script help

. .

Hi

I need some help with java script . I have four link button on my ASPX
page . Each button gives user specific message when they click on it
.The first button is is the default button and the button text is
already bold and rest of them is dim . When user click the second button
that button text will be bold rest of them will be dim and so on . So in
a zest the button user will click be bold and rest three will be dim .
How do I do that . Currently only the default button text is bold . All
the buttons are working just not changing the text .Please help

Thanks

*** Sent via Developersdex http://www.developersdex.com ***
Sep 7 '05 #1
2 1374
.. . wrote:
Hi

I need some help with java script . I have four link button on my ASPX
page . Each button gives user specific message when they click on it
The first button is is the default button and the button text is
already bold and rest of them is dim . When user click the second button
that button text will be bold rest of them will be dim and so on . So in
a zest the button user will click be bold and rest three will be dim .
How do I do that . Currently only the default button text is bold . All
the buttons are working just not changing the text .Please help


Below shows a general way to achieve what you are after. You can put
the onclick on a button if you like and reference the text some other
way. If you want to put multiple classes on the divs, you'll need to do
things a little differently.

The advantage of adding the onclick dynamically is that you don't have
to manually code an onclick on every div element and if the user doesn't
have JavaScript enabled, they wont see a bunch of non-functioning buttons.

<head><title>Div play</title>

<style type="text/css">
.normalText { font-weight: normal;}
.boldText { font-weight: bold;}
</style>

<script type="text/javascript">
var currentEl;
function toggleClass(el, a, b)
{
currentEl.className = a;
currentEl = el;
currentEl.className = b;
}

function initClick( id )
{
if ( !document.getElementById || !document.getElementsByTagName ) {
return;
}
var d = document.getElementById( id );
var divs = d.getElementsByTagName('div');
var i, j = divs.length;
for ( i=0; i<j; i++ ){
divs[i].onclick = function() {
toggleClass(this, 'normalText','boldText');
};
divs[i].className = 'normalText';
}
currentEl = divs[0];
currentEl.className = 'boldText';
}

window.onload = function() {
initClick('someDivs');
};
</script>
</head>
<body>
<div id="someDivs">
<div>Here is some text</div>
<div>Here is some text</div>
<div>Here is some text</div>
<div>Here is some text</div>
<div>Here is some text</div>
</div>
</body>
--
Rob
Sep 8 '05 #2
. .


Thank you so much for your help. I will try the code and let you know
how it worked .

*** Sent via Developersdex http://www.developersdex.com ***
Sep 8 '05 #3

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

reply views Thread by James Hong | last post: by
4 posts views Thread by Don Grover | last post: by
33 posts views Thread by patrick_woflian | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.