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 Shaun E on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Passing ".style.backgroundColor" from one element to another

Status
Not open for further replies.
budapestnori

budapestnori

Technical User
Jan 15, 2004
33
HU
Hi Guys, I have a link in my page, which happens to have a class assigned to it. The class has a background and color specified. When clicked, I want to call a function called changecolor2 which will require one parameter. The parameter passed will be - this. I then want to take that link's class' background color, and assign it to another element, thus changing that classes background-color dynamically. Here is my code, but it does not seem to do anything.



My Function:

function changeColor2(xyz) {
var x;
x = document.getElementById(xyz).style.backgroundColor;
alert(x);
return;
}

My call to the function:

<a href=&quot;#&quot; class=&quot;one&quot; onClick=&quot;changeColor2(this);&quot;><img src=&quot;images/bg_blank_button.gif&quot;></a>

Thanks guys,

Budapest Nori
 
Sort by date Sort by votes
I have to pass all the credit to theboyhope for this answer since he gave it to me a while back.

Code: 
function changeColor2(xyz) {
var x;
//by the way, when calling this function passing the &quot;this&quot;
//reference, it gives you a direct reference to the object
//so you don't have to use getElementById
//x = document.getElementById(xyz).style.backgroundColor;
x = xyz.currentStyle[ &quot;backgroundColor&quot; ];
alert(x);
return;
}

When I asked a similar question like this I was wanting to swap the foreground and background colors of a button when hovering the mouse. Here's an example of the solution. (thanks again to theboyhope)

Code: 
<html>
<head>
<script language=JavaScript>
function invertColors( obj ) {
   color_value = obj.currentStyle[ &quot;color&quot; ];
   bg_value = obj.currentStyle[ &quot;backgroundColor&quot; ];
   obj.style.color = bg_value;
   obj.style.backgroundColor = color_value;
}

</script>
</head>
<body>
<form name=blahForm>
<input type=button value='Click Me' onmouseover='invertColors(this)' onmouseout='invertColors(this)'>
</form>
</body>
</html>

-kaht

banghead.gif
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

lexer
  • Locked
  • Question
Passing fields from (html-JavaScript) table to JavaScript Function
Replies
0
Views
864
lexer
lexer
TheLazyPig
  • Locked
  • Question
Buttons not aligned after another button is clicked
Replies
2
Views
475
gmmastros
gmmastros
AbidingDude
  • Locked
  • Question
Where Does The &quot;name&quot; Attribute Stand?
Replies
1
Views
418
gmmastros
gmmastros
Kennelbloke
  • Locked
  • Question
Can't Get Markers to show on Map
Replies
0
Views
1K
Kennelbloke
Kennelbloke
berkshirea
  • Locked
  • Question
Radio Button Clicked, Another Radio Becomes Mandatory 1
Replies
2
Views
763
berkshirea
berkshirea

Part and Inventory Search

Sponsor

Back
Top