Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Chris Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Font-Weight? 1

Status
Not open for further replies.
iaresean

iaresean

Programmer
Mar 24, 2003
570
ZA
Hey there all, just a quickie:

I am trying the following:

document.getElementById('font2').setAttribute('color', 'red');
document.getElementById('font2').setAttribute('font-weight', 'bold');

This is supposed to make the following font tag red and bold:

<FONT id=&quot;font2&quot; color=&quot;black&quot;>Reports</FONT>

But it is only making it red and not bold. Is 'font-weight' an actual attribute that I can change, or am I doing something wrong?

Any and all help is greatly appreciated.

Sean. :)
 
Sort by date Sort by votes
Try using a style sheet instead:

Code: 
theObject.style.color = &quot;#FF0000&quot;;
theObject.style.fontWeight = &quot;bold&quot;;

And for Netscape 4.x use:
theObject.color = &quot;#FF0000&quot;;
theObject.fontWeight = &quot;bold&quot;;

Alternatively you could define a class called &quot;redbold&quot; and assign a new classname to it:
Code: 
theObject.style.className = &quot;redbold&quot;;

Pete.


Web Developer / Aptrix CMS (LWWCM) Specialist
w: e: Pete.Raleigh(at)lclimited.co.uk
 
Upvote 0 Downvote
Sorry... slight mistake about the &quot;className&quot; code... here's a working example:

Code: 
<html>
<head>
	<title>Dynamic Styles...</title>
<script language=&quot;JavaScript&quot;>
<!--
function ChangeClassStyle (obj) {
	if(document.all) {
		obj.style.color = &quot;#ff0000&quot;;
		obj.style.fontWeight = &quot;bold&quot;;
	} else {
		obj.color = &quot;#ff0000&quot;;
		obj.fontWeight = &quot;bold&quot;;
	}
}
function ChangeClassName (obj) {
	obj.className = &quot;redbold&quot;;
}
</script>
<style type=&quot;text/css&quot;>
a {
	font-weight: normal;
	font-color: #0000ff;
}
.redbold {
	font-weight: bold;
	color: #ff0000;
}
</style>
</head>
<body>

<a href=&quot;#&quot; onclick=&quot;ChangeClassStyle(this);&quot;>Dynamic: Turn me red / bold</a>
<br><a href=&quot;#&quot; onclick=&quot;ChangeClassName(this);&quot;>Change ClassName: Turn me red / bold</a>

</body>
</html>

Pete.


Web Developer / Aptrix CMS (LWWCM) Specialist
w: e: Pete.Raleigh(at)lclimited.co.uk
 
Upvote 0 Downvote
It *is* odd that setting the font-weight doesn't work though. I too would have opted for the CSS method that Pete is touting... but I'm curious to know why the original method isn't making the contents bold.

Anyone?

Jeff
 
Upvote 0 Downvote

As mentioned, font-weight isn't a property. If you really don't want to use style sheets (for whatever reason), something like this might work:

Code: 
document.getElementById('font2').innerHTML = '<b>' + document.getElementById('font2').innerHTML + '</b>';

Hope this helps!

Dan
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

decomplexity
  • Locked
  • Question
CSS font-size not being carried thru to JScript code
Replies
2
Views
84
decomplexity
decomplexity
thisanthrope
  • Locked
  • Question
changing font size of numbers not letters
Replies
3
Views
61
gfbj
gfbj
abkdefz
  • Locked
  • Question
Link font and color problem
Replies
2
Views
39
abkdefz
abkdefz
f1girl2
  • Locked
  • Question
defining weight?
Replies
6
Views
32
Lowet
Lowet
jslmvl
  • Locked
  • Question
How to recover the font size
Replies
6
Views
58
jslmvl
jslmvl

Part and Inventory Search

Sponsor

Back
Top