JavaScript Trigger window.open When a User Clicks Anywhere on Page - javascript

I have a problem that I have been trying to figure out and haven't been able to get past it because Chrome/FireFox/IE do not publicly publish their "rules" for pop up blocking when it comes to JavaScript, Flash, etc. I am trying to trigger a window.open() when a user clicks anywhere on page. I've tried this:
document.onclick = window.open("http://msn.com");
But all 3 browsers are blocking the popup, even though it is a user interaction.

If the user is blocking pop-ups, it's because they don't want popups like yours to appear as a response to their user interactions. If a popup (as opposed to something more sophisticated such as making an otherwise hidden div appear) is what you really must have, then inform the user that they need to enable popups to interact with your site (I've seen a few sites do that, that annoys me and I count it as a big black mark against the site that prompts me to look for their competitors and alternatives, but if there's no real alternative I'll grit my teeth and temporarily re-enable popups in such cases). (But, do consider that annoying users is not a way to win their hearts and minds, so do look for nicer alternatives!-).

Related

periodically reload tab and bring to front

I have a requirement where a few users are required to keep a watch over a dashboard browser page.
My first thought was use some javascript magic that reloads the page, switches to it if it is not active and being the browser window to front. I quickly realized how difficult this (accept for reload) is and that browsers do everything possible to prevent it, with good reason.
On the other hand, I have err, seen some "websites" which show a pop-up telling me that my browser is affected and I need to call the given 800 number. These pop-ups are pretty much impossible to kill. I could use that if I knew how.
I have also considered utilities like ergociser which sit in the taskbar and open a browser window periodically. This could work but it opens a new pop-up window every time, while I am keen to reload it in the same window.
The closest I have come so far is to use alert which does not bring the window to front but it does flash the taskbar.
I am thinking of a chrome extension or firefox add-on that brings named pop-up tab. But I am open to any other ideas. It can be a browser specific solution, and it is ok to require white-listing in pop-up blockers
What is a best way to do this?
UPDATE
There are two close votes for "Too Broad". It is true that I am looking for the right technology to use for this problem, so I cannot refine it with technology-specific details. But short of that, appreciate if someone can give suggestion for narrowing down the problem statement.

Can a bot click a link that makes a modal window in javascript?

I have a form that launches in a modal window (fancybox to be exact) that loads a page that triggers an event in Google Analytics. I'm trying to keep bots from clicking it.
Since the fancybox uses jQuery to load the html page, can a bot reach the page and trigger the event? I'm trying to determine if the events are real.
I'm getting a difference between unique events and total events and trying to explain why there would be a discrepancy. Is the only way to explain it as genuine people clicking or could it be bots?
Yes, a bot can do that. There's many ways of creating bots, and different methods will make most bots undetectable unless you have some really complex checks in place. I believe reCaptcha has a tonne of checks for example, ranging from the movement of the mouse, the react time of the user, user agents and so on and so forth.
Bots can come in all shapes and forms, including some that might use Selenium to imitate a user using an actual browser, or they could even be written in a lower level and move the mouse and cause key presses on a system level.
What it comes down to is how much energy/time you're willing to expend to make it harder for bots to do their thing. I doubt you'll ever get 100% accuracy on stopping bots.
But yes, a bot can trigger a button press event, or even press the button directly like a normal user would

getUserMedia permission dialog disappears in FireFox

When I access getUserMedia, a permission dialog pops up and my website waits until the user either accepts or blocks the request. That part works in Chrome 47.
However, in FireFox 43, (at least), when the dialog is visible, the user can click anywhere else and it will disappear and getUserMedia's callback will never be invoked. Then the user can't give permission and my site is stuck waiting. And it is pretty easy to click somewhere else, too, so I'm anticipating lots of "the microphone doesn't work" support calls.
(That seems like a bug in FireFox to me, since Chrome keeps the dialog visible until the user clicks it.) But anyway, is there a work around?
For instance, is there a way to detect whether the permission dialog is currently visible?
Or is there a way to re-summon that dialog in javascript by using a setTimeout?
Does anyone have another suggestion about how to make this user experience better?
The only thing I can think of is to put up a message something to the effect of, "Waiting for permission to use the microphone. If you don't see a permission dialog please refresh this page." There must be something better than that.
Thanks!
The permission dialog is merely minimized. Click on the gray microphone (or camera) icon that the dialog hung off, which is still there in the URL bar, and the dialog grows back and can be answered.
It is not a bug, as it was designed to be less intrusive than Chrome, to not let sites keep users hostage, so to speak, until they give up permissions, but the behavior does seem to confuse a lot of people. See https://bugzil.la/1004055.
There is no surefire way to detect whether the permission dialog is currently visible, though if you detect a mouseclick anywhere on the page, and you have not gotten a response, then chances are it is not.
One workaround is to issue another getUserMedia call (through setTimeout or otherwise). It should not crash. If it does then please file a bug.
Another workaround is to programmatically refresh the page, using location.refresh().
If your site is not designed to work without a microphone, or you detect a user-action that suggests the user is stuck, then maybe something like "Waiting for permission to use the microphone. Please click the microphone icon in the URL bar to summon the permission dialog if it is not visible."

Javascript: Alert user without using an alert box

I'm trying to find an elegant way to inform a user that s/he is about to be logged out and I know that most browsers will give you some indication that a hidden tab has an alert box open. I would like to duplicate this functionality without actually showing an alert box.
I have thought about forcing the tab/window to gain focus, but that is quite obtrusive and I hate it when websites do that to me, so I'm looking for something a little more subtle.
Any ideas?
Edit/Clarification: I already have a div that pops up if they are about to be logged out. My problem is that if they are on another tab, they won't be able to see that div, so I would like some way to notify the user that something important has happened on my tab so they go check it out and see the logout notice.
The favicon idea listed below is an excellent idea, any others?
Here's an interesting way that comes to mind. When its time to be logged out, change the website's favicon dynamically. Newer browsers should be ok with it.
Look here: Changing website favicon dynamically
Some techniques I've seen:
Some sort of sound that's played (I think it's done with Flash in the case I'm thinking of, but maybe it's possible with HTML5's audio tag)
Flashing/alternating favicon
Use JavaScript to change the page title tag every 2s or so
You could create a page that informs them they will be logged out in a certain amount of time with a button that would allow them to maintain their session. Or maybe you could use a lightbox modal popup window (example here).
Why not swap out a div styled how you want to change to let them know they will be logged out soon? Then, you can simply have it as a portion of your page with all the same style and formatting?
For example, your normal page has some sort of page element with visibility:block; and then before they will be logged out, you change that to visibility:none; and change your other element (in the same place) to have visibility:block;
Does this idea make sense? You have to be able to detect when this is happening with Javascript already to alert, so instead of altering you are just swapping out display elements.
I hope this is helpful,
-Brian J. Stinar-
it probably doesn't go with what you're after but a simple modal window is probably a good idea? i know it doesn't alert the user instantly, and they won't see it unless they switch back to that tab, but it's unobtrusive and i believe most users would prefer not to have something rammed in their face!
If this notification is to be triggered by a user clicking "log out" or the likes then they will see it and it won't be as intrusive as forcing them to stop what they are doing and close the alert box.
And if it's due to time out or something similar then the user isn't overly concedrned or they would still be on that tab.
I think that this serves the best purpose in terms of usability as people don't want to be hassled or have their workflow broken by an alert shoved at them! A perfect example is Microsoft TFS which would constantly throw alerts at you when you got signed out, which got really frustrating, really quickly
so my answer is think how the user would like to be notified in the least obtrusive way :-)

What percentage of followed hyperlinks might have their "onclick" JavaScript ignored?

As far as I know all popular web browsers execute the onclick attribute of an anchor link first, then follow the path specified by the href attribute.
The problem here is that the onclick attribute only gets called when clicking with the left mousebutton (without pressing ctrl or shift for a new tab or window) or when pressing enter on your keyboard while the tabIndex is set to the link you want to follow.
But there are many other ways of following a link than just those two.
Ctrl + click
shift + click
rightmousebutton + open
rightmousebutton + new tab
drag & drop link to address bar
and so on...
My client uses onclick for conversion statistics. Which seems heavily unreliable.
My question:
What percentage of hyperlinks are being followed without activating their onclick attribute?
All estimates are highly appreciated. I'm completely lost; I think it can be any number...
Aside from those of us who habitually middle-click/ctrl-click to open links in new tabs, there's another major cause of onClick failure: NoScript and similar plugins which allow javascript to run only when it comes from whitelisted sites. If your domain isn't on my whitelist, then your onClick won't run, no matter how I trigger the link.
If you want reliable stats on which pages people are visiting, there's only one bulletproof source for that: The web server logs.
The logs are probably also your best bet for tracking how people move throughout the site, but they're not entirely reliable, as some privacy-paranoid users will falsify their referer headers or just not send them at all, but I expect that to be far less common than disabling javascript.
It depends. If the audience is more technically inclined, I'd assume that using alternative ways of following a link would be more common. All in all, though, even a lot of technical people seem to be unaware of things like clicking the middle mouse button to open or close a tab. If that's the case with technical people, I wouldn't be surprised if almost no one in the general audience used it.
The links are all exit-links. I was thinking of a PHP script that does the counting of clicks.
Though this is not the subject of your question, you might want to have a look at Google Analytics then. They are The Master in tracking you. They track right-clicks (even when not actually selecting "open in new window" after that, which they obviously cannot know), which will yield Ajax calls to http://www.google.com/url.
To see Analytics in action: with Adblock and the like disabled, search something on google.com and open up Live HTTP Headers in Firefox (or your Firebug Net tab in Firefox, or WebKit's Resources pane in Safari or Chrome, sorted by time). Next, click, right-click, shift-click or control-click any search result (preferably a result that does not require a lot of HTTP traffic by itself, or is in your browser's cache).
the onclick attribute only gets called when clicking with the left
mousebutton (without pressing ctrl or shift for a new tab or window)
Not entirely true. I created a quick test at JS Bin, to show that modifier keys do not affect the onclick event. (For right-click, one should use the oncontextmenu event.)
What are you doing in your onclick handler that you are worried about not working? e.g. if you have a regular link to a page... and the onclick just opens that same page in a pre-sized popup for user convenience in a web application... then there's likely no issue (e.g. CTRL+Click) still opens the page, it just gets opened in a new tab)
If you are just trying to "log" every click in the site/application for tracking purposes then maybe you can hook into the onmousedown/up or focus/blur events instead/also.

Categories

Resources