I'm trying to write a script in Greasemonkey that will generate link's in a frame, but with my limited Javascript knowledge I don't really know how to do this.
Example of subject:
<html>
<head>
<frameset border="0" frameborder="no" framespacing="0" cols="*,280" rows="*">
<frameset border="0" frameborder="NO" framespacing="0" cols="*" rows="*,200">
<frameset border="0" frameborder="NO" framespacing="0" cols="*" rows="75,*">
<frame scrolling="NO" name="bannerFrame" src="banner.php">
<frame scrolling="auto" name="mainFrame" src="main.php">
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<body class="framemainbg" marginwidth="0" marginheight="0" topmargin="0" leftmargin="0">
<table class="areadescription" cellspacing="0" cellpadding="0" border="0">
<br>
<table>
<tbody>
<tr>
<td>
<p class="personlistcaption">Text:</p>
<p class="listusersrow">
<table>
<tbody>
<tr>
<td valign="top">
<td valign="top">
<b>Text </b>
Text -
Attack
-
<a class="fastattack" onclick="this.href += '&yscroll=' + window.pageYOffset;" href="fight.php?action=attacknpc&checkid=8409099&act_npc_id=764">Quickattack</a>
<br>
Text
</td>
</tr>
</tbody>
</table>
</p>
</td>
</tr>
</tbody>
</table>
<br>
<table>
<form name="formular">
</body>
</html>
</frame>
</frameset>
<frameset border="0" frameborder="NO" framespacing="0" cols="*" rows="*,0">
</frameset>
<frameset border="0" frameborder="NO" framespacing="0" cols="*" rows="*,360">
</frameset>
<noframes><body> Text </body></noframes>
</html>
Example of desired Output :
<html>
<head>
<frameset border="0" frameborder="no" framespacing="0" cols="*,280" rows="*">
<frameset border="0" frameborder="NO" framespacing="0" cols="*" rows="*,200">
<frameset border="0" frameborder="NO" framespacing="0" cols="*" rows="75,*">
<frame scrolling="NO" name="bannerFrame" src="banner.php">
<frame scrolling="auto" name="mainFrame" src="main.php">
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<body class="framemainbg" marginwidth="0" marginheight="0" topmargin="0" leftmargin="0">
<table class="areadescription" cellspacing="0" cellpadding="0" border="0">
<br>
<table>
<tbody>
<tr>
<td>
<p class="personlistcaption">Text:</p>
<p class="listusersrow">
<table>
<tbody>
<tr>
<td valign="top">
<td valign="top">
<b>Text </b>
Text -
Attack
-
<a class="fastattack" onclick="this.href += '&yscroll=' + window.pageYOffset;" href="fight.php?action=attacknpc&checkid=8409099act_npc_id=764">Quickattack</a>
-
Hit
-
Chase
<br>
Text
</td>
</tr>
</tbody>
</table>
</p>
</td>
</tr>
</tbody>
</table>
<br>
<table>
<form name="formular">
</body>
</html>
</frame>
</frameset>
<frameset border="0" frameborder="NO" framespacing="0" cols="*" rows="*,0">
</frameset>
<frameset border="0" frameborder="NO" framespacing="0" cols="*" rows="*,360">
</frameset>
<noframes><body> Text </body></noframes>
</html>
This Links should be generated:
-
Hit
-
Chase
The 'checkid=...' and the 'npc_id=...' must be the same value as in this link:
<a class="fastattack" onclick="this.href += '&yscroll=' + window.pageYOffset;" href="fight.php?action=attacknpc&checkid=8409099act_npc_id=764">Quickattack</a>
OK, this is really just basic HTML DOM manipulation, there's nothing GreaseMonkey-specific here.
First, I'm going to assume that the link you want to copy the URL parameters from is the only one with class="fastattack", since that makes finding it easy:
var link = document.getElementsByClassName( 'fastattack' )[0];
if ( link ) {
// we found the link, do stuff with it...
Next, we need to generate the first new link:
var newlink = document.createElement( 'a' );
...make it point to the URL we want:
newlink.href = link.href.replace( 'action=attacknpc', 'action=slapnpc' );
...and give it the link text we want:
newlink.textContent = 'Hit';
Next, we insert the new link into the DOM just after the original link, like this:
var nextNode = link.nextSibling;
link.parentNode.insertBefore( newlink, nextNode );
Oops, we forgot to insert the delimiter first! No worries, we can still do that:
var delim = document.createTextNode( ' - ' );
link.parentNode.insertBefore( delim, newlink );
Now we can just do the same for the other link:
var newlink2 = document.createElement( 'a' );
newlink2.href = link.href.replace( 'action=attacknpc', 'action=chasenpc' );
newlink2.textContent = 'Chase';
link.parentNode.insertBefore( delim.cloneNode( true ), nextNode );
link.parentNode.insertBefore( newlink2, nextNode );
This time, I remembered to insert the delimiter first. I used the same delim node as above, but I made a copy of it because I wanted to insert another identical delimiter, not move the original delimiter to a new position in the DOM.
Finally, we need to close the if block, and that's it:
}
(Disclaimer: I have not actually tested the code above. I think it should work, but there might be bugs or typos that I've missed.)
Edit: Changed the code to insert the new links just after the original, rather than at the end of the parent paragraph.
Addendum:
If you have multiple links with class="fastattack" in the document, and wish to apply the code above to each of them, you can do that by replacing the first two lines above with a loop over all the links, instead of just the first one:
var links = document.getElementsByClassName( 'fastattack' );
for ( var i = 0; i < links.length; i++ ) {
var link = links[i];
// now do stuff with link just like above
Related
We have A Framed Application. In one of the process, when the page is submitted, we show a busy image until the response is received as the process might take 1+ minute.
In IE11, the Application keeps on loading and never shows the result. But it works fine in Chrome, Firefox and IE Compatibility mode. Please see below for the code.
var myTop = form_input();
if (typeof isaTop == 'function' && isaTop().header) {
isaTop().header.busy(parent.form_input)
}
myTop.location.href = request;
function busy(frameObject) {
try {
with(frameObject.document){
// get all the stylesheets from the header
var allStylesheets = this.window.document.styleSheets;
writeln("<html><head>");
// add the css sheets
for(var i = 0; i < allStylesheets.length; i++) {
writeln('<link type="text/css" rel="stylesheet" href="' + allStylesheets[i].href + '" />\n');
}
// add the rest
writeln("</head>\n<body><div id='busy'>\n" +
"<img src='<%=WebUtil.getMimeURL(pageContext, "b2b/mimes/images/busy.gif") %>' alt='<isa:UCtranslate key="b2b.busy.message"/>' />" +
"<p><isa:UCtranslate key="b2b.busy.message"/></p>" +
"</div></body></html>");
}
frameObject.document.close();
}
catch (e) {}
}
<frameset cols="*,15,0" id="fourthFS" border="0" frameborder="0" framespacing="0">
<!--End of edit by Arshid to hide the history frame from startup of application-->
<frameset rows="0,*" id="workFS" border="0" frameborder="0" framespacing="0">
<frame name="documents" src="<isa:webappsURL name="/b2b/updateworkareanav.do" />" frameborder="0" scrolling="no" marginwidth="0" marginheight="0" />
<frame name="form_input" src="<isa:webappsURL name="/b2b/updatedocumentview.do?refresh=1" />" frameborder="0" scrolling="auto" marginwidth="0" marginheight="0" title="<isa:translate key="b2b.frame.jsp.forminput"/>" />
</frameset>
<frame name="closer_history" src="<isa:webappsURL name="/b2b/closer_history.jsp" />" frameborder="0" scrolling="no" marginwidth="0" marginheight="0" title="<isa:translate key="b2b.frame.jsp.closerhistory"/>" />
<frame name="_history" src="<isa:webappsURL name="/b2b/history/updatehistory.do" />" frameborder="0" scrolling="auto" marginwidth="0" marginheight="0" title="<isa:translate key="b2b.frame.jsp.history"/>" />
<noframes>
<p> </p>
</noframes>
</frameset>
We tried enabling IE Compatibilty mode by putting following code but we are not able to fix the issue.
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta charset="utf-8">
Can some one please give us any clues or help?
Thanks,
Srinivas
enter code here
I want to load the content of this page in the right frame, how do i specify this?
<html>
<head>
<script type="text/javascript">
function LoadInCenter(doc1)
{
parent.right_bottom.location.href = doc1
}
</script>
</head>
<body align="center">
test
</body>
</html>
This is a page with frames which I have created, the left-bar as the navigation pane and the right as the place to display the content. When a user clicks on any of the links on the left it should display it in the middle. How do I achieve this?
<?php
?>
<!DOCTYPE html>
<html>
<frameset rows="15%,75%">
<frame src="loggedin.php">
<frameset cols="15%,75%">
<frameset rows="5%,5%,5%,5%,*">
<frame src="myprofile.html" noresize="noresize" scrolling="no" marginwidth="5" marginheight="5" name="myprofile">
<frame src="mycompany.html" noresize="noresize" scrolling="no" marginwidth="5" marginheight="5" border="0" name="mycompany">
<frame src="myproduct.html" noresize="noresize" scrolling="no" marginwidth="5" marginheight="5" border="0" name="myproduct">
<frame src="market.html" noresize="noresize" scrolling="no" marginwidth="5" marginheight="5" border="0" name="market">
<frame src="">
</frameset>
</frameset>
</frameset>
</html>
This is the answer to the question posted above. What I wanted to achieve has been stated. This is to split the frameset into header, side-bar and content area.
The header is to display logo and others things that as pertaining to the company. This line of code achieves that:
<frame src="loggedin.php">
The sidebar is to serve as the navigation link, when any of these links is clicked the content should be displayed in the content-area. This line of codes achieve that:
<frameset rows="5%,5%,5%,5%,*">
<frame src="myprofile.html" noresize="noresize" scrolling="no" marginwidth="5" marginheight="5" name="myprofile">
<frame src="mycompany.html" noresize="noresize" scrolling="no" marginwidth="5" marginheight="5" border="0" name="mycompany">
<frame src="myproduct.html" noresize="noresize" scrolling="no" marginwidth="5" marginheight="5" border="0" name="myproduct">
<frame src="market.html" noresize="noresize" scrolling="no" marginwidth="5" marginheight="5" border="0" name="market">
<frame src="" >
</frameset>
The last part is the content area which occupies the the rest of the page. This is displayed by this line of code:
<frame src="empty.html" noresize="noresize" marginwidth="5" marginheight="5" name="centerpage">
So, this is the full code. Anyone can copy and paste to see the output.
<!DOCTYPE html>
<html>
<frameset rows="15%,75%">
<frame src="loggedin.php">
<frameset cols="15%,75%">
<frameset rows="5%,5%,5%,5%,*">
<frame src="myprofile.html" noresize="noresize" scrolling="no" marginwidth="5" marginheight="5" name="myprofile">
<frame src="mycompany.html" noresize="noresize" scrolling="no" marginwidth="5" marginheight="5" border="0" name="mycompany">
<frame src="myproduct.html" noresize="noresize" scrolling="no" marginwidth="5" marginheight="5" border="0" name="myproduct">
<frame src="market.html" noresize="noresize" scrolling="no" marginwidth="5" marginheight="5" border="0" name="market">
<frame src="" >
</frameset>
<frame src="empty.html" noresize="noresize" marginwidth="5" marginheight="5" name="centerpage">
</frameset>
</frameset>
</html>
I have a page that has two frames side by side.
<HTML>
<HEAD>
..various scripts..
</HEAD>
<FRAMESET framespacing="0" border="2" rows="93,*,0" frameborder=0>
<FRAME scrolling=no noresize SRC="title_new_2.asp" NAME=titleFrm id=titleFrm>
<FRAMESET framespacing="5" border="5" cols="51%,*" name="cjSet" id="cjSet" frameborder=1>
<FRAME SRC="../project/search/project_search.aspx" NAME=left scrolling="auto" frameborder=0>
<FRAME SRC="dashboard.aspx?demo=n" NAME=right scrolling="auto" frameborder=0>
</FRAMESET>
<FRAME src="blank.htm" border=0 noresize frameborder=0 scrolling=no framespacing=0 NAME=tcj>
</FRAMESET>
</HTML>
I'm trying to get some data that's contained in the frame name=left with the project_search.aspx URL. I've tried both of the below and neither seem to work.
/html/frameset/frameset/frame
//*[#id="cjSet"]/frame[1]
Any pointers would be of great help.
I'm trying to display in a WebView several html files in one html using iframes
I'm using the following script in the html file in order to resize the height of iframes in the current html.
<body onload="resizeFrames()" link="#bb7722" vlink="#bb7722" alink="#bb7722" >
<script type="text/javascript">
// Firefox worked fine. Internet Explorer shows scrollbar because of frameborder
function resizeFrames() {
var all_IFrames = document.getElementsByTagName('iframe');
i = 0;
while (frame = all_IFrames.item(i++)) {
resizeFrame(frame);
}
}
function resizeFrame(f) {
f.style.height = f.contentWindow.document.body.scrollHeight + "px";
}
</script>
<iframe width="100%" scrolling="no" frameborder=0 border=0 src="b.html"></iframe>
<iframe width="100%" scrolling="no" frameborder=0 border=0 src="c.html"></iframe>
In order the javascript to work I use the foloowing code:
WebSettings webSettings = wb.getSettings();
webSettings.setJavaScriptEnabled(true);
I load the html file like this:
webView.loadUrl("file:///android_asset/a.html");
The problem is that the size of the resized iframes is sometimes too big and somtimes too small.
I tested it on galaxy s with android 2.2 and all the frames were smaller (cut off in the end) and in an other device with android 4.0.4, all the frames were bigger (adding empty space)
If I remove the webSettings.setJavaScriptEnabled(true); the problem in galaxy s disappears, but in the second device, the frames don't resize at all
full html code:
<!DOCTYPE html>
<html>
<head>
<style>
body{
color: #aa6611;
font-size:20px;
}
.link {
font-weight: bold;
color: #bb7722;
}
</style>
</head>
<body onload="resizeFrames()" link="#bb7722" vlink="#bb7722" alink="#bb7722" >
<script type="text/javascript">
// Firefox worked fine. Internet Explorer shows scrollbar because of frameborder
function resizeFrames() {
var all_IFrames = document.getElementsByTagName('iframe');
i = 0;
while (frame = all_IFrames.item(i++)) {
resizeFrame(frame);
}
}
function resizeFrame(f) {
f.style.height = f.contentWindow.document.body.scrollHeight + "px";
}
</script>
<a name="top"></a>
<font size = "6" color="#ffaa55">Guide</font>
<br />
<br />
<a href="#mainscreen" class="link" >Main screen</a> <br />
Inventory <br />
Store <br />
Market <br />
Creature Attack Dialog <br />
User Attack Dialog <br />
Mini Attack Dialog <br />
Profile <br />
Creature info <br />
User info <br />
Item info <br />
Last Attackers <br />
Achievements History <br />
Achievement info <br />
Options <br />
<br />
<p>
<a name="mainscreen"></a>
<iframe width="100%" scrolling="no" frameborder=0 border=0 src="mainscreen.html"></iframe>
</p>
Back <br />
<p>
<a name="inventory"></a>
<iframe width="100%" scrolling="no" frameborder=0 border=0 src="inventory.html"></iframe>
</p>
Back <br />
<p>
<a name="store"></a>
<iframe width="100%" scrolling="no" frameborder=0 border=0 src="store.html"></iframe>
</p>
Back <br />
<p>
<a name="market"></a>
<iframe width="100%" scrolling="no" frameborder=0 border=0 src="market.html"></iframe>
</p>
Back <br />
<p>
<a name="creatureattackdialog"></a>
<iframe width="100%" scrolling="no" frameborder=0 border=0 src="attackDialogCreature.html"></iframe>
</p>
Back <br />
<p>
<a name="userattackdialog"></a>
<iframe width="100%" scrolling="no" frameborder=0 border=0 src="attackDialogUser.html"></iframe>
</p>
Back <br />
<p>
<a name="miniattackdialog"></a>
<iframe width="100%" scrolling="no" frameborder=0 border=0 src="miniattackdialog.html"></iframe>
</p>
Back <br />
<p>
<a name="profile"></a>
<iframe width="100%" scrolling="no" frameborder=0 border=0 src="profile.html"></iframe>
</p>
Back <br />
<p>
<a name="creatureinfo"></a>
<iframe width="100%" scrolling="no" frameborder=0 border=0 src="creatureInfo.html"></iframe>
</p>
Back <br />
<p>
<a name="userinfo"></a>
<iframe width="100%" scrolling="no" frameborder=0 border=0 src="userInfo.html"></iframe>
</p>
Back <br />
<p>
<a name="iteminfo"></a>
<iframe width="100%" scrolling="no" frameborder=0 border=0 src="itemInfo.html"></iframe>
</p>
Back <br />
<p>
<a name="lastattackers"></a>
<iframe width="100%" scrolling="no" frameborder=0 border=0 src="lastattackers.html"></iframe>
</p>
Back <br />
<p>
<a name="achievementshistory"></a>
<iframe width="100%" scrolling="no" frameborder=0 border=0 src="acheivementhistory.html"></iframe>
</p>
Back <br />
<p>
<a name="achievementsDialog"></a>
<iframe width="100%" scrolling="no" frameborder=0 border=0 src="acheivementDialog.html"></iframe>
</p>
Back <br />
<p>
<a name="options"></a>
<iframe width="100%" scrolling="no" frameborder=0 border=0 src="optionsDialog.html"></iframe>
</p>
Back <br />
</body>
</html>
You need set listeners for the onload handlers in iframe tags, one for each and resize each one when the iframe not the body was loaded.
var iframe = document.getElementById('yourIF');
var iframeWin = iframe.contentWindow || iframe.contentDocument.parentWindow;
iframe.style.height = (iframeWin.document.documentElement.scrollHeight || iframeWin.document.body.scrollHeight) + "px";
I want to add a backgound page for my Jsp page, In this i used a frameset when i used a backgound image for a main frameset its showing problem in FF and IE,
Code Is:
<frameset cols="*,1020px,*" border="0" class="bg" style="images/background.jpg">
<frame src="about:blank" />
<!-- Next frameset is centered horizontally and have width:1020px -->
<!-- Tested in IE8,Chrome13,Opera11.50,Safari5,FF7 -->
<frameset rows="8%,*" border="0" >
<frame src="HeaderUi.jsp" name="header" scrolling="no" style="border-bottom:5px solid #630000;" />
<frameset cols="220px,540px,*" border="0" style="background:#000">
<frame src="webSearchUi" name="search" />
<frameset rows="65%,*" border="0" >
<frame src="webMainPageUi" name="mainPage" scrolling="yes" style="border:1px dotted #7D7D7D; border-top:0px; border-bottom:0px dashed #5c5c5c" /> <frame src="webEventPanelUi" name="eventPanel" style="border:1px dotted #7D7D7D; border-top:1px solid #7D7D7D; border-bottom:0px dashed #5c5c5c" /> </frameset>
<frame src="webDataPanelUi" name="dataPanel" style="border-style:solid;border-width:0pt;border-color:66CC33">
</frameset>
<frame src="about:blank" class="Bg" />
</frameset>
</frameset>
<frame src="about:blank" /> </frameset>
In This Code i want to use a background-image.
Thanks in Advance
Mayur Mate
If you are going to use attribute style you should write there css styles in the following way:
style="property1: value1; property2: value2"
in your case the code should be:
<frameset cols="*,1020px,*" border="0" class="bg" style="background: url('images/background.jpg');">