current community

your communities

more stack exchange communities

Stack Exchange
tour help
stack overflow careers
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote -1 down vote favorite

I have a div that is 50X100 pxs and I want to extend the height to 125 pxs when my mouse enters it. The div's class name is Home. Here's what I have so far:

$(document).ready(function(){
    $('.Home').mouseenter(function(){
        $('.Home').animate({height: "125px"})
    })
});

It doesn't seem to be doing anything. Am I completely wrong or just missing one element or something?

share|improve this question
    
That seems to be working fine, even though "125px" could simly be replaced with 125. And the second $('.Home') could indeed also be $(this). Did you include a link to the library? –  Shikkediel 17 mins ago
    
what you have is correct: jsfiddle.net/qmjkt8au are you sure your markup is correct? maybe you have the case wrong (i.e. 'home' instead of 'Home' –  Sammy 17 mins ago

3 Answers 3

up vote 0 down vote accepted

You can do this easily with CSS3

HTML: 

<div class="home">
la la la la la
</div>

CSS:

.home{
height: 100px;
background: red;
color: #fff;
width: 50px;
transition: height .5s ease-in-out;
-webkit-transition: height .5s ease-in-out;
cursor: pointer;
}
.home:hover{
    height: 125px;
}
share|improve this answer
up vote 0 down vote 
$(document).ready(function(){
    $('.Home').mouseenter(function(){
        $(this).animate({height: "125px"})
    })
});
share|improve this answer
up vote 0 down vote

Your code worked perfectly fine for me.

$(document).ready(function(){
    $('.Home').mouseenter(function(){
        $('.Home').animate({height: "125px"})
    })
});

You can test here: http://jsfiddle.net/actvge85/

are you sure you included jquery?

it could also be written:

$(document).ready(function(){
    $('.Home').mouseenter(function(e){
        $(e.target).animate({height: "125px"})
    })
});
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.