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!

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

Calling a function with span IDs

Status
Not open for further replies.

mpalmer12345

Programmer
Joined
Feb 16, 2004
Messages
59
Location
US
I am a beginner at this, so bear with me!

I want to set up a function that can be called more than once and operate on each distinct span ID. Something like this, but not just for T0001 but for T0002, T0003, etc.


<html>
<head>
<script type=&quot;text/javascript&quot;>
<!--
function Test(colorValue)
{
var colorValueHex = '#' + 200 + 200 + 200;
document.getElementById('t0001').style.color = colorValueHex;
}

//-->
</script>
</head>
<body>
<div class=&quot;text&quot;>
x<span id=&quot;t0001&quot; style=&quot;color:white;&quot; onMouseDown=&quot;Test(255, t0001);&quot;>REMEMBER</span>x
</div>

<div class=&quot;text&quot;>
x<span id=&quot;t0002&quot; style=&quot;color:white;&quot; onMouseDown=&quot;Test(255, t0002);&quot;>RECOVER</span>x
</div>

</body>
</html>
 
Firstly, you might need to write your own Decimal to Hexadecimal conversion function, such as:
Code:
function decToHex(num) {
	var hex=new Array(&quot;0&quot;, &quot;1&quot;, &quot;2&quot;, &quot;3&quot;, &quot;4&quot;, &quot;5&quot;, &quot;6&quot;, &quot;7&quot;, &quot;8&quot;, &quot;9&quot;, &quot;A&quot;, &quot;B&quot;, &quot;C&quot;, &quot;D&quot;, &quot;E&quot;, &quot;F&quot;);
	var p1 = Math.floor(num/16);
	var p2 = num%16;
	return hex[p1]+hex[p2];	
}

Then, you could either use:
Code:
function Test(colorValue, objId) {
	var theHex = decToHex(colorValue);
	var colorValueHex = '#' + theHex + theHex + theHex;
	document.getElementById(objId).style.color = colorValueHex;
}

OR (by passing the hexadecimal value and the current object (&quot;this&quot;), you could use:

Code:
function TestHex(colorHex, obj) {
	obj.style.color = colorHex;
}

And call them using, respectively:
Code:
<div class=&quot;text&quot;>
x<span id=&quot;t0001&quot; style=&quot;color:white;&quot; onMouseDown=&quot;Test(255, 't0001');&quot;>REMEMBER - 1st METHOD</span>x
</div>

<div class=&quot;text&quot;>
x<span id=&quot;t0002&quot; style=&quot;color:white;&quot; onMouseDown=&quot;TestHex('#00ff00', this);&quot;>REMEMBER - 2nd METHOD</span>x
</div>

Hope this helps.

Pete.


Web Developer &amp; Aptrix / Lotus Workplace Web Content Management (LWWCM) Specialist
w: e: Pete.Raleigh(at)lclimited.co.uk
 

The decToHex function can be easily simplified using the Javascript method toString:

Code:
function decToHex(num) {
    var hexStr = num.toString(16);
    if (hexStr.length == 1) hexStr = '0' + hexStr;
    return(hexStr);
}

Hope this helps,

Dan
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top