jQuery for Absolute Beginners: Day 7

Mike says:

I noticed you are using the | character here.

Care to elaborate?

Dan says:

Like your pronunciation of hover.

huver? LOL.

indi says:

$(‘#rightNav img’).animate({“opacity”: 1 });

$(‘#home’).stop().hover(function() {
$(‘#abour img’).stop().css({“opacity”: .7 });
$(‘#Eng img’).stop().css({“opacity”: .7 });
}, function(){
$(‘#rightNav img’).stop().css({“opacity”: 1 });
});

$(‘#Eng’).stop().hover(function() {
$(‘#home img’).stop().css({“opacity”: .7 });
$(‘#abour img’).stop().css({“opacity”: .7 });
}, function(){
$(‘#rightNav img’).stop().css({“opacity”: 1 });
});

$(‘#abour’).stop().hover(function() {
$(‘#home img’).stop().css({“opacity”: .7 });
$(‘#Eng img’).stop().css({“opacity”: .7 });
}, function(){
$(‘#rightNav img’).stop().css({“opacity”: 1 });
});

this is what i did, and it is very redundant need help in cleaning that. sorry for double post.

charlie says:

Right ON!
This is totally awesome! Thank you for the lessons…

man says:

I love this site very much.

steve says:

Thank You, I love your tutorials, they helped me very much.

I have one problem, with .stop()… i am trying to make sliding popup, and everything is working ok, except that annoying behaviour with repeating animation, and if i use stop() to prevent that, and then move mouse over trigger link several times, it stops working, and hidden #div doesn’t appear at all, than i have to refresh the page to start working again. Any suggestion ?
here is my code:
html:
Click

css:
#box {
width: 120px;
height: 80px;
background-color: #C0BDFF;
display: none;
}

jquery:

$(document).ready(function(){
$(‘a’).hover(function() {
$(‘#box’).stop().slideDown(600);
}, function() {
$(‘#box’).stop().slideUp(600);

});
});

Thanks in advance

Asmae says:

thank you a lot ..this has been very helpful

Roy says:

wow, i cannot download the video, its not progressing at all…

i think i’ll miss this one… i really need this tutorial:P can u upload a better version?

thx

Dr Rhyf says:

great tut, js keep improving…

Steve Ottenad says:

The video seems to blow up around 7 minutes. I’m using Chrome.

KN says:

Good instructional. I think I would point out that hover accepts to values to further clarify the introduction of a second function. If someone hasn’t reviewed the documentation they may not realize that this method accepts more than one and also why.

Rumi says:

The screen of Day 7 lesson is unreadable.