Solved

How can you make frames, and frame target work on Google Chrome?

Posted on 2015-02-02
6
951 Views
Last Modified: 2015-02-03
Hello Experts,

I have an issue when using frameset on Google Chrome on a customer's web site of the company I work on.
The frameset is such that it has a top frame, a right frame as a menu and a main frame to display
contents. The html is using HTML4.

The issue we are having is with the menu frame that is targetting to the main frame in order to render
the content for the selected option in the menu. The main frame updates correctly on Firefox and on
Interne Explorer,  the issue appears with Google Chrome because main frame doesn't update, but if
control key + click opens in a new tab.

I have included files reassembling the behaviour above with html files. On the production
environment jsp render the html content with the same effect as in the files that I'm including now. Just open the home.html this will open a frameset. Click on any of the "content" links on the right menu. Content will show up in the main frame on Firefox/Internet Explorer, but Google Chrome won't open them unless you press control key + click  and it will open on a new tub. FireFox/internet Explorer open on the same tab. I need Google Chrome respects the "target" and opens on the same page.

How can you make frames, and frame target work on Google Chrome?

I know there are known security issues related to Google Chrome that may affect the frame behaviour:
a) Sandboxing, which unables two tab contents unable to communicate between them.
b) Frame targetting is disabled by default using local system files (the file:// protocol on the URL)
c) Restrictions loading content on frames on cross-domain content.

However, none of those issues applies to the scenario I'm facing since the local system is not being
used, the web site content is all displayed on the same site, and the content is gathered form the same
domain, and glass flish is used as a web server -so no local files.

Finally Experts, please elaborate on  whether the following alternatives would be a good workaround
in case this issue can't be fixed on Chrome:
1) Using XMLHttpRequest object to update the frame content.
2) Update from HTML4 to HTML5 to use div instead of frames.
3) Replace frames with embdebbed objects

Looking forwards your answers.

-Sergio
content1.html
content2.html
banner.html
home.html
main.html
0
Comment
Question by:successsergio
  • 3
  • 3
6 Comments
 
LVL 83

Expert Comment

by:Dave Baldwin
ID: 40585772
The files you have posted don't work.  The 'home.html' does not have a 'frame' DOCTYPE and 'menu.html' is used twice although it is not one of the files that you posted.
0
 

Author Comment

by:successsergio
ID: 40586337
0
 

Author Comment

by:successsergio
ID: 40586367
Thank you for the follow up Dave.
I uploaded the "menu.html" which indeed was missing. However the 'home.html' file does contains framesets code and the 'main.html' file doesn't -it only has openning html, head, and body tags but is empty con content, this is how it looks on the productive environment.

The 'home.html' has a frameset which include a frame named "cambios" whose source is taken from 'main.html'. There are options in the 'menu.html' which replace the content in the "cambios" frame with content from the 'content1.html' and 'content2.html' files.

Hope this helps to reproduce the scenario.
0
Netscaler Common Configuration How To guides

If you use NetScaler you will want to see these guides. The NetScaler How To Guides show administrators how to get NetScaler up and configured by providing instructions for common scenarios and some not so common ones.

 
LVL 83

Accepted Solution

by:
Dave Baldwin earned 500 total points
ID: 40587090
Chrome apparently didn't like the '0' width columns in 'home.html'.  I removed them and this is what worked.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
 "http://www.w3.org/TR/html4/frameset.dtd">

<html>
<head>
	<title>Welcome - Lorem ipsum </title>
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
			<frameset rows="73,*" cols="*" frameborder="no" framespacing="0">
				<frame src="banner.html" frameborder="0" name="topFrame" scrolling="NO" noresize>
				<frameset cols="*,117" frameborder="no" framespacing="0">
					<frame src="main.html" frameborder="0" name="cambios" ></frame>
					<frame src="menu.html" frameborder="0" name="menu" scrolling="NO" noresize>
				</frameset>
			</frameset>
<noframes>
	<body>
	</body>
</noframes>
</html>

Open in new window

0
 

Author Closing Comment

by:successsergio
ID: 40587218
Sheesh, that was excellent!

I had tried as well removing the outer frameset which has rows and columns sized to 0.
It didn't pass thought my mind that the width column with size "0" on the inner frame would make Chrome frawn.

I replicated the frameset structure as suggested and works seamless including in the productive environment!!

Thanks a lot for your valuable help.
0
 
LVL 83

Expert Comment

by:Dave Baldwin
ID: 40587308
You're welcome, glad to help.
0

Featured Post

Best Practices: Disaster Recovery Testing

Besides backup, any IT division should have a disaster recovery plan. You will find a few tips below relating to the development of such a plan and to what issues one should pay special attention in the course of backup planning.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

SSL stands for “Secure Sockets Layer” and an SSL certificate is a critical component to keeping your website safe, secured, and compliant. Any ecommerce website must have an SSL certificate to ensure the safe handling of sensitive information like…
This article discusses how to create an extensible mechanism for linked drop downs.
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

770 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question