Detect if page is zoomed - javascript

Is there any way to know, at a given moment, if the page is currently zoomed-in?
I don't need to know the zoom level, and I don't need to catch the event: I simply need a cross browser solution that allows to know if the page is zoomed or not (e.g. a function that returns true or false). Unfortunately the solutions that I have found are completely outdated or work only on some browsers.
I need that in order to block gesture detection while the page is zoomed.

Related

Is there a way to disable hardware acceleration in one tab using google chrome?

I am trying to prevent a webpage that is not under my control from creating a webgl context. It creates a canvas to do so. I know that disabling hardware acceleration will prevent it, but I do not want to be able to use hardware acceleration for HDR content on YouTube. Is there a way I can disable it on a page using JavaScript? If so, I may be able to create an extension. I have tried injecting an onload event handler using a chrome extension (which did not work). I was attempting to delete a canvas element as soon as it was created.
Is there any way to achieve this using chrome? Is there a way I could do this using an extension? Is it possible to prevent hardware acceleration from being used on a webpage using JavaScript?
If this is not a good question, please let me know and I will either edit it or remove it.
It appears that there is no way to disable hardware acceleration on a tab basis. The javascript route did not prove to be fruitful as it does not appear that you can trick a page into thinking that hardware acceleration is disabled (at least at page load where most pages would check).

Tapping Status Bar in MobileSafari does not work on my test page

I am trying to debug this and can't make any headway. I've got this HTML5 JavaScript library I am building and the test page for it can contain large volumes of output as I am piping console.log and exceptions out into the DOM to quickly inspect them on mobile devices (it is the only way I know of inspecting state on an Android device for instance)
Here is the page. So long as I don't push up broken code while I work on this you should be able to produce plenty of debug output which will be pumped into the <body> thus allowing the page to scroll. Note also to toggle the visibility of the big blue debug panel you can tap the header text at the top of the page (like a button).
The issue is specific to iOS: Tapping the iOS status bar does not work in either portrait or landscape modes, and I am not sure what it is I have done with JS or otherwise that has disabled this quite handy feature.
Use of -webkit-overflow-scrolling: touch appears to be the culprit for iOS6 here. It actually looks like iOS5 is less broken w.r.t. this issue.
I think there may be a way to work around the issue by dynamically setting -webkit-overflow-scrolling: touch on the elements that need it by catching touch events on them. Or just leave it off as they still remain usable (just have no momentum).

Capturing mouse position outside of browser window?

One major barrier to creating immersive experiences in the browser (using WebGL and similar) is the set of limitations placed on mouse control.
For instance a first person shooter control scheme essentially requires the program to grab the mouse and re-center it so as to allow infinite movement in any direction for the cursor. This is a no-no because it would give the web programmer too much control. Hopefully one day we will see a plugin that allows a site to request permission to move the mouse to allow this behavior.
However I think there are some ways to improve things without going that far. I am wondering if it's possible to allow access to the mouse position once the mouse moves off of the window (focus is still on window)?
I was playing this game using Google Chrome: http://www.chromeexperiments.com/detail/x-wing/?f=
and my biggest issue was that to get to a corner, I have to carefully keep my mouse on the corner of the browser window. If I push it off the window my ship would stay where the mouse's last window position was, which is not exactly in the corner. And I would crash into the wall.
To make this better, the browser should be able to receive mouse updates when the mouse is outside of the window. In the context of this type of game if the mouse leaves the window it should continue to send updated positions to the browser.
Is there any provision for this?
To answer your question, no, you can't get mouse events from outside the window (including its position).
There is the Mouse Lock API, which is designed specifically for the case you describe. It locks the cursor to the current window. Support is virtually non-existent right now, but one day..!
A hint :
function thumb_mouse_down(e) {
e.target.setCapture();
return false;
}
function doc_mouse_up(e) {
e.target.releaseCapture();
}
setCapture() does the trick. A working example is here.
That really seems like a far bigger security issue than allowing the developer to reposition the cursor. The answer is no, there's no such thing. And there probably won't ever be one. Sorry!
Update: I was, of course, talking about the capturing outside the window that would be a problem. It's very likely that there will ever be an API that locks the mouse, maybe after asking the user's permission. As nickf pointed out, they're already working on it -https://www.w3.org/TR/pointerlock/
Original defunct link - http://dvcs.w3.org/hg/webevents/raw-file/default/mouse-lock.html

jQuery resize and position current browser window

How can I set height, width and set the position of the current browser window in the document.ready() function of jQuery ?
There supposed to be two javascript functions to resize and move the browser window:
window.resizeTo(width, height);
window.moveTo(x, y);
These functions are not supported by Chrome and Opera, and other browsers might experience certain security restrictions as well.
If you want to pop a new window with a certain size, check out the parameters of window.open(). Your interface should also not rely on it entirely, for example you won't be able to do it on mobile browsers.
When thinking about if something is possible or not it's always a good start to think about ways to abuse it. Would you want windows on your screen to jump around every 100 milliseconds, just because some website wants to do that? Probably that's why it's unsupported or limited these days.

div or iframe over an applet

I want to create a custom video control, I mean over the video itself, with issues like double click on some x and y coordinates of the video to zoom In, but I can't get this result because the real player plugin API is not that flexible, then I Tried to create a transparent layer to handle those events and I can't achieve that the transparent layer sits on top of the video, I tried this list:
1.- Put a flash transparent movie over the real player plugin- not working the player breaks the z-Index and the video goes to the top.
2.- Put an Iframe transparent over the real player plugin- not working it puts on top, but when I make the Iframe transparent, the movie goes agains to the top.
3.- I tried to use the map html tag, also is not working.
4.-I tried to put and div absolute positioned, but z-index is not working.
I need some help with this topic.
thanks guys
There is no reliable way to force a browser to layer content on top of a plugin, because plugins like Flash just talk to the video/audio system rather directly and just paint in the bounding box the browser tells them to.
Obviously it's still experimental, and there's no IE support (without ChromeFrame), but was designed to solve exactly this problem.
If this was Flash you could use wmode=opaque or wmode=transparent as an alternative to the default wmode=windowed, which is much faster but causes problems with overlays like you describe. I've found no sign of an equivalent option for real player.
http://javafx.com/ would be my recommendation
I would avoid trying to mash several different technologies together to get what you want, It will make for a maintenance nightmare between different browsers and browser upgrades.
I think this is what you search for:
http://www.dynamicdrive.com/forums/showpost.php?s=4cc8a233f39321ad1ee9e01ec57a3bef&p=200817&postcount=10
You need the wmode = opaque to get the layer over the flash.
a place where you can find this working is, www.dtele.de .
If you open the navigation, you´ll see, tha it lays over the flash movie.

Categories

Resources