How do I block the right mouse button click on top of the iframe, I tried to use the oncontextmenu="return false" in the iframe tag but it didn't work, in my case I want to change the right button on top of the pdf that I do this being a example inside the iframe, here is an example inside my code:
<html>
<head>
<title>block the right mouse</title>
</head>
<body >
<iframe oncontextmenu="return false" id="iframepdf" src="http://infolab.stanford.edu/pub/papers/google.pdf#toolbar=0" width="500px" height="600px" type="application/pdf"></iframe>
</body>
This is a complete code to disable the right click
<html>
<head>
<title>Disable Context Menu</title>
<script type="text/jscript">
function disableContextMenu()
{
window.frames["fraDisabled"].document.oncontextmenu = function()
{
alert("No way!");
return false;
};
}
</script>
</head>
<body bgcolor="#FFFFFF" onload="disableContextMenu();" oncontextmenu="return
false">
<iframe id="fraDisabled" width="528" height="473" src="local_file.html"
onload="disableContextMenu();" onMyLoad="disableContextMenu();">
</iframe>
</body>
</html>
I Hope this is useful....
By design an IFrame hands over the context to the users system thus you have very little control since the whole point is that it is for the users benefit.
Related
I'm struck in a project, I need to develop a project as agenty chrome extension, where it uses point and click css selector. First I have used iframe to display a site but I faced cross origin and security issues. Now I'm using object tag to display a site and I want to make like point and click css selector on a button click.
Here is my sample code
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script type="text/javascript">
$(function () {
$('#dragit').click(function(){
// make $("#dvSource") to point and click css selector
});
});
</script>
</head>
<body>
<input type="submit" id="dragit" value="DragValues" />
<div id="dvSource">
<object type="text/html" data="http://validator.w3.org/" width="100%" height="600px" id="test">
</object>
</div>
</body>
</html>
I have placed in div (dvSource) and I have a button with id dragit, once I click that button I want to make point and click css selector for dvSource content
I have 2 iframes on top of each other, 1st is foreground, that user interacts with, and 2nd is background, that is visible only while 1st one is loading. 2nd is unclickable and also the same as 1st, it's there just to fix blinking while the main iframe is loading. My code:
testing here: https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_script
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<style>
iframe.invisible {
display: none;
}
iframe.unclickable {
pointer-events: none;
}
</style>
<script>
$(document).ready(function()
{
$('#iframeID1').on('load', function()
{
$('#iframeID1').contents().find('a[href!="javascript:void(0)"]').filter('a[target!="_blank"]').filter('a[target!="_top"]').filter('a[target!="_parent"]').on('click', function()
{
$('#iframeID1').addClass('invisible');
$('#iframeID2').removeClass('invisible');
});
$('#iframeID1').removeClass('invisible');
$('#iframeID2').addClass('invisible');
$('#iframeID2').contents().find('html').html($('#iframeID1').contents().find('html').html());
});
});
</script>
</head>
<body>
<iframe id="iframeID1" height="800px" width="800px" seamless="seamless" scrolling="yes" src="https://www.w3schools.com/" frameborder="0" class="invisible"></iframe>
<iframe id="iframeID2" height="800px" width="800px" seamless="seamless" scrolling="yes" frameborder="0"class="invisible unclickable" ></iframe>
</body>
</html>
Right now, when I click any link on iframeID1 (foreground), iframeID2 becomes visible, however I see only pure html, no CSS. I think it's because I'm copying only html, how should I be copying css too?
Notice, that iframeID2 does not have src. If I add the same src as iframeID1, it works for a while, until user navigates to different site.
I have an HTA, which in turn has an Iframe. We are loading an intranet website. A button in the HTA, when clicked, will automate some task. The first step is to login, wait for the next page to load, then perform next option. The main concern here is to know that the next page has been loaded completely, so that we can initiate the code related to page ?
Can some one shed light on how to achieve this. Just to repeat, IFrame is inside HTA.
Below is my code :
<html>
<head>
<HTA:APPLICATION
APPLICATIONNAME="HTA"
SYSMENU="YES"
NAVIGABLE="YES"
>
<meta http-equiv="x-ua-compatible" content="ie=11">
<title>HTA</title>
<script type="text/javascript">
window.resizeTo(900,700);
</script>
<script type="text/javascript" >
function Start() {
var iframePage = document.getElementById("iframeid").contentDocument;
var userId = iframePage.getElementById("userid");
var passwd = iframePage.getElementById("pwd");
var form = iframePage.getElementById("login");
userId.value='aa';
passwd.value='bb';
form.submit();
var iframePages = document.getElementById("iframeid").contentDocument;
var targetContent = iframePages.getElementById ("ptifrmtgtframe").contentDocument;
var runcntl = targetContent.getElementById("PRCSRUNCNTL_RUN_CNTL_ID");
runcntl.value='test';
}
function Show() {
document.getElementById("iframe").style.display = "block";
}
</script>
</head>
<body>
<form class="form" name="form">
<input class="links" type="button" value="Show PIA" onclick="Show();" />
<input class="links" type="button" value="Login" onclick="Start();" />
</form>
<br>
<div class="iframe" id="iframe" style="display:none">
<iframe application="no" src="my URL" width="600" height="600" id="iframeid">
</div>
</body>
</html>
I want that:
var runcntl = targetContent.getElementById("PRCSRUNCNTL_RUN_CNTL_ID");
runcntl.value='test';
Should run, only after the page in the IFrame has loaded properly and completely, since only then the relevant feilds will be loaded. Or else, this will give error.
PS This is a PeopleSoft site.
Here is a simple example of calling code when the iframe has loaded. Check out the onload attribute of the iframe tag. Maybe you can integrate this into your HTA?
<head>
<script>
function frameLoaded() {
alert('frame loaded!');
};
</script>
</head>
<body>
<iframe id="frame" src="https://en.wikipedia.org/wiki/HTML_element#Frames" onload="frameLoaded(this)" />
</body>
If you have access to the page, use javascript inter-window communication to trigger the JS you need. The child iframe can tell the parent when to run java script.
From a pure PeopleSoft perspective you can use related action framework component events to do what you like, too, without customization.
I think you can check the code for related content as reference. Such as OpenRCService and onRCService. In PT_COMMON, the showModalDialog method also related to the RC function which have the logic to detect a iframe is loaded.
I have two files, named main_page.html and dialog_box.html (see code below).
I want my handleCloseDialogButton() to "close the dialog box", in other words to reload main_page.html, with theFrame.style.display reset to "none".
How can I do this ? Should I use window.open("main_page.html") or window.location.href="main_page.html" or something else ?
Note: I do not want to use Javascript’s alert() function because its capabilities are not sufficient for what I need.
Contents of main_page.html :
<!DOCTYPE html>
<html>
<meta charset="UTF-8">
<head>
<script>
function handleDialogButton()
{
var theFrame=document.getElementById("myDialogBox");
theFrame.style.display="block";
theFrame;
}
</script>
</head>
<body>
<div id="myDiv"> <h2> Hello world. This is the main page.</h2></div>
<iframe id="myDialogBox" src="./dialog_box.html" style="display:none"> </iframe>
<input type="button" id="dbbutton" name="dbbutton" value="Open Dialog Box"
onClick="javascript:handleDialogButton();" />
</body>
</html>
Contents of dialog_box.html :
<!DOCTYPE html>
<html>
<meta charset="UTF-8">
<head>
<script>
function handleCloseDialogButton()
{
}
</script>
</head>
<body>
<div id="myDiv"> <h2> Hello world. I am the dialog box.</h2></div>
<input type="button" id="cbbutton" name="cbbutton" value="Close Dialog Box"
onClick="javascript:handleCloseDialogButton();" />
</body>
</html>
You can access parent elements from iframe by using window.parent.
See window.parent for details.
With window.parent you can either call parent js function or you can access parent element. Accessing parent element in your case should look like: window.parent.document.getElementById('myDialogBox');
Use this in your handleCloseDialogButton function and set its display to none:
function handleCloseDialogButton()
{
window.parent.document.getElementById('myDialogBox').style.display="none";
}
NOTE: This will not work in file mode in Chrome. You have to put your pages on web server, and than it will work in Chrome browser too.
I'm trying to change the location of an adjacent frame on page load with Javascript.
I have a page with a frameset:
<html lang="en">
<HEAD>
<link rel="icon" type="image/x-icon" href="favicon.ico" />
<script type="text/javascript">
function confirm() {
//Code to execute before page close
return '[close message]';
}
window.onbeforeunload=confirm;
</script>
<frameset cols="30%, 70%" FRAMEBORDER=NO FRAMESPACING=0 BORDER=0>
<frame name="leftFrame" src="control.php" scrolling="no">
<frame name="right" id="right" src="q.php">
</frameset>
</head>
</html>
My leftFrame is control.php, which has a form whose action is also control.php:
<!-- sample form on control.php -->
<form method="post" action="control.php">
<input ../>
<input type="submit" />
</form>
The idea is that every time the form is submitted, the right frame is supposed to reload back to q.php:
<script language="javascript">
function refresh() {
parent.right.location.href ="q.php";
}
</script>
</head>
<body onLoad="refresh();">
But this is not working. The right frame stays as is and doesn't change back to q.php. in other words refresh() isn't working.
Can anyone tell me what I'm doing wrong, or a better way to do this?
instead of onload i used onsubmit. my guess is that it wasn't working onload because the page was already loaded.
havent seen frames used in a long time,
i think the issue is the way you are calling the frame, try
top.frames["right"].location.href="q.php";