jquery

Question

Я хочу, чтобы миниатюра в моем существующем коде исчезла по одному, когда наведите указатель мыши на один большой палец, а весь большой палец наведен, есть ли способ сделать это. при наведении только этот большой палец имеет эффект наведения?

Демонстрация находится здесь!

js

 $(document).ready(function()
{    
    $(".hoverMe").hover(
      function () {
        $("div.fadeHover").fadeIn('slow');
      }, 
      function () {
        $("div.fadeHover").fadeOut('slow');
      }
    );
});

jquery

0

jhunlio 24 Мар 2014 в 09:07

Answer 1

Вы можете использовать $(this) для таргетинга на текущее наведение .hoverMe, а также .siblings ( ) , чтобы настроить таргетинг только на одного брата .fadeHover зависшего изображения:

$(document).ready(function () {
    $(".hoverMe").hover(function () { 
        $(this).siblings('.fadeHover').stop().fadeIn('slow');
    }, function () { 
        $(this).siblings('.fadeHover').stop().fadeOut('slow');
    });
});

Вы также можете использовать .stop () , чтобы остановить текущую анимацию, чтобы ваша анимация будет вести себя так, как вы ожидаете.

Обновленный скрипт

Похоже, вам нужно настроить таргетинг на .wrap div вместо изображения .hoverMe здесь:

$(document).ready(function () {
    $(".wrap").hover(function () { 
        $(this).find('.fadeHover').stop().fadeIn();
    }, function () { 
        $(this).find('.fadeHover').stop().fadeOut();
    });
});

Демонстрация скрипта

1

Felix 24 Мар 2014 в 09:33

Мы можем настроить задержку, когда вы наводите большой палец, он появляется поздно?

–

jhunlio

24 Мар 2014 в 09:27

Answer 2

Вам нужно нацелить относительный элемент

$(document).ready(function () {
    $(".hoverMe").hover(function () {
        $(this).closest('li').find(".fadeHover").fadeIn('slow');
    }, function () {
        $(this).closest('li').find("div.fadeHover").fadeOut('slow');
    });
});

ДЕМО

В этом случае вам нужно настроить таргетинг на элемент fadeHover, который находится в том же li, что и зависший элемент hoverMe.

2

Arun P Johny 24 Мар 2014 в 09:20

Спасибо за ваш ответ, есть ли способ сделать так, чтобы постепенное появление / исчезновение появлялось только один раз?

–

jhunlio

24 Мар 2014 в 09:19

Answer 3

Попробуй это

$(document).ready(function()
{    
    $(".hoverMe").hover(
      function () {
        $(this).parent().parent().find("div.fadeHover").fadeIn('slow');
      }, 
      function () {
        $(this).parent().parent().find("div.fadeHover").fadeOut('slow');
      }
    );
});

ДЕМО

0

Sridhar R 24 Мар 2014 в 09:18

jquery - убирать только один большой палец за раз

3 ответа

Похожие вопросы

Новые вопросы