Событие hover() и очередь анимации

@Galamoon · Регистрация: 05.09.2012

Студворк — интернет-сервис помощи студентам

Проблема с меню сайта galamoon.ru как редактировать очередь анимации, надо чтобы анимация в меню только раз проигрывалась. Прикрепляю код

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<body>
        <header>
            <div id="left_header"><figure class="left_header_resize"><img src="images/bg/header.png" /></figure></div>
            <div id="logo"><figure class="logo_resize"><img src="images/bg/logo.png" /></figure></div>
        </header>
        <nav id="menu">
            <a href="#"><img src="images/menu/home.png" alt="home" id="home_jpg" /> <span id="home" class="menu_article">Главная</span></a>
            <a href="#"><img src="images/menu/about_me.png" alt="about_me" /></a>
            <a href="#"><img src="images/menu/portfolio.png" alt="portfolio" /></a>
            <a href="#"><img src="images/menu/contakt_me.png" alt="contact_me" /></a>
            <a href="#"><img src="images/menu/news.png" alt="news" /></a>
            <a href="#"><img src="images/menu/sale.png" alt="sale" /></a>
        </nav>
</body>

JavaScript
1
2
3
4
5
6
7
8
9
$(document).ready(function(){
    $('#home').hide(0)
    $('#home_jpg').hover(function(){
        $('#home').show(1000);
    }, function(){
        $('#home').hide(1000);
    })
    
});

@Soldado · 29.04.2013, 21:24

При наведении на "домик" - открылась "Главная", убрали - закрылось, а при повторном наведении больше "Главная " не показывается

JavaScript
1
2
3
4
5
6
7
8
9
$(document).ready(function(){
    $('#home').hide(0)
    $('#home_jpg').one('hover',function(){
        $('#home').show(1000);
    }, function(){
        $('#home').hide(1000);
    })
    
});

@Galamoon · 29.04.2013, 21:58 **[ТС]**

Сообщение от Soldado

При наведении на "домик" - открылась "Главная", убрали - закрылось, а при повторном наведении больше "Главная " не показывается

Проблема то не в этом, я не совсем правильно объяснил. Если быстро несколько раз навести на домик то анимация будет повторятся столько раз сколько раз навёл на дом.

Я побывал метод .stop() он удаляет очередь анимации но и сама анимация пропадает, то есть проходит моментально навёл слово выскочило иконки сдвинулись.

Добавлено через 8 минут
Ввести что ли условие которое проверяло бы что анимация проиграла сначала до конца, только что в if () прописать не могу придумать

Добавлено через 11 минут
Пробую обработчик события .off()

HTML5
1
Метод off() удаляет обработчики событий, которые были прикреплены с помощью .on().

кто знает как правильно прописать это.

@Soldado · 29.04.2013, 22:41

С on и off - проблематично. Оключим отработчик, а потом включить - это снова повторить тот же код подключения. Можно подумать, но просто не получится - так думаю.
Посмотрите такой вариант

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<html>
  <head>
    <title>Fon</title>
    
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />    
<script src="http://code.jquery.com/jquery-latest.js"></script>
 
 <script type="text/javascript">
$(document).ready(function(){
 
   $('#home').hide(0);
    $('#home_jpg').mouseover(function(){
    var cssD=$('#home').css('display');
    if(cssD=="none"){$('#home').show(1000);}
        else{$('#home').hide(1000);}
     });
 
$('#home_jpg').mouseout(function(){
    
           $('#home').hide(1000);
     });
                     
 });/*end  ready*/
 </script>
    
  </head>
  <body>
 
  <a href="#"><img src="http://galamoon.ru/images/menu/home.png" alt="home" id="home_jpg" /> <span id="home" class="menu_article">Главная</span></a> 
  </body>
</html>

@Galamoon · 29.04.2013, 23:30 **[ТС]**

Спасибо работает как надо. С он офф действительно запутанно получалось.

Новые блоги и статьи Все статьи Все блоги /
Вывод данных через динамический список в справочнике Maks 01.04.2026 Реализация из решения ниже выполнена на примере нетипового справочника "Спецтехника" разработанного в конфигурации КА2. Задача: вывести данные из ТЧ нетипового документа. . .	Функция заполнения текстового поля в реквизите формы документа Maks 01.04.2026 Алгоритм из решения ниже реализован на нетиповом документе "ВыдачаОборудованияНаСпецтехнику" разработанного в конфигурации КА2, в дополнении к предыдущему решению. На форме документа создается. . .	К слову об оптимизации kumehtar 01.04.2026 Вспоминаю начало 2000-х, университет, когда я писал на Delphi. Тогда среди программистов на форумах активно обсуждали аккуратную работу с памятью: нужно было следить за переменными, вовремя. . .	Идея фильтра интернета (сервер = слой+фильтр). Hrethgir 31.03.2026 Суть идеи заключается в том, чтобы запустить свой сервер, о чём я если честно мечтал давно и давно приобрёл книгу как это сделать. Но не было причин его запускать. Очумелые учёные напечатали на. . .
Модель здравосоХранения 6. ESG-повестка и устойчивое развитие; углублённый анализ кадрового бренда anaschu 31.03.2026 В прикрепленном документе раздумья о том, как можно поменять модель в будущем	10 пpимет, которые всегда сбываются Maks 31.03.2026 1. Чтобы, наконец, пришла маршрутка, надо закурить. Если сигарета последняя, маршрутка придет еще до второй затяжки даже вопреки расписанию. 2. Нaдоели зима и снег? Не надо переезжать. Достаточно. . .	Перемещение выделенных строк ТЧ из одного документа в другой Maks 31.03.2026 Реализация из решения ниже выполнена на примере нетипового документа "ВыдачаОборудованияНаСпецтехнику" с единственной табличной частью "ОборудованиеИКомплектующие" разработанного в конфигурации КА2. . . .	Functional First Web Framework Suave DevAlt 30.03.2026 Sauve. IO Апнулись до NET10. Из зависимостей один пакет, работает одинаково хорошо как в режиме проекта так и в интерактивном режиме. из сложностей - чисто функциональный подход. Решил. . .

@Galamoon 0 / 0 / 0 Регистрация: 05.09.2012 Сообщений: 16
	29.04.2013, 23:30 [ТС]
	Спасибо работает как надо. С он офф действительно запутанно получалось. 0