2013-01-22 2 views
0

Есть ли способ добавить hoverinter к этому фрагменту jquery? В настоящее время, если вы наведете вокруг окружающих элементов класс «wall-block-content», все они исчезают.Добавить hoverintent в этот фрагмент jquery

$(".wall-block-content").fadeTo("fast", 0); 

$(".wall-block-content").hover(function(){ 
$(this).fadeTo("fast", 1); 
},function(){ 
$(this).fadeTo("fast", 0); 
}); 
+0

Можете ли вы показать пример «окружающих элементов с классом контента на стенах»? Может быть, есть простой jsFiddle того, что происходит – Ian

ответ

0

Используйте animate() метод вместо этого, гораздо более твердых и вы можете улучшить свои анимации, как это:

Update: Вы можете создать поддельный элемент с прозрачным BG и чем использовать его для запуска анимации атакуемого элемента , Here is jsFiddle sample.

$(".hidden").hover(function(){ 
    $('.target').stop().animate({'opacity':'1','margin-top':'0px'},100); 
},function(){ 
    $('.target').stop().animate({'opacity':'0','margin-top':'20px'},100); 
}); 

<div id="wrapper"> 
    <div class="target posi"></div> 
    <div class="hidden posi"></div> 
</div> 

#wrapper { position:relative; left:0; top:0; } 
    .posi { position:absolute; left:100px; top:100px; width:200px; height:200px;} 
     .hidden { background:transparent; cursor:pointer; } 
     .target {background:red; opacity:0;} 
+0

И почему он более твердый? – Ian

+0

Это здорово, но есть ли способ скрыть div .wall-block-content до тех пор, пока кто-то не нахмурится? –

+0

@DeanElliott Я обновил свой ответ, проверьте jsFiddle, пожалуйста. –

0

использовать таймер для реализации намерения: http://jsfiddle.net/bxqTr/

$(".wall-block-content").hover(function(){ 
    var $this = $(this), 
     timer = $this.data("timer"); 

    if(timer) window.clearTimeout(timer); 
    timer = window.setTimeout(function() { 
     $this.stop().animate({'opacity':'0'},100); 
    }, 1000); 
    $this.data("timer", timer); 
},function(){ 
    var $this = $(this), 
     timer = $this.data("timer"); 

    if(timer) window.clearTimeout(timer); 
    $this.stop().animate({'opacity':'1'},100); 
}); 

В этом примере, пользователь должен парить над элементом, по меньшей мере, 1 секунду (1000 мс), чтобы показать намерение. Барлас прав, хотя использование анимации чище.

Смежные вопросы