carlsednaoui / ouibounce

Increase your landing page conversion rates.
MIT License
2.31k stars 373 forks source link

fires events with Select/Option with IE #114

Open basilfarraj opened 8 years ago

basilfarraj commented 8 years ago

in IE once i trigger the change event on the Select and enter the Options, the ouibounce fires. i tried finding a fix couldn't get it done. anyone has an idea how to fix this?

kazimzaidi commented 8 years ago

I'm experiencing same. Any thoughts anyone? IE11.0

basilfarraj commented 8 years ago

No one helped with this kazimzaidi. I just disabled the the bounce when on IE.

snietert commented 8 years ago

I was dealing with the same problem and also tried to fix this. Failed. As I had some time constraints there was either an option to remove ouibounce, disable it for IE or find some hack to make it work for everybody. I chose the hack way by just instantly hiding the popup and re-initializing it. It has to be fast enough so the user does not see it. Have to test cross browser. Not super nice but works :)

$('#selectTriggeringTheModal').on('mouseleave', function(e){ window.setTimeout(function() { $('.modal').hide(); $('.popup-bg').hide(); setUpModal(); }, 5); });

yamanwa commented 7 years ago

Another workaround, check if the event was fired from within a select, this can be done on mouse event

var isIE = (navigator.appName == 'Microsoft Internet Explorer') || (navigator.appName == 'Netscape' && (new RegExp("Trident/.*rv:([0-9]{1,}[\.0-9]{0,})").exec(navigator.userAgent) != null));
if (isIE > 0) { /* IE */
    var list = document.getElementsByTagName("select");
    for (var i = 0; i < list.length; i++) {
        var rect = list[i].getBoundingClientRect();
        if (e.clientX >= rect.left && e.clientX <= rect.right && e.clientY >= rect.top && e.clientY <= rect.bottom) {
            return; /* event fired inside select */
        }
    }
    //Event in IE, not in a select
}
else {
    //Other browsers
}

Hope this is useful