I am trying to embed a map using the code supplied by Google Maps with no alterations. When the page is displayed the Google pointer, zoom level indicator, etc. show but no streets or map, per se. This is the code Google suppled:
<iframe width="425" height="350" frameborder="0" scrolling="No" marginheight="0" marginwidth="0" src="http://maps.google.com/maps?q=First+Baptist+Church,+Mc+Caysville,+GA+30555&hl=en&cd=2&ei=Gh10TNbbGZj0ygTT24nwCQ&sig2=hvRb-F6JuV91UcC6QUKGUw&ie=UTF8&view=map&cid=16713672426408470324&ved=0CBoQpQY&hq=First+Baptist+Church,+Mc+Caysville,+GA+30555&hnear=&ll=34.986955,-84.368584&spn=0.006153,0.013754&z=16&output=embed&iwloc=near&addr"></iframe>
<br />
<small>View Larger Map</small></div>
What is the problem?
It works on my machine.
Maybe you forgot to add the <html> and <body> tags. You also have a closing </div> that doesn't start anywhere, but it should nevertheless work even without its opening tag.
<html>
<head>
<title></title>
</head>
<body>
<div>
<iframe width="425" height="350" frameborder="0" scrolling="No" marginheight="0"
marginwidth="0" src="http://maps.google.com/maps?q=First+Baptist+Church,+Mc+Caysville,+GA+30555&hl=en&cd=2&ei=Gh10TNbbGZj0ygTT24nwCQ&sig2=hvRb-F6JuV91UcC6QUKGUw&ie=UTF8&view=map&cid=16713672426408470324&ved=0CBoQpQY&hq=First+Baptist+Church,+Mc+Caysville,+GA+30555&hnear=&ll=34.986955,-84.368584&spn=0.006153,0.013754&z=16&output=embed&iwloc=near&addr">
</iframe>
<br />
<small><a href="http://maps.google.com/maps?q=First+Baptist+Church,+Mc+Caysville,+GA+30555&hl=en&cd=2&ei=Gh10TNbbGZj0ygTT24nwCQ&sig2=hvRb-F6JuV91UcC6QUKGUw&ie=UTF8&view=map&cid=16713672426408470324&ved=0CBoQpQY&hq=First+Baptist+Church,+Mc+Caysville,+GA+30555&hnear=&ll=34.986955,-84.368584&spn=0.006153,0.013754&z=16&source=embed"
style="color: #0000FF; text-align: left">View Larger Map</a></small></div>
</body>
</html>
Related
I tried to add two local html file (as frame, inside one html code) in two different iframe, but its not working. Output showing the same html file in both frame.[I guess, screenshot will help to understand my problem]
Here my html code.
<!DOCTYPE html>
<html>
<head></head>
<body>
<h1>Frame1:</h1>
<iframe src="frame1.html" frameborder="1" width="100%" height="250px" name="frame1">
</iframe>
<br /><br /><br />
<h2>Frame 2:</h2>
<iframe src="frame2.html" frameborder="1" width="100%" height="250px" name="frame2">
</iframe>
</body>
</html>
frame1.html file:
<!DOCTYPE html>
<html>
<head></head>
<body>
<h2>This is a separate frame than others</h2>
</body>
</html>
frame2.html file:
<!DOCTYPE html>
<html>
<head></head>
<body>
<h3>Frame 3:</h3>
<iframe src="" frameborder="1" width="90%" height="180px">
</iframe>
</body>
</html>
Screenshot, describing my problem
I just try copy pasting your code in 3 different file in same folder, and i got what you need to have
Maybe this is a cache problem. Have you try to clear your cache browser?
I'm trying to use <embed> but having limited success. These two URLs won't embed, for example.
<embed style="width: 500px; height: 300px;"
src="https://www.tate.org.uk" width="300" height="150">
</embed>
<embed style="width: 500px; height: 300px;"
src="http://www.northlondonreadinggroup.co.uk/" width="300" height="150">
</embed>
Whereas other URLs will...
https://adsler.co.uk/adsler-blog/
I came across these: How Can I Bypass the X-Frame-Options: SAMEORIGIN HTTP Header? If I post them in my site header, can I bypass iframe restrictions?
<script
src="https://unpkg.com/#ungap
/custom-elements-builtin"></script>
<script type="module" src="x-frame-
bypass.js"></script>
As #showdev mentioned, you can use the X-Frame-Options
Here is an example for your case:
<!DOCTYPE html>
<html>
<script src="https://unpkg.com/#ungap/custom-elements-builtin"></script>
<script type="module" src="https://unpkg.com/x-frame-bypass"></script>
<body>
<h2>HTML Iframes</h2>
<p>You can use the height and width attributes to specify the size of the iframe:</p>
<iframe is="x-frame-bypass" src="https://www.tate.org.uk" height="150" width="300"></iframe>
<iframe is="x-frame-bypass" src="http://www.northlondonreadinggroup.co.uk/" height="150" width="300"></iframe>
</body>
</html>
Here is the example that I mentioned: (Just click on run)
https://www.w3schools.com/code/tryit.asp?filename=G4LYCU8V9ILG
I want to display a Google Map in my website via iframe, but it does not work. How can I get it done?
Here is source:
<div class="google-map">
<iframe src="https://www.google.com/maps/place/Rruga+Azem+Galica,+Tirana,+Albania/#41.3673698,19.7668261,17z/data=!3m1!4b1!4m2!3m1!1s0x135032024ea626ad:0x2af6740dbcc9fac7?hl=en-US"
frameborder="0" width="100%" height="300" marginwidth="0"
marginheight="0" scrolling="no">
Thanks.
The link you used in the src tag is not the embedding link, it's the sharing link.
Use this:
<iframe
src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d2994.3090479975776!2d19.7668261!3d41.367369800000006!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x135032024ea626ad%3A0x2af6740dbcc9fac7!2sRruga+Azem+Galica%2C+Tirana%2C+Albania!5e0!3m2!1sen!2s!4v1427117877944"
frameborder="0"
width="100%"
height="300"
marginwidth="0"
marginheight="0"
scrolling="no">
</iframe
I have the following html code
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<frameset id="mainFrameset" bordercolor="#000000" border="2" framespacing="2" frameborder="1" rows="55,*" name="mainFrameset">
<frame scrolling="no" noresize="noresize" marginwidth="0" marginheight="0" src="title.jsp" name="titleFrame">
<frameset id="innerFrameset" framespacing="0" border="0" frameborder="0" cols="20.0%,*" name="innerFrameset">
<frame scrolling="auto" target="mainFrame" noresize="noresize" marginwidth="0" marginheight="0" src="dynamicContents.jsp" name="contentFrame">
<frame scrolling="auto" marginwidth="0" marginheight="0" src="Welcome.jsp" name="mainFrame">
<html>
<head>
<title>retailJava Home</title>
<meta content="text/html; charset=iso-8859-1" http-equiv="Content-Type">
</head>
<frameset id="mainFrameset" bordercolor="#000000" border="0" framespacing="0" frameborder="no" rows="*,*">
<frame scrolling="auto" marginwidth="0" marginheight="0" src="WelcomeMain.jsp" name="welcomeMain">
<html>
<head>
<title>Welcome to retail-j</title>
<link type="text/css" href="/rjBackOffice/stylesheets/maintenance.classic.css" rel="stylesheet">
<base target="_self">
</head>
<body text="#000000" leftmargin="0" topmargin="0">
<div id="WelcomeContainer">
<div id="HeaderLogo">
<div id="WelcomeMessages">
<span id="WelcomeMessage">Welcome to retail-j</span>
<span id="LoginInformation">You are currently logged in as BOB</span>
</div>
</div>
</body>
</html>
</frame>
<frame scrolling="auto" marginwidth="0" marginheight="0" src="SystemManagement/InScreenApplicationAlertViewerServlet" name="alertFrame">
<html>
</frame>
</frameset>
<noframes> <body bgcolor="#FFFFFF" text="#000000" topmargin="0" leftmargin="0"> Sorry your browser does not support framesets. </body> </noframes>
</html>
</frame>
</frameset>
<noframes> <body bgcolor="#FFFFFF" text="#000000" topmargin="0" leftmargin="0"> Sorry your browser does not support framesets. </body> </noframes>
</frameset>
</html>
I am trying to locate the the span element with id WelcomeMessage from the above html code. I tried the following to locate
driver.switchTo().frame("welcomeMain");
WebElement element=driver.findElement(By.xpath(".//*[#id='WelcomeMessage']");
Kindly let me know how to switch between framesets/frames [in case of a complex html with convoluted frames as shown above]and locate the elements inside them.
I get the error " unable to locate element welcomeMain......"
Kindly reply to sort this , thanks in advance.
It might be the issue because of your webdriver control may already inside the default frame, and you may need to take the control out of all frame first before taking it to another frame.
Check whether you are able to switch to all the frames available in that page by using below code and this should be working fine.
for (WebElement e :driver.findElements(By.tagName("frame")))
{
driver.switchTo().defaultContent();
driver.switchTo().frame(e);
if(driver.findElement(By.xpath("yourElement")).isDisplayed())
{
driver.findElement(By.xpath("yourElement")).click();
break;
}
else
continue;
}
I'm trying to create two frames and make them scroll together,
for instance in the case of a page with a changing menu bar at the top -
I'm using a carousel - or a footer at the bottom,
that must appear as part of the page.
I want a page to look like one page that is also capable of scrolling,
but the page is actually composed of two frames.
Using this...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!-- Info from: http://www.webxpertz.net/forums/showthread.php?t=257 -->
<!-- Using this... -->
<meta NAME="Description" content="Outer frame(OneBaredFrame) used to wrap the header and body frames" />
<meta HTTP-EQUIV="Cache-Control" content="no-cache" />
<meta HTTP-EQUIV="pragma" content="no-cache" />
<title></title>
</head>
<frameset rows="1,*" border="0" frameborder="no">
<frame src="javascript:<HTML></HTML>" name="dummy" id="dummy"
frameborder="no" marginheight="0" marginwidth="0" noresize="noresize" scrolling="no"></frame>
<frame src="index_inner.html" name="OneBaredFrame"
id="OneBaredFrame" frameborder="no" marginheight="0" marginwidth="0" noresize="noresize" scrolling="yes"></frame>
<!-- the bottom frame above if scrolling="yes" doesn't show a scrollbar for me? -->
<!-- the top frame above if scrolling="yes" does show a scrollbar for me if rows="100,*" say? -->
</frameset>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta NAME="Description" content="Frames for within a scrollable frame">
<meta HTTP-EQUIV="Cache-Control" content="no-cache">
<meta HTTP-EQUIV="pragma" content="no-cache">
<title></title>
</head>
<!-- My header and body frames need to scroll together,
so I am using another frameset (the one above) to enclose these frames -->
<frameset rows="215,*" border="0" frameborder="no">
<frame src="Header.html" id="header" name="header" frameborder="no"
marginheight="0" marginwidth="0" noresize="noresize" scrolling="no"></frame>
<frame src="index_body.html" id ="body" name="body" frameborder="no"
marginheight="0" marginwidth="0" noresize="noresize" scrolling="no"></frame>
<!-- when the above are set to scrolling="yes" scrollbars appear for me for each -->
</frameset>
</html>
When using frames, each will get its own scroll bars.
You can't have a single scroll bar for two frames, precisely because the are two frames.
Update:
You can workaround this by making both frames non scrolling and wrapping both them within a third scrolling frame (whose only reason to exist is to provide a single scroll bar). The parent frame will handle scrolling of both inner frames together.
You need to add a new page with a frameset like the following, making sure the second one points to your frameset (and set SCROLLING="NO" on both framesets:
<FRAMESET ROWS="0%,100%"
BORDER="0"
FRAMEBORDER="NO">
<FRAME SRC=""
NAME="dummy"
FRAMEBORDER="NO"
MARGINHEIGHT="0"
MARGINWIDTH="0"
NORESIZE
SCROLLING="NO">
</FRAME>
<FRAME SRC="*url to your frameset*"
NAME="myframes"
FRAMEBORDER="NO"
MARGINHEIGHT="0"
MARGINWIDTH="0"
NORESIZE
SCROLLING="YES">
</FRAME>
</FRAMESET>
I got what you are looking for using IFRAME.
It's even more flexible than FRAME, since it doesn't require you to split the window from edge to edge, and each frame boundary doesn't need to be aligned with another one.
I used this for a webpage I just deployed and it works like a charm.
There is one drawback: the height of the principal frame must be fixed beforehands, and you need to overestimate it in order to avoid an inner scrollbar.
<BODY>
<CENTER>
<DIV style="display:table-cell; width:800; ">
<iframe WIDTH=800 HEIGHT=220 src="menu.html" name="topframe" frameBorder=0 SCROLLING=NO></iframe>
<iframe WIDTH=800 HEIGHT=380 src="home.html" name="contentframe" frameBorder=0 SCROLLING=AUTO></iframe>
<iframe WIDTH=800 HEIGHT=220 src="menu.html" name="bottomframe" frameBorder=0 SCROLLING=NO></iframe>
</DIV>
<CENTER>
</BODY>
Links in menu.html with TARGET="contentframe" do what you want it to do.