Hide the top frame on google translate - html

<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');
});

Related

Remove description bubble from embedded google maps

Below is my google maps code which embeds a google map iframe into my website. However I need to know which part of the code gets rid of the description bubble as it is in the way and looks awful.
<iframe width="100%" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.co.uk/maps/embed/v1/vie?f=q&source=s_q&hl=en&geocode=Fef8HgMdTF8HACGtndVv4fvEAykHADl3VT_YRzGtndVv4fvEAw%3BFf-gHwMdtnoIACG4YnecgIb83ykH1S7ttDnYRzG4YnecgIb83w&q=mildenhall+to+raf+lakenheath&aq=&sll=52.387544,0.494041&sspn=0.099739,0.244446&ie=UTF8&ll=52.378862,0.524008&spn=0.035347,0.068778&t=m&saddr=mildenhall&daddr=raf+lakenheath&output=embed/v1/view"></iframe>
'&iwloc=near' no longer works with the new google api.
Thanks in advance
This answer :
Google Maps Embed - Remove Place Card
has a method of using a container div with overflow:hidden and a negative margin on the iframe to chop off the top containing the description bubble.
Just Add :
&iwloc=near in iframe src
Used like this:
<iframe width="400" scrolling="no" height="300" frameborder="0" src="https://maps.google.co.uk/maps?hl=en&q=so21+1aj&z=10&output=embed&iwloc=near" marginwidth="0" marginheight="0"></iframe>
Using jQuery I removed the bubble, from actual version of / place autocomplete version / google maps, modyfing one original function:
autocomplete.addListener('place_changed', function() {
// ... the function code, before it's closing
// tag I added 3 lines: //
$("div[class='gm-style-iw']").prev('div').remove(); // bubble
$("div[class='gm-style-iw']").next('div').remove(); // close button
$("div[class='gm-style-iw']").remove(); // text
});
it is also necessary to attach the jQuery library

Open iframe in a new window

How do I open an iframe in a new window? I tried with "scrolling='auto'". It did not work.
I put my code here:
<iframe width="572px" scrolling="auto" height="335px"
frameborder="1" src="http://XXXX.com/iframe-page"
style="border: 0px none #ffffff;" name="national-campaign"
marginheight="0px" marginwidth="0px">
</iframe>
I want to open a link in a new window. I have two sites, a corporate site and a dealer site. On the corporate site, I have a page with only an image that I want to display in both corporate site and dealer site. When you click on the image, it goes to view detail page. However, what I want in my dealer site is, when you click on the iframe image, it opens the tab in a new window, instead of displaying detail page inside the iframe.
Any ideas? Cheers.
You can do it with jquery and window.open method.
HTML:
<iframe id="iframe" width="572px" scrolling="auto" height="335px"
frameborder="1" src="http://XXXX.com/iframe-page"
style="border: 0px none #ffffff;" name="national-campaign"
marginheight="0px" marginwidth="0px">
</iframe>
JS :
var iframe = $("#iframe");
var newWindow = window.open(iframe.attr(src), 'Dynamic Popup', 'height=' + iframe.height() + ', width=' + iframe.width() + 'scrollbars=auto, resizable=no, location=no, status=no');
newWindow.document.write(iframe[0].outerHTML);
newWindow.document.close();
iframe[0].outerHTML = ''; // to remove iframe in page.
The easy way is to use a hyperlink with an attribute target="_blank".
If the height and width are important to you (cf. your example), then you can use the JavaScript method window.open.
Try to add target="_top" inside that link.
or alternatively if you need to open a new page from a link inside an iframe if i understood correctly you can:
Using jQuery:
$('iframe a').attr('target', '_blank');
I would recommend that you just use a hyperlink to another page rather than an iframe. Or a screenshot image that is actually a link.
Some users may be 'smart' enough to right-click within the iframe (in internet explorer) and select a 'open in new window' option, but others wouldn't do that.

HTML: Frameset Open in New window or Tab

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.

How to show overlay across FRAMES?

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.

HTML Frameset alignment

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