• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 467
  • Last Modified:

No scrolling in Frame in javascript in IE7

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
duncanb7
Asked:
duncanb7
  • 6
  • 6
4 Solutions
 
RobOwner (Aidellio)Commented:
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
 
CKY092Commented:
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
 
RobOwner (Aidellio)Commented:
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
Cloud Class® Course: Microsoft Azure 2017

Azure has a changed a lot since it was originally introduce by adding new services and features. Do you know everything you need to about Azure? This course will teach you about the Azure App Service, monitoring and application insights, DevOps, and Team Services.

 
duncanb7Author Commented:
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
 
RobOwner (Aidellio)Commented:
Why are you using frames?
0
 
duncanb7Author Commented:
I am doing frame tutorial.
0
 
RobOwner (Aidellio)Commented:
frames are now deprecated meaning they will no longer be supported in future browsers... you still want to use them?
0
 
RobOwner (Aidellio)Commented:
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
 
duncanb7Author Commented:
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
 
duncanb7Author Commented:
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
 
duncanb7Author Commented:
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
 
duncanb7Author Commented:
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
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Cloud Class® Course: CompTIA Healthcare IT Tech

This course will help prep you to earn the CompTIA Healthcare IT Technician certification showing that you have the knowledge and skills needed to succeed in installing, managing, and troubleshooting IT systems in medical and clinical settings.

  • 6
  • 6
Tackle projects and never again get stuck behind a technical roadblock.
Join Now