Hover FadeOut для определенного класса

0

Я работаю над навигационной панелью, на которой есть изображение, и там есть ссылки. Когда пользователь наводил эти ссылки, он меняет фон на отображаемое на навигационном изображении изображение и указывает его место по свойству background-position CSS. Теперь я хочу, чтобы все ссылки на моем веб-сайте исчезли, показывая изображение .CLASS:hover медленно с подключаемым модулем jQuery. Мой код:

HTML:

<div class="navbar"><!-- NavBar Start -->
        <a href="#" class="nav_l_home" title="Home"></a>
        <a href="#" class="nav_l_services" title="Services"></a>
</div><!-- NavBar End -->

CSS:

.navbar {
    background:url(../img/nav.png) no-repeat;
    width:828px;
    height:72px;
    margin:auto;
    position:relative;
}
a.nav_l_home {
    width:112px;
    height:43px;
    position:absolute;
    bottom:14px;
    right:30px;
}
a.nav_l_home:hover {
    background:url(../img/nav_hov.png) no-repeat;
    background-position: -686px -15px;
}
a.nav_l_services {
    width:107px;
    height:43px;
    position:absolute;
    bottom:14px;
    right:161px;
}
a.nav_l_services:hover {
    background:url(../img/nav_hov.png) no-repeat;
    background-position: -560px -15px;
}

mmm sory для плохого объяснения ^ - ^ ".. все, что я хочу, это сделать a.nav_l_home: наведите указатель мыши на зависание мыши, чтобы все это ^^

Теги:

1 ответ

0
Лучший ответ

Если вы хотите, чтобы элемент затухал и исчезал при наведении мыши/мыши, вы можете сделать что-то вроде этого:

$('.foo').hover(

    function() {
        $('#bar').fadeIn();
    },

    function () {
        $('#bar').fadeOut();
    }

);

.hover() принимает два параметра: функцию вызова мыши и функцию вызова мыши. Методы.fadeIn() и.fadeOut() не требуют пояснений. Вы можете отрегулировать длительность эффекта затухания, передав число миллисекунд (целое число) в качестве параметра.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню