[jQuery] Adding CSS-property & therefore traveling the DOM - Problem.
Hi!
To get this right, I'll post the html-part first:
<div class="memberarea">
<div class="memberpic">
<a href="#">
<img src="the_image.jpg" alt="Mr. X" title="Mr. X" />
</a>
</div>
<div class="memberinfo">
<h4>Mister X</h4>
Info 1
Info 2
Info 3
<a href="##" class="email">Mister.X@campusrelations.de</a>
</div>
</div>
Now, I'd like to add a css property (or even better: a:hover-state) to
the link in the "memberpic"-div everytime the link with the class
"email" is hovered. The image-link changes from b/w to color when it's
hovered (more info at: http://www.bertdesign.de/designen/css-tutorial-i-hover-effect-on-linked-images).
Because both links will include the same "mailto:" address, I want the
image-shifting to occur on the "normal" link, too.
I tried to do this with the following code:
$(document).ready(function(){
$("a.email").hover(
function () {
$(this).prev("a").css({"margin-left":"-210px"});
},
function () {
$(this).prev("a").css({"margin-left":"-210px"}).remove();
}
);
});
That's what I expected to get done: When hovering an "a.email"-link,
the previous link should get the "margin-left: -210px;"-property and
should loose it again when the mouse is out of the link-area.
Since I'm totally new to jQuery, I tried to copy/paste the code from
the documentation and fit it to my needs. This didn't work out & I
have no idea how to achieve the desired effect.
Any help is appreciated. Sorry for this stupid question (and the maybe
bad english ;) ).
Thanks!
Greetings,
Jayzon