/    Sign up×
Community /Pin to ProfileBookmark

OnMouseOver: change background of another td

Copy linkTweet thisAlerts:
Oct 29.2006

When the users mouse scrolls over a <td>, I want to change the background of that <td> but also of another <td>.

At the moment I use CSS to change the background of the <td> the users is scrolling over, but with css I can’t change the background of another <td>, so I thought I needed JS, but I always forget when I need the objects id or the name =/

How can I change a background with JS?

Thanks in advance,

Daevius

to post a comment
JavaScript

3 Comments(s) ↴

Copy linkTweet thisAlerts:
@CrazyMerlinOct 29.2006 — if the background of both will be the same, use CSS and use a class.

if not assign an id attribute to the td you want.

example:
<i>
</i>&lt;td onMouseOver="javascript: document.getElementById('other_td').style.background = '[image or css]';"&gt;
.
.
.
&lt;td id="other_td"&gt;
.
.
.


you should really use a function, but if it is simply one td just use the javascript pseudo-protocol as shown.
Copy linkTweet thisAlerts:
@DaeviusauthorOct 29.2006 — Thank you,

What do you mean with CSS in the JS event? Can I work with CSS in JS?

Daevius
Copy linkTweet thisAlerts:
@CrazyMerlinOct 29.2006 — sure, you can set CSS style of an object in JS.

simple example:
<i>
</i>&lt;script type='text/javascript'&gt;
function changeBG(is_image, image, color, obj)
{
if(is_image == true)
{
obj.style.backgroundImage = image;
}
else
{
obj.style.backgroundColor = color;
}
}
&lt;/script&gt;


so to use that you could call:
<i>
</i>&lt;input type="button" onclick="changeBG(false, '', '#ff0000', this);" value="turn me red!"&gt;


//erlin!
×

Success!

Help @Daevius spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.20,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...