Не може да слуша DOMMouseScroll на Window във Firefox

Изпитвам доста проблем, свързан със събитието колело на мишката (DOMMouseScroll) с firefox. Имам div за заглавие, div за съдържание и div за долен колонтитул. Искам потребителят да може да превърта страницата, докато е в горния и долния колонтитул, но не и в съдържанието, защото има обект на карта (флаш обект) и колелцето на мишката трябва да увеличава и намалява.

Използвам jQuery 1.8 и Firefox 15.0.1. Прекарах почти цял ден, опитвайки се да разбера това и ми се струва, че това трябва да работи:

var isFireFox = (navigator.userAgent.indexOf('Firefox') != -1); 
var scrollEv = (isFireFox)? 'DOMMouseScroll' : 'mousewheel';

$(document).on(scrollEv, HandleScroll);

function HandleScroll(e)
{
    var sender = event.srcElement;

    alert(sender.id + " has sent event: " + e.type);

    if (sender.id == "viewerContent" || sender.id == "mapObject")
    {
        alert("Event is being blocked");
        e.stopPropagation();
        e.preventDefault(); 
    }
}

Прочетох безброй публикации, теми и блогове и всичко, което прочетох, казва, че това трябва да работи в IE, Chrome и Firefox. Разбира се, не работи във FireFox. Дори не влиза във функцията "HandleScroll". Освен това мисля, че дори трябва да е възможно да се направи нещо по-просто, като това:

$('#viewerContent').on(scrollEv, false);
$('#mapObject').on(scrollEv, false);

Нещо просто ли съм пропуснал или какво?

Благодаря за помощта,

Гилман

Добавено:

Следвайки предложението на Fabricio Matté, аз също опитах това:

$('#viewerContent').scroll(HandleScroll);
$('#mapObject').scroll(HandleScroll);

И този :

$('#viewerContent').on('scroll', HandleScroll);
$('#mapObject').on('scroll', HandleScroll);

Безрезултатно!

Добавен отново:

jcubic ми предложи да използвам приставката на тази страница: github.com/brandonaaron/jquery-mousewheel

Не съм много сигурен как работи, трябва ли просто да включа скрипта в страницата си чрез таг на скрипт, след което да извикам един от методите, както е показано в примера на предоставената връзка?

Благодаря

Допълнително допълнение:

Накарах приставката да работи, беше доста лесно. Това обаче не решава проблема ми. Работи за стандартен div, но изглежда не работи за div, съдържащ флаш съдържание. Започвам да си мисля, че това е грешка във флаш или firefox, както може би е описано тук: http://cookbooks.adobe.com/post_Workaround_to_support_mouse_wheel_for_FireFox_with-13086.html

Ако някой може да потвърди това, ще съм благодарен.

Друго решение, което не работи:

Следвайки предложението, направено от sethetter, опитах това:

var isOverContent;

$('#viewerContent').on('mouseover', function(){isOverContent = true;});
$('#viewerContent').on('mouseout', function(){isOverContent = false;});

document.onscroll = HandleScroll;

function HandleScroll(e)
{       
    if (isOverContent)
    {               
        console.log("Tried to block event");
        e.stopPropagation();  // Apparently, the "scroll" event cannot be prevented or canceled.
        e.preventDefault(); 
    }
}

Това ми позволява да открия кога потребителят е превъртял над viewerContent във FireFox. Събитието за предотвратяване по подразбиране и спиране на разпространението обаче не работи. Страницата продължава да се превърта.


person Ggilmann    schedule 03.10.2012    source източник
comment
Опитахте ли $('#viewerContent').on('scroll', handler) / $('#viewerContent').scroll(handler)? Разбира се, ако искате действително да отмените събитието за превъртане, това би било просто досадно за потребителя, но e.preventDefault() теоретично трябва да работи.   -  person Fabrício Matté    schedule 03.10.2012
comment
Просто го пробвах, без успех. Сигналите не изскачат.   -  person Ggilmann    schedule 03.10.2012
comment
За събитие като това опитайте да не предупреждавате и вместо това използвайте нещо като console.log или добавете нещо към изходен div за тестване.   -  person Ian    schedule 03.10.2012
comment
Да, наистина става досадно, когато работи! Добър съвет за console.log. Все още има нужда от решение!   -  person Ggilmann    schedule 03.10.2012
comment
Има jquery плъгин за това, github.com/brandonaaron/jquery-mousewheel   -  person jcubic    schedule 04.10.2012
comment
Да, видях тази страница, но не съм много сигурен как да я накарам да работи... Ще я разгледам по-подробно утре сутринта. По принцип трябва ли просто да включа js файла като скрипт към моята страница, след което да извикам метода, както е показано в примера на предоставената от вас връзка?   -  person Ggilmann    schedule 04.10.2012
comment
Така че опитах този плъгин, той също не работи. Въпреки това успях да го накарам да работи на празен div. Започвам да подозирам, че firefox има проблем с изпращането или прослушването на събитието DOMMouseScroll в div, който има флаш съдържание.   -  person Ggilmann    schedule 04.10.2012
comment
Събитията на мишката ще се задействат само в самата Flash среда - и няма да се върнат обратно в браузъра - очевидно в зависимост от браузъра. Понякога можете да избегнете това, като промените параметъра wmode на flash на opaque. Това означава, че браузърът се опитва да изобрази Flash прозореца като част от действителната страница - това обаче може да има странични ефекти за вашето Flash съдържание. helpx.adobe.com/flash/kb/   -  person Pebbl    schedule 04.10.2012
comment
Само за потвърждение, този непрозрачен параметър трябва да бъде зададен при вграждане на SWF правилно (swfobject.embedSWF(...))? Ако е така, просто го пробвах и не се получи.   -  person Ggilmann    schedule 04.10.2012


Отговори (4)


Според тази страница (http://bytes.com/topic/javascript/answers/160971-window-onscroll-firefox) можете да опитате window.onscroll = scrollHandler; Пробвай.

person sethetter    schedule 04.10.2012
comment
Това беше справедливо предположение, преди OP да редактира, за да обясни, че истинският проблем е използването на Flash елемент на страницата. С добавянето на тази нова информация това вече не е добър отговор. (Но не се колебайте да редактирате или публикувате нов отговор въз основа на новата информация!) - person apsillers; 04.10.2012
comment
Всъщност изглежда, че с комбинация от mouseover/mouseout върху viewerContent, мога да открия кога потребителят е превъртял върху флаш съдържанието или не. Сега просто трябва да разбера как да спра превъртането на страницата - person Ggilmann; 04.10.2012
comment
Вижте оригиналната публикация, ще добавя текущото си решение - person Ggilmann; 04.10.2012

Надграждайки предложението на sethetter, в крайна сметка написах това:

<script type="text/javascript">
  var isFireFox = (navigator.userAgent.indexOf('Firefox') != -1);   

  if (!isFireFox)
  {
      $('#viewerContent').on('mousewheel', false);
      $('#mapObject').on('mousewheel', false);
  }     
  else if (isFireFox)
  {
    var isOverContent;                                                   
    var lastPosY;

    $('#viewerContent').on('mouseover', function(){isOverContent = true;});
    $('#viewerContent').on('mouseout', function(){isOverContent = false;});

    window.onscroll = HandleScroll;
  }

  function HandleScroll(e)
  { 
    if (isOverContent)
    {                   
      $(window).scrollTop(lastPosY);    
    }
    else
    {
      lastPosY = $(window).scrollTop();
    }
  }
</script>

Не е красиво, но работи във firefox и други браузъри. Той създава някакъв ефект на бъг при превъртане на флаш обекта, но не позволява на потребителя да превърта страницата. Освен това изглежда, че ефектът на бъгове е най-малко видим във firefox, така че запазих по-добрите решения за IE и Chrome.

Тъй като sethetter ме насочи на правилния път, отбелязвам неговия отговор като решение.

наздраве!

Гилман

person Ggilmann    schedule 04.10.2012

Просто виждам подобен проблем и използвам

onwheel

вместо

onDomMouseScroll

може да реши проблема ми.

person Fabian    schedule 28.01.2015

Намерих решение в firefox+jquery mousewheel scroll event bug проработи.

проверете го с този код:

$(document).bind("mousewheel DOMMouseScroll", function (e) {
            e.stopImmediatePropagation();
            e.stopPropagation();
            e.preventDefault();

            var delta = parseInt(e.originalEvent.wheelDelta || -e.originalEvent.detail);

            alert(delta);
            return false;
        });

късмет.

person Hamid Reza    schedule 18.02.2014