?
Solved

No scrolling in Frame in javascript in IE7

Posted on 2011-10-23
13
Medium Priority
?
432 Views
Last Modified: 2012-05-12
Dear Experts,

I have two frame to navigate to different example website and I try to use
javascript code to set attribute control on the second frame scrolling  to NO but
it fail no matter what the code I use.

I try to enable  the following code by clicking hef="javascript:scrolltest() function"
Method-1 parent.mainFrame.setAttribute("scrolling", "no");
Method-2 parent.mainFrame.scrolling="NO";
Method-3 mainFrame.scrolling="NO";
Method-4 parent.document.getElementById("second").scrolling = "no";

All my try is no any response in IE7 broswer

Please advise
Duncan        
Example.html file
==============================================

<DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3. org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html>
<head>
<title>Mainpage Javascript </title>
<style type="text/css">
</style>
<script language="javascript">
   /* document.getElementById("myFrame").noResize = true;*/
	
</script>
</head>





<frameset rows="200,*" cols="*"   border="0">
<frame  name="topFrame" id="first" noresize  frameborder="0" scrolling="NO" src="http://www.wiki.com" />
<frame name="mainFrame"  id="second"  noresize frameborder="0" src="test.html?Load"    scrolling="yes" />

 
</frameset>


test.html file
===========================================

</html> 


<html>
<body>
<head>
<script type="text/javascript" >
function scrolltest() 
{
//parent.mainFrame.setAttribute("scrolling", "no");
//parent.mainFrame.location.href="http://www.w3school.com";
parent.mainFrame.scrolling="NO";
}
</script >
</head>
<p> Testing frame</p>
<a href="javascript:scrolltest();">Testing scrolling in frame click<a>
<div>
<IFRAME name="myIframe" id="third" SCROLLING=yes border=0 frameborder=0 width=100% height=100% src="http://www.yahoo.com"></IFRAME>


 

</div>
</body>
</html>

Open in new window

test.html
example.html
0
Comment
Question by:duncanb7
  • 6
  • 6
13 Comments
 
LVL 43

Accepted Solution

by:
Rob earned 1500 total points
ID: 37015311
I'm not entirely sure of the effect you're after but is this is kind of layout you want?  I've removed your frames and replaced with iframes.  Was there a reason you wanted a frameset?
<DOCTYPE html>
<html lang='en'>
	<title></title>
	<style type='text/css'>
		div {
			overflow: none;
		}
		iframe {
			width: 100%;
		}
		#first {
			height: 250px;
		}
		#second {
			height: 600px;
		}
	</style>
<head>
</head>
<body>
<div id='d1'>
	<iframe
		name="myiframe1"
		id="first"
		scrolling='no'
		border='0'
		frameborder='0'
		src="http://www.wiki.com"
	>Does not support iframe</iframe>
</div>
<p>Testing frame</p>
<a href="javascript:scrolltest();">Testing scrolling in frame click<a>
<div>
	<iframe
		name="myiframe2"
		id="second"
		scrolling='no'
		border='0'
		frameborder='0'
		src="http://www.yahoo.com"
	>Does not support iframe</iframe>
</div>
</body>
</html>

Open in new window

0
 
LVL 4

Expert Comment

by:CKY092
ID: 37015323
Unfortunately, it doesn't look like you'll be able to use JS to manipulate the scroll attribute with IE.

http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_iframe_scrolling
0
 
LVL 43

Assisted Solution

by:Rob
Rob earned 1500 total points
ID: 37015331
CKY092 is right however by wrapping the iframe in a div and controlling the scroll css attribute of the DIV you can get the same effect
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
LVL 13

Author Comment

by:duncanb7
ID: 37016038
frame and iframe is not a matter
And I just want to control frame scrolling in second html script, for exmple,
control frame in example.html by the javascript code in test.html
I have tried the following scrolltest() and  monitor by alert() , the attribue scrolling is
changing from yes to no. But the browser is no response , it is still enable
scrolling on second frame.
function scrolltest()
{

alert(parent.document.getElementById('mainFrame').scrolling);
parent.document.getElementById('mainFrame').scrolling="NO"
alert(parent.document.getElementById('mainFrame').scrolling);
alert(parent.document.body.innerHTML);
}


Similar problem is at this thread at, but no any solution
http://forums.devarticles.com/javascript-development-22/lock-frame-scroll-42878.html
0
 
LVL 43

Expert Comment

by:Rob
ID: 37016191
Why are you using frames?
0
 
LVL 13

Author Comment

by:duncanb7
ID: 37016223
I am doing frame tutorial.
0
 
LVL 43

Assisted Solution

by:Rob
Rob earned 1500 total points
ID: 37042639
frames are now deprecated meaning they will no longer be supported in future browsers... you still want to use them?
0
 
LVL 43

Expert Comment

by:Rob
ID: 37054601
You should still be able to achieve part of what you want to do using iframes and div tags.  To use traditional frames means you need to update 2 parts to your site, the noframes version and the frames version.
0
 
LVL 43

Assisted Solution

by:Rob
Rob earned 1500 total points
ID: 37054604
0
 
LVL 13

Author Comment

by:duncanb7
ID: 37059717
Recent days, I have tried a lot of Iframe example , and I found iframe may
be better than frame.

But one question, in iframe,
When I try to  adjust iframe width and height according to each source html page's
height and widht  scrollHieght and scrollwidth. But the result the body content's
width and height is always the same as the most height or the most widest 's html
page. What I try all iframe content page or parent page is at the same domain at my
website(not cross-domain). it seems we can not able to reset the scrollHeight or scrollWidth with different html iframe content.  Please review my following code
and checking the thread at http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_26513807.html


In the following code, for first time, you adust the iframe content it work by
typing "adjust button"  and if you change the iframe src for short height content
by src button in input button , you will see the iframe cotent is well fit into the broswer
and leave a lot empty space at the bottom of the ifame because the first one is
long content height page.

How to solve this issue in Iframe, I try to
document.getElementById('d1').innerHTML="";
document.getElementById('d1').innerHTML="<IFRAME id='ifr' style='border:0;
margin:0; padding:0 ' name='ifr' noresize  SCROLLING=noborder=0
frameborder=0 width=100% height=100% src="+link+" ></IFRAME>";

to replace document.getElementById('ifr').src=link;

It is same the scrollHeight is always as the first hit page of iframe's scrollHeight and width

Why ? Please advise

Duncan




<html >
<head>
<title></title>
<script type="text/javascript"> 
document.domain="http://www.e-hftrade.com";
 function loadpage()
{ 
 var ifra=document.getElementById('ifr').contentWindow;
document.getElementById('ifr').height =ifra.document.body.scrollHeight + 5;
document.getElementById('ifr').width =ifra.document.body.scrollWidth + 5;
}
 function loadpagesrc(link)
{


document.getElementById('ifr').src=link;
//document.getElementById('d1').innerHTML="";
//document.getElementById('d1').innerHTML="<IFRAME id='ifr' style='border:0;
//margin:0; padding:0 ' name='ifr' noresize  SCROLLING=noborder=0 
//frameborder=0 width=100% height=100% src="+link+" ></IFRAME>";
loadpage();

}
</script> 
</head>

<body>
<div id="d1">
<IFRAME id="ifr" style="border:0; margin:0; padding:0 " name='ifr' noresize    SCROLLING=no border=0 frameborder=0 width=100% height="100%" src='longcontent.html' ></IFRAME>
</div>
<input type="button" onclick="javascript:loadpage();" value="Ajust" />
<input type="button" onclick="javascript:loadpagesrc('shortcontent.html');" value="src" />
</body>
</html>

Open in new window

0
 
LVL 13

Author Comment

by:duncanb7
ID: 37059741
I mean if your first or next  iframe html page 's scrollHieght and scroll width's
highest or widest content, the scrollHeight and scrollWidht value  is fixed and no change
at all to the highest one  even you change the  the ifrmae scr to other page at the
same domain Why ?

I know scrollheight is read-only and could not be written , Is it Yes ?
0
 
LVL 13

Author Comment

by:duncanb7
ID: 37059769
I mean if the first one iframe src content is  width*height=1024*800  and
scrollwidth and scrollHieght will be around 1024*800
and if you change iframe src for the page widht and content =800*400 and
the scrollwdith and scrollHeight is still to be the bigger one as 1024*800
and the display to the last one iframe scr will leave a lot blank or empty
space at your left or bottom in the broswer.

Please advise if you understand my question

Duncan
0
 
LVL 13

Author Closing Comment

by:duncanb7
ID: 37060714
THanks for all of your reply
anyyway it solve some issue about scrolling bar
in this thread by iframe instead frame and
new question I may switch to new thread for scrollHeight

THanks

Duncan
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

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

When it comes to write a Context Sensitive Help (an online help that is obtained from a specific point in state of software to provide help with that state) ,  first we need to make the file that contains all topics, which are given exclusive IDs. …
Q&A with Course Creator, Mark Lassoff, on the importance of HTML5 in the career of a modern-day developer.
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…
Suggested Courses

749 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