Address bar keeps popping down in mobile Safari - javascript

I am having trouble in mobile Safari. I have a link that when clicked (or tapped) fires some Javascript but does not navigate to a new page (onclick="return false"). The link is performing the way that I want but when it is tapped the address bar in mobile safari pops down for a second giving the impression that one is navigating somewhere. I need a way to prevent this behavior.

The only solution I have found is to remove the href's from the links in general via javascript.

Related

How does youtube web prevent playing from control center on safari iOS

I was trying to stop a video on Safari for iOS, when the browser goes in background. I was able to do that through Page Visibility API.
On iOS's home screen, if I open the Control Center and press play button, it normally plays the last Safari's content.
What I'm trying to achieve is a Youtube Web mobile-like behavior: it is able to prevent this behavior. If you close Safari with a tab running Youtube, you are not able to press play in the control center and play the content.
I've already tried e.preventDefault() behavior on event.
I've tried to insert flags in pageshow/pagehide (as I found in another SOW answer, but these events seems to not being called on background running.
Also, I wasn't able to control that through the Page Visibility API and inserting flags in it's callbacks: even if events gets called when going in background, "overriding" HTMLMediaElement.play() does not work and the problem concerns iOS's Control Center.
It is like it does not use HTMLMediaElement.play()...
Does anyone have a clue on how to override Control Center's "Play button" behavior from web? Thank you.
It seems like Youtube fully unloads the content when the browser goes on the background and reloads the content starting at the point the user "interrupted".
I decided to follow the same way.
Moreover, the same iOS behavior seems to happen also on Android notification center (when Chrome shows you a tab is reproducing audio).

How to trigger <a>'s click event on safari

http://nycweb.io/test.html
Its html is
click
In chrome's console, if you do
document.getElementsByTagName('a')[0].click()
It will open a new page of google.com. Surprisingly, in Safari, this doesn't work. I searched around and found this page saying there is a bug with Mobile Safari which prevents the click event from being triggered. Also it lists some workarounds. I was hoping it would help when I started reading it, but it actually makes me more confused.
First of all, it says the bug only happens with Mobile Safari, but anyone with a Macbook can test from the link above that it doesn't work with Safari either; second of all, it says it only happens with "elements that aren't typically interative", and the workaround includes adding "href" to <a> to make it interative. But my test above shows that it doesn't work with <a> at all, no matter it has href or not.
The actual problem I am trying to solve is this page "http://fbnydob.applinzi.com/test.php", where you can see a warning message pushed by the Hosting company, which can only be prevented by click the little 'x'. I was trying to click it programmatically but it is an <a> even without href, so my program fails to work on Apple devices and my users keep seeing this unpleasant message.
Any workaround for this that actually works?
Could you try firing the click event?
document.getElementsByTagName('a')[0].fire('click')
This will call the click handler and close the popup window.

clicking 'back' from an iframe changes parent window

I have a script that writes an iFrame which loads a page. I created a JSFiddle to make things clear:
link JSFiddle loading CNN in a frame
This loads CNN in a frame. If you scroll down in the frame to the news and click on the new articles and then 'back' there is some strange behavior in both Safari and Google Chrome: clicking 'back' doesn't take the iframe 'back', it takes the entire parent frame 'back'. How can I prevent this from happening?
Also strange is that fact that this doesn't always happen. Try it out for yourself, click at least 5-10 links and you'll see that the fiddle will reset itself every now and then. And that shouldn't happen...
This is behavior that only seems to happen in Safari en Chrome, Opera and IE don't seem to have this problem...
Browser registers history events when you click different URLS, since iframe is part of the page u are on it will register the click inside the iframe as a history event of the parent page. Different browsers may have slightly diferent behavior - I expect FF and Chrome be one way and IE behave slightly different. However testing your example both Chrome and IE worked exactly the same and pretty much as expected.
So to clarify:
Loading JSFiddle is a historical event as far as browser is concerned.
Clicking the button to create and load an Iframe is NOT a historical event.
Clicking a URL link within the Iframe window is a historical event.
At this point u have 2 states that the browser remembers and you can go back and forth in history between them.

chrome safari javascript jquery back

Is there anything particular to chrome or safari that would make a javascript/jquery script work on the first page load, but then when the user hits the back button after navigating the site, it causes select boxes to be selected?
Here is the code. Apologizes before hand for the lack of conventions. I had to get this up quick:
http://www.mailcanarias.com/index.php
I believe that's because (at least Safari) auto-refills forms when you go back

How to prevent the 'Save (image) as' dialog on Ctrl+click in Opera

I have to create an image gallery where user can select some images and then process them. The selection should be done via Ctrl+LeftClick of the mouse. It works well in FF and IE8, but when I Ctrl+click in Opera, new dialog "Save as" appears which causes saving the clicked image.
How do I prevent opening the dialog in Opera? (it's probably system setting)
I haven't still found any solution. The question at Opera remains unanswered since June,2008 :(
Is it even possible? Ctrl+Click is standard way in OS, that's probably the problem - adapting desktop behaviour to web.
In Opera, it is possible to set this behavior in Tools->Preferences->Content->JavaScript Options->Allow script to detect context menu events. This is unchecked by default, which means that most users will see the browser's context menu.
This was added to prevent "context menu hijacking"; unfortunately, this limits all browser apps to the left mouse button. You could have the user rightclick->Edit site preferences->Scripting->Allow script to detect context menu events; this should allow your site to use this functionality.
I don't believe this is possible - I'd advise a different key mapping for Opera (or indeed all browsers)
For example, Opera has an option where the right click context menu cannot be disabled by javascript - as a protection for Opera users.
Can you make it just a click? that would toggle each picture. e.g. first click selects, then if you click it again, it deselects.
Something like this... where you can visually see what has been picked.
If you're attempting to prevent people from saving image it is pointless. All the user needs to do to get around context-menu-hijacking is disable JavaScript temporarily on that page, or press PRINT SCREEN.
This should work:
<img src="myImage.png" onclick="event.preventDefault();">

Categories