jQuery .hover
Не могу понять что не правильно... всё по примеру вроде делал...
<script>
$( "#start" ).hover(
$("#desof_pan").show(),
$("#desof_pan").hide(); );
</script>
Hover не работает |
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style>
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
$(function() {
$('#foo').hover(
function(){
$(this).text('Курсор на объекте')
},
function(){
$(this).text('Курсор вне объекта');
});
});
</script>
</head>
<body>
<div id="foo">Наведи мышку и получи фишку!</div>
</body>
</html>
|
laimas,
мне нужно чтобы при наведении на #start появлялся #desof_pan и при отведении исчезал Поможешь? AAAAA? всё разобрался
<script>
$(function() {
$('#aa').hover(
function(){
$("#dd").show()
},
function(){
$("#dd").hide();
});
});
</script>
|
vuchastyi,
Попробуй быстро поводить по ссылке туда-суда теперь. |
Маууупа,
должны быть какие-то недостатки... я понял.. Объясни как лучше сделать... |
Для скрыть/показать лучше не использовать метод .hover(), лучше использовать .mouseenter() и .mouseleave().
|
laimas,
и что изменяется? |
vuchastyi,
Цитата:
|
Ну по сути самой ничего, если иметь ввиду сами события (hover и связывает два этих события вместе). Но когда дело касается визуализации, мало указать только эффект, бывает необходимо запустить ее по событию у текущего элемента и здесь же прекратить у других.
А то что вы хотите сделать, так это проще посредством CSS описать. |
vuchastyi,
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<style>
#aa{
height: 26px;
background-color: #FF00FF;
cursor: default;
}
#dd{
height: 100px;
background-color: RoyalBlue;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function() {
var $a = $('#aa'), $d = $('#dd');
$a.mouseenter(
function(){
$d.stop(true,true).delay(500).animate({height : 'show'});
}).mouseleave( function(){
$d.stop(true,true).delay(500).animate({height : 'hide'});
})
$d.hide();
});
</script>
</head>
<body>
<div id="aa">Наведи мышку и получи фишку!</div>
<div id="dd">test</div>
</body>
</html>
|
| Часовой пояс GMT +3, время: 12:12. |