Замена MouseOver с .hoverIntent

Прежде всего я приношу извинения... Я отправил этот вопрос прежде, но я сделал безнадежное дело объяснения его. Я испытываю затруднения при включении hoverIntent в следующий JavaScript... Мне нужен он для замены mouseenter и mouseleave функции ниже. Только, чтобы быть ясным, я обращаюсь за помощью, потому что я не очень хорош с синтаксисом JavaScript. Второй фрагмент кода ниже кажется, что должен работать, но он ничего не делает и кажется абсолютно мертвым в Internet Explorer.

if (jQuery.browser.msie === true) {
  jQuery('#top_mailing')
    .bind("mouseenter",function(){
      $("#top_mailing_hidden").stop().slideDown('slow');
    })
    .bind("mouseleave",function(){
      $("#top_mailing_hidden").stop().slideUp('slow');
    });
}

Я использую следующее для других браузеров, но оно не функционирует в Internet Explorer.

$('#top_mailing').hoverIntent(
  function () {
    $("#top_mailing_hidden").stop().slideDown('slow');
  }, 
  function () {
    $("#top_mailing_hidden").stop().slideUp('slow');
  }
);

5
задан Levi Lindsey 16 December 2014 в 19:44
поделиться

1 ответ

Думаю, я нашел проблему.

Вы вызываете $ ('# top_mailing'). HoverIntent (... дважды. Один раз в конце файла hoverintent_r5.js и один раз в вашем файле custom.js. Очевидно IE не нравится. Избавьтесь от одного или другого, и все будет хорошо.

Вероятно, лучше сохранить весь свой код в собственном js-файле. В противном случае об этом легко забыть.

EDIT: Избегая проблемы stop ().

Я предпочитаю анимировать:

$('#top_mailing').hoverIntent(
  function () {
    $("#top_mailing_hidden").stop().animate({height:150},'slow');
  }, 
  function () {
    $("#top_mailing_hidden").stop().animate({height:0},'slow');
  }
);

Таким образом, когда вам нужно остановиться и изменить направление, он всегда будет знать, куда идти. (0 и 150 в примере выше.)

Обратите внимание, что для этого потребуется, чтобы для top_mailing_hidden было установлено clip: auto; overflow: hidden .

Поскольку вы используете hoverIntent, может не потребоваться вызов stop (), поскольку hoverIntent предназначена для того, чтобы избежать этих непреднамеренных событий наведения указателя мыши.

Немного не по теме:

Помните одну вещь в своей реализации. Поскольку это форма для заполнения, пользователи, скорее всего (даже не задумываясь) уберут указатель мыши из путь где n они начинают печатать. Это приведет к исчезновению формы.

Имея это в виду, вы можете пересмотреть выполнение события mouseout. Вы всегда можете заставить его сдвинуться вверх, когда пользователь отправляет форму, с помощью дополнительной кнопки «Отменить» или «Закрыть».

3
ответ дан 15 December 2019 в 06:25
поделиться
Другие вопросы по тегам:

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