Firefox 57 closing dropdown when scrolling up or down - javascript

When you open a dropdown, and then scroll up/down a bit, the dropdown is getting closed. It is happening in FF 57.0.3 64 bit, but chrome looks good. This problem was not there until my FF upgraded to 57+. If you try this example in both browser, you will see the same problem.
I was playing around with the both browsers. I don't think this is a bug, seems like a feature specific to browsers. In Chrome they don't let you scroll when dropdown is opened. In Firefox, They let you scroll, by closing the dropdown automatically. Any idea how can I make Firefox to behave same as Chrome?

Related

Wrong clickable area of a button on mobile

This is my website.
I'm currently working on multi-choice filters, or rather on resetting them. There is no problem on PC.
Click the X button and it clears the filter
But the same simple thing doesn't work like this on mobile devices. I don't understand why.
You need to click an area below the X button, well below, to dismiss the filter.
This is how you need to click to make it work
Also, I just realized that when clicking like this there is an error in the console.
Error in the console after successful dismissing
I'm testing the mobile behavior in Opera (PC version, last update) using the Inspector with mobile simulation; the device is irrelevant. You can try it too.
The same behavior occurs on an actual android, both in Chrome and Opera.
Side notes!
If you activate the dropdown search in any multichoice field, while it's visible, the close buttons work perfectly well and precisely on mobiles. (Although the behavior of this dropdown panel is weird too. It does not always drops down when focusing on a field, as it does on PC.)
When I tried to locate the close button using the console and Jquery and then applied .click(), it worked. So I guess the problem doesn't lie in JS.
If you want to test it on a phone choose the Desktop site. On the mobile view, though, another peculiar thing occurs-the blue X button to the right of the field doesn't work.
PS. I've been wracking my brains for 3 hours to solve this mystery, yet no result. Please help!
The culprit was the "chosen" plugin. Don't use this crappy plugin. They simply don't support mobile devices and have tons of bugs.
I switched to Select2 and everything is great.

chrome on android : my webpages sometimes appears to be full black - need to ex rotate to get it shown?

got this really odd and frustrating issue on my android tablet/android phone, got a webapp (html5/javascript/css) that works fine on chrome desktop - but on mobile and tablet chrome, it happens all too often that when i click into a new page, then the output in the browser is just a pure black page.
What i then can do is to either rotate the device so the screen switches orientation and then the page appears like magic, or i can ex press the multi-tab button and then just click back and it shows.
So it somehow seems to be about redrawing not reloading the page.
Its not everytime it happens but it happens quite alot and i get nothing in debugging or any hints to what is going on.
Looked through the internet for similar issues and there are a few but they are either not replied or they are focused around some youtube issues back some time, or very old issues (2011/2012) - nothing that really points into the problem here.
Anyone have any idea here or input to how i can fix this without having the user to rotate the screen all the time ? its really affecting the usage.
note 1: it is quite heavy on some places on javascript so its not just a standard webpage
note :running latest android latest chrome on android
Look here. It's the same bug.:
How to fix black screen on Google Chrome mobile load page
The bug got fixed Feb 28: https://bugs.chromium.org/p/chromium/issues/detail?id=933374
But it doesn't seem to have made it in the next version of Chrome Android: https://chromium.googlesource.com/chromium/src/+log/72.0.3626.105..72.0.3626.121?pretty=fuller&n=10000
But the next version again should release with the bug fix (mid April?).
Meanwhile, did you find an easy js workaround for this issue?
Our site is currently useless until this bug-fix get released for Chrome Android?

classlist.toggle() does not work as expected on mobile safari

I have a function to add an open class to a drop down menu so it stays open on mobile browsers
the function worked fine also on safari, but now I saw it doesn't work on safari like before
the problem: it opens up the drop down menu but it doesn't close anymore only if you reload the site (or switch to another one)
tested I have nothing as I have no clue what even could go wrong with that code.
in chrome, firefox, edge also in chrome on android it's working fine
the function is the following (very simple)
function togglenav(tagid) {
document.getElementById(tagid).classList.toggle('navopen');
}
any idea what could go wrong only on safari?
edit: correctet the sentence that should tell on what browsers it's working (forgott the part that stated this)
Reload without content blockers?
Not sure if this is the same case as you're experiencing, but I had almost identical JavaScript that worked in mobile Safari on my wife’s iPhone X, but not on my iPhone 6. Turns out the model was irrelevant. I had the Better ad/tracking blocker running on my iPhone which stopped the script from loading.
If this is the case, tap/hold the URL and “reload without content blockers”. Worked for me, but worth bearing in mind that mobile Safari on my wife’s phone loaded it without a hitch.

Clicking on link does not work on firefox

I use Firefox 36 on Windows 7. I am seeing a strange problem where the product that i work on, javascript suddenly stops working on FF 36. I do not see any errors in the console when it stops working too. For eg: empty drop down list, missing hover icons, unable to click on links, links or button disappearing. The same on IE11 and chrome work fine. Is there a way I can figure out why this is a problem on FF-36?
I was seeing the above problem because I had Firebug turned ON and that disabled javascript on the page. Disabling firebug and refreshing the page enabled the javascript again.

window.focus() or window.blur doesn't work in modern browsers?

A project I'm working on requires that we create a pop up window and then change focus back to the parent window. Many solutions that seem to have worked in the past seem to not work at all in many new versions of Chrome, Firefox, and Safari and IOS 8 Safari. For example this W3C demo http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_win_blur does not work in those browsers but does work properly in IE10 and below.
It seems as though browsers might have started deprecating this feature but I've seen no documentation about it. Could anyone point me to an alternative to window.focus() and window.blur() that will work on IOS 8 Safari or at least some documentation about the methods being deprecated?
----- To elaborate a bit more for my colleague ----- Mike LP
The situation is as such:
We have a web application that requires the explicit use of a popup window. Overlays and iframes are an option due to some technical constraints.
While not desirable, it is okay that the newly created popup window receives focus upon opening, but we have a button on the popup that when clicked should return focus to the parent window, while leaving the popup open.
We've been unable to accomplish this using any of the modern browsers, though we do have a solution that works on iOS 7 Safari. Unfortunately even that appears to no longer work on iOS 8.

Categories

Resources