Say I have 3 frames in a frameset arranged in 3 rows. Frames 1 and 3 are from my site and frame 2 (the central one) is from an external website. Is there a cunning way to force the browser to centre align the data in frame 2?
I've found a small work-around which uses a frameset within a frameset which has 2 blank columns either side of the data but that means the scrollbars from frames 2 and 3 are out of alignment.
Any ideas?
Edit : The code I have currently is :
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server" />
<frameset rows="10%,65%,25%" border=0 frameborder="no">
<frame name="nav" noresize scrolling="no" src='NavigationBar.aspx?NAVIGATION=<%=sDisplayNavigation %>'>
<frameset cols="1*,1010px,1*">
<frame name="lspace" scrolling="no" src="border.htm">
<frame name= "main" scrolling="auto" src='<%=sMainTextURL%>#highlight'>
<frame name="rspace" scrolling="no" src="border.htm">
</frameset>
<frame name="suggest" scrolling="yes" noresize src='<%=sSuggestURL%>'>
</frameset>
</html>
I think what you are looking for is a way to inject some CSS into the other frame, even though it comes from another site.
I think this will not be possible without a server side script to request the page and modify it.
Javascript has ways to modify other frames using window.frames[] and using DOM traversal just like for elements in the local frame. This will be problematic for you because of the "same-origin policy". This basically means that javascript in a frame loaded from example.com can not access the DOM in a frame loaded from foo.com. Even if you have similar domains, foo.example.com and bar.example.com, they are treated as separate domains in the browser so your javascript from one is not allowed to access the other.
This affects ajax calls using XMLHttpRequest as well. There are ways of reducing the impact of this, but I think you need to be able to run javascript on both sides of the line.
I recently tried something similar to what you are doing, where I wanted to embed one site in another, but the same-origin policy made it impractical.
The other way to do this is server-side instead of client-side. Create a php script which requests content from the other server on behalf of the client, and then serves it as if it was on your server all along. Then your javascript, now on the same server, can do what it will with that frame. If the other site uses a lot of cookies or ajax, this could be tricky, but your php won't have a same-origin policy to deal with.
If you use an absolute value rather than a percentile to define the size of a frame in conjunction with other frames using percentiles the frame with an absolute value will not resize with the browser window and the other frames/divs will.
<frameset rows="10%,65,25%" border=0 frameborder="no">
OR
<frameset rows="10%,65px,25%" border=0 frameborder="no">
The first line will use the default unit of measurement and the second line will use units of "pixels".
I have a code bit which I have solved this problem with:
<frameset rows="36px,80%,36px" frameborder=1 border=3>
<frame src="frame1.html" target="frame2.html" noresize>
<frame name=frame2 src="index.html">
<frame src="frame3.html" target="frame2.html" noresize>
</frameset>
Frame 1 loads data from "frame1.html" and is used for a navigation menu at the top of the screen. Frame 1's unit of measurement is an absolute value of pixels and there for does not resize when the browser window or screen type does and the other frames will. (so far)
Frame 2 is the center "content" part of the page and does not load any data itself. Frame 2 gets its data inherently using the target="frame2.html" tags found on the link for the menus in frame 1 and 3.
for example:
<a title="To Homepage" href="index.html" target="frame2" >Homepage</a>
this line when loaded from Frame1.html will reload the home page into frame2.
also this is a standard web site layout with the menu frame on the left side and applies the prelisted methods.
<frameset cols="140px,100%" frameborder=1 border=1>
<frame src="frame1.html" target="frame2.html" noresize>
<frame name=frame2 src="index.html">
</frameset>
C-ya
Related
I have a problem using in FRAMESET.
Scenario:
I'm using frameset. I have 5 links in my menu, when I click the home page its okay but when I open it in new tab or new window the design is not included.
Is there a way to bundled the design either the user open it using the new window or new tab?
Here's my code for frameset:
<frameset rows="120,*,30" border ="0">
<frame name ="top" src="header.php">
</frame>
<frameset cols="200,*" border ="0">
<frame src="menu.php" name="menu">
<frame src="index.php" name="main" scrolling="yes">
</frame>
</frameset>
<frame name="bottom" src="footer.php">
</frameset>
Here's my code for my menu:
<body bgcolor = "#585858">
<b>User Menu :</b>
<ul>
<li>Home</li>
<li>Playlist</li>
<li>View Weeks</li>
<li>Network</li>
<li>Station & Building</li>
</ul>
</body>
I already tried the _top, _self, _parent, _blank but not one of them I'm looking at.
Advance thank you.
That's by design.
If you want to work around it and force the framesets to be present in new windows, only viable option that comes to my mind is to have a javascript check on top of every child page for the frameset, and if there are none, redirect back to frameset page.
var isFramesetAvailable = (window.top !== window.self);
if (!isFramesetAvailable) {
window.location.href = 'your_frameset_page.html#target_page';
}
and then your frameset page would check for the #target_page url fragment, and if it exists, load that frame.
Iam a web page that redirects you to the page managersigning.html
<frameset rows="40%,*" noresize>
<frame src="managerhomepage.jsp" name="actionwindow" noresize frameborder="0">
<frame src="" name="resultwindow" frameborder="0">
</frameset>
</html>
Now what ever the links i added in managerhomepage.jsp will be displayed in second frame since i used it as a target.
<h2>MANAGER'S HOME PAGE</h2>
<form>
<%String flag="ok";%>
<a target="resultwindow" href="salesplan.jsp"><img src="images/salesplan.jpg"></a>
<a target="resultwindow" href="managertracking.jsp"><img src="images/tracking.jpg"/></a>
<a target="resultwindow" href=""><img src="images/reports.jpg"></a>
<img src="images/exit.jpg"/>
My problem is when ever exit button is clicked(last link ) it is displayed in the first frame since i didn't specified the target here. If i specified the target it will be displayed in second frame. But i want to display the logoutpage.html in entire screen instead of one of the frames. What to do..?
Use the target="_top" attribute in your link. This will "break" out of the frames.
<a target="_top" href="logoutpage.html"><img src="images/exit.jpg"/></a>
FYI, most designers avoid frames - You can accomplish the same thing with a bit more work but no frames, and your users will thank you for it.
On your logout page link change it to this.
<img src="images/exit.jpg"/>
And you should be set
Suppose I have following frame structure.
<frameset rows="20%,60%, *">
<frame name="theFrame" id="theFrame" src="test1.html" >
<frame name="theSecondFrame" id="theSecondFrame" src="test2.html" >
<frame name="importantFrame" id="importantFrame" src="test3.html" >
</frameset>
Suppose in "theSecondFrame" i have a button and if I click on that button it should show
a modal window.
The problem I am facing is, overlay is only limited to "theSecondFrame".
How to spread overlay across all frames so that contents are not accessible?
It's not possible to render HTML elements across multiple frames in a frameset. Each frameset is defined in the browser as having its own viewport boundary, and that means you won't be able to position stuff outside the boundaries and have them show across frames.
<frameset rows="36, 95%" border="0">
<frame src="alfa.html" noresize scrolling="no">
<frame src="http://translate.google.com/translate?js=y&prev=_t&hl=en&ie=UTF-8&layout=1&eotf=0&u=http://www.apple.com/&sl=en&tl=zh-CN">
</frameset>
How to hide the google top frame? JS? Jquery? And how...
Thanks!
Use iframes with position:absolute and negative margin-top to hide the google top frame. Be carefull with the z-index property.
Know what, this Cookie Monitor idea helped for something weird. I was trying to use Google Translate (http://translate.google.com/translate_tools?hl=en) on a mobile webapp and everytime the language is changed, it kept inserting a bar at the top as the first child of document.body . I am now tracking the 'googtrans' cookie and doing this :
listenCookieChange('googtrans', function() {
$(document.body).css('top','0px');
});
i have main html page which have two frames frame1 and frame2. frame1 is showing tree.php page
and i want that when i click on node of tree displayed in tree.php some html or php page should be displayed in frame2. how i can achieve this???
Give frame2 a name
<frameset cols="35%,65%">
<frame src="page1.php">
<frame src="page2.php" name="MainWindow">
</frameset>
And set the target of the linking node to that name
<a href="page3.php" target="MainWindow">