.hover()
Định nghĩa và sử dụng .hover() kết hợp xử lý cả 2 sự kiện di chuyển con trỏ chuột vào thành phần (mouseenter) và di chuyển con trỏ chuột ra khỏi thành phần (mouseleave). .hover() được sử dụng trong việc thực hiện một việc gì đó khi hover chuột. .hover(xử lý mouse enter,xử lý mouse […]
Định nghĩa và sử dụng
.hover()kết hợp xử lý cả 2 sự kiện di chuyển con trỏ chuột vào thành phần (mouseenter) và di chuyển con trỏ chuột ra khỏi thành phần (mouseleave)..hover()được sử dụng trong việc thực hiện một việc gì đó khi hover chuột.
.hover(xử lý mouse enter,xử lý mouse leave)
Cấu trúc
$('p').hover(function(){
$(this).css('color','red');
},function(){
$(this).css('color','black');
});
Html viết:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Tiêu đề</title>
<script src="https://code.jquery.com/jquery-latest.js"></script>
<script>
$(function(){
$('p').hover(function(){
$(this).css('color','red');
},function(){
$(this).css('color','black');
});
});
</script>
</head>
<body>
<p>Thành phần p</p>
</body>
</html>
Hiển thị trình duyệt:
Thành phần p
Di chuyển con trỏ chuột vào thành phần p để thấy được hiệu ứng.
So sánh code HTML trước và sau khi có jQuery:
| Trước khi có jQuery | Sau khi có jQuery |
| <p>Thành phần p</p> | <p style=”color: red;”>Thành phần p</p> |
