How can create an iframe breaking script which shows a alert box if the page is loaded in an iframe and when the alert box is clicked, it should break the frame and the script should be seen.
if (top != window) {
alert("please don't load my in a frame, thx.");
top.location.href = location.href;
}
might do the trick.
Related
Scenario:
In my application, content in Iframe is loading from server side and entire markup comes from the backend. There is navigation menu buttons in the main html page and Skip to main content link. Role for the iframe body is given as "application"(also tried with document). When Skip to main content is removed, the JAWS read the iframe content as expected, but as soon as "Skip to main content" section is enabled, JAWS reads just the first line inside iframe. What aria role or property I should add, such that when focus is moved from "skip to main content" to iframe, JAWS should start reading the entire content inside iframe?
Sample code used to move focus inside iframe:
window.skipNav = function(event) {
switch(event.type)
{
case "keydown":
if (event && event.keyCode == 13) {
setTimeout(setFocusIframe, 100);
}
break;
case "click":
setTimeout(setFocusIframe, 100);
break;
default:
break;
}
}
function setFocusIframe() {
this.iframe[0].contentWindow.document.body.focus()
// var f = jQuery("iframe:first")
// if(f.length > 0) {
// //f[0].contentWindow.document.body.focus();
// f[0].contentWindow.focus();
// console.log("skipNav-------------------------------------------------------->>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>");
// }
}
Try to check if document.activeElement returns the element you are trying to focus on.
Sometimes jQuery .focus() fucntion dont do what you expect.
After a postback, I want my page to have focus on a child control of a gridview, but scroll the page to a different part.
the standard myGridView.Focus(), called on the Page_Load or Page_prerender, insert a
WebForm_AutoFocus('myGridViewClientID');
in the rendered html.
This function move also the scroll not to the required position
Any suggestion?
my try: use some function injected by Asp.NET:
function FocusWithoutScroll(focusId) {
var targetControl;
if (__nonMSDOMBrowser) {
targetControl = document.getElementById(focusId);
}
else {
targetControl = document.all[focusId];
}
var focused = targetControl;
if (targetControl && (!WebForm_CanFocus(targetControl))) {
focused = WebForm_FindFirstFocusableChild(targetControl);
}
if (focused) {
try {
focused.focus();
}
catch (e) {
}
}
}
but in order to use this code, I have to include some .axd resource files: it seems ASP.NET automatically include them when you set
someControl.Focus();
in your server side code. but this in turn insert the
WebForm_AutoFocus('myGridViewClientID');
which scroll the page to the wrong position
There's a client-side method scrollIntoView that scrolls page till the element is visible. You can issue server-side command:
ClientScript.RegisterStartupScript(this.GetType(), "MyScript","document.getElementById('SecondElementID').scrollIntoView();", true);
Where 'SecondElementID' is id of the element you want to scroll to.
Demo: http://jsfiddle.net/v8455c79/ this demo shows how focus can be set on one element and page scrolled to another
Using MVC 4 I add a blank window and hide it. On a button click I call this javascript to get content and center the window:
var win = $("#myWindow").data("kendoWindow");
win.content("Loading...");
win.refresh({
url: "#Url.Action("MyAction", "MyController")",
data: { userloginid: "AAA" }
});
win.center();
win.open();
The content is larger than a default window so the win.center() calculation is off, putting the window too far down.
How do I get the window to center based on the content it got via the refresh() command.
The problem seems to be, that you center the window, and than, some time after that, the new content is finished loading.
In other words: The center is called before the window get's its new size through the loaded content.
To prevent this, you should bind to the refresh event of the window, and center in that.
Something along the lines (beware: only register this event once):
var win = $("#myWindow").data("kendoWindow");
win.bind("refresh", function() {
win.center();
win.open();
});
How to catch click on an iframe using JQuery. I have an Amazon banner, and I need to close its container DIV when the user clicks the iframe. I've tried 'contents', onclick on iframe, binding the event but nothing works. When I click the iframe it opens Amazon's page on another tab, but the click event never fires. I put a breakpoint and alert just to make sure.
I am using latest JQuery version 1.9 and tested it on Chrome. I also thought about capturing a global click ($(document).click) and check the area of the click, but when I click the iframe, $(document).click doesn't fire. Any suggestions?
Again, it's an Amazon banner iframe, it's hosted on Amazon not on my server.
Example of the regular on binding that doesn't work: http://jsbin.com/oyanis/4/edit
There is a neat trick to get a "click" on on iframe content.
You could do:
<div id="iframeinside">
<iframe />
</div>
This now makes it possible to say in js something like:
var oldActive = document.activeElement; /* getting active Element */
var frame = $('#iframeinside iframe')[0];
$('#iframeinside').mouseenter(function() {
/* Setting interval to 1ms for getting eventually x,y mouse coords*/
oldActive = document.activeElement;
setInterval('doSomething()', 1);
});
$('#iframeinside').mouseleave(function () {
/* clear interval cause we arent over the element anymore*/
clearInterval(intervalId);
});
These intervals do call:
function doSomething() {
/* if the focus has changed to the iframe */
if(oldActive != frame && document.activeElement == frame) {
oldActive = document.activeElement;
alert(myQuery);
alert('click did happen to the iframe');
}
}
I used this for several things and it always worked. What i didnt check was how about ie6,7 and older brothers.
I have a page which work like a navigation and a iframe in this page which show the content.
Now there are some situation when the inner page is directly shown in the browser.
eg: if somebody types the inner page's url in the browser address bar, the page is displayed in the window.
I want to prevent this.
Better still, I would like to redirect to any other page.
window.parent: The window object that contains the frame. If the the window is the top level window then window.parent refers the window itself. (It is never null.)
window.top: The top level window object, even if the current window is the top level window object.
window.self: The current window object. (It is a synonym of window.)
So, I'd write my check like this:
if (window.top == window.self) {
window.location = "index.html";
}
Which would be identical to the slightly more ambiguous:
if (window.top == window) {
window.location = "index.html";
}
<script language="Javascript"><!--
if (top.location == self.location) {
top.location = "index.html" // must be viewed in main index
}
//--></script>
modified it from a situation where an an iframe decides to become the main frame.