如何用Javascript擴展HTML元素？

-1

我有一個div是50X100 pxs，我想在鼠標進入時將高度擴展到125 pxs。 div的類名是Home。這是我到目前爲止：如何用Javascript擴展HTML元素？

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

它似乎沒有做任何事情。我完全錯了，或者只是缺少一個元素或什麼？

來源

2015-04-01 JustinLG9

，這似乎是做工精細，即使' 「125px」'可以simly用'125'被替換。而第二個$（'。Home'）'確實也可以是'$（this）'。你有沒有鏈接到圖書館？ – Shikkediel 2015-04-01 02:37:15

你有什麼是正確的：http://jsfiddle.net/qmjkt8au/你確定你的標記是正確的嗎？也許你錯了（即'家'而不是'家' – Sammy 2015-04-01 02:37:25

你可以用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; 
}

來源

2015-04-01 02:36:47 toolbox3

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

來源

2015-04-01 02:36:17 reptilicus

你的代碼工作完全對我很好。

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

您可以測試在這裏： http://jsfiddle.net/actvge85/

你確定你包括jQuery的？

也可以寫爲：

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

來源

2015-04-01 02:40:35

如何用Javascript擴展HTML元素？

回答

相關問題