Frames - no scrollbar [JavaScript]

Prev: Constant focus on popup
Next: Exception with xmlHttp.status in mozilla/firefox

From: wardemon on 2 Dec 2006 23:18

Hi all,

I have a frame layout of my site as follows:

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>WikiTech</title>
</head>
<frameset id="fstSiteLayout" rows="115,*,22" bordercolor="#dcdcdc"
frameborder="yes" framespacing="1">
<frame id="frmMastHeadFrame" scrolling="no" noresize
target="frmContentFrame" src="./Aspx_Data/WikiTech_Site/masthead.aspx"
/>
<frameset id="fstMainLayout" cols="216,*" frameborder="yes"
framespacing="3">
<frameset id="fstNavigationLayout" rows="102,*"
framespacing="0" frameborder="no">
<frame id="frmQuickSearchFrame" scrolling="no"
src="./Aspx_Data/WikiTech_Site/quicksearch.aspx" />
<frame id="frmNavTreeFrame" scrolling="auto"
target="frmContentFrame" src="./Aspx_Data/WikiTech_Site/navtree.aspx"
/>
</frameset>
<frame id="frmContentFrame" frameborder="no"
bordercolor="#003399" src="./Aspx_Data/WikiTech_Site/main.aspx" />
</frameset>
<frame id="frmDiscussThreadFrame" scrolling="no" noresize
target="frmContentFrame"
src="./Aspx_Data/WikiTech_Site/discussthread.aspx" />
</frameset>
</html>

Then on the discussthread.aspx page (frame id of
"frmDiscussThreadFrame"), there is a button there that when clicked, it
will call the javascript function below:

function jsfToggleDiscussionFrame()
{
var fstSiteLayout =
window.parent.document.getElementById("fstSiteLayout");
var frmDiscussThreadFrame =
window.parent.document.getElementById("frmDiscussThreadFrame");
var intRowSize =
fstSiteLayout.rows.substring(fstSiteLayout.rows.lastIndexOf(',') + 1);
if (intRowSize != 22)
{
fstSiteLayout.rows="115,*,22";
frmDiscussThreadFrame.scrolling="no";
frmDiscussThreadFrame.noResize=true;

}
else
{
fstSiteLayout.rows="115,*,115";
frmDiscussThreadFrame.scrolling="auto";
frmDiscussThreadFrame.noResize=false;

}
}

The javascript function works on expanding & restoring the
"frmDiscussThreadFrame" frame without a problem.

My problem is that when the frame is on "expanded" form, scrollbars
wont show up, even if the discussthread.aspx page has a lot of content
in it. I'm really in a stump here.

Tha javascript code looks correct though:
fstSiteLayout.rows="115,*,115";
frmDiscussThreadFrame.scrolling="auto";
frmDiscussThreadFrame.noResize=false;
I've tried frmDiscussThreadFrame.scrolling="yes"; too but still,
scrollbar for the discussthread.aspx page won't show up.

What I notice is that when the frame definition of the frame id:
"frmDiscussThreadFrame" has been remove of the scrolling="no" tag, the
javascript works! I will have scrollbars when on "expanded" form.

<frame id="frmDiscussThreadFrame" noresize target="frmContentFrame"
src="./Aspx_Data/WikiTech_Site/discussthread.aspx" />

So my impression on this is that you cannot define the javascript
frmDiscussThreadFrame.scrolling="auto"; or
frmDiscussThreadFrame.scrolling="yes"; on demand.

Is this true? Or I've made a mistake somewhere?

Thanks,
Henry :)

From: ASM on 3 Dec 2006 06:49

wardemon a �crit :
>
> function jsfToggleDiscussionFrame()
> {
> var fstSiteLayout =
> window.parent.document.getElementById("fstSiteLayout");
> var frmDiscussThreadFrame =
> window.parent.document.getElementById("frmDiscussThreadFrame");
> var intRowSize =
> fstSiteLayout.rows.substring(fstSiteLayout.rows.lastIndexOf(',') + 1);
> if (intRowSize != 22)
> {
> fstSiteLayout.rows="115,*,22";
> frmDiscussThreadFrame.scrolling="no";
> frmDiscussThreadFrame.noResize=true;

This last line would have to mean nothing
(not important as you want resising)

> }
> else
> {
> fstSiteLayout.rows="115,*,115";
> frmDiscussThreadFrame.scrolling="auto";
> frmDiscussThreadFrame.noResize=false;

Wouldn't it have to be :
frmDiscussThreadFrame.noresize=false;

> }
> }
>
> The javascript function works on expanding & restoring the
> "frmDiscussThreadFrame" frame without a problem.

a chance ?

> My problem is that when the frame is on "expanded" form, scrollbars
> wont show up, even if the discussthread.aspx page has a lot of content
> in it. I'm really in a stump here.
>
> Tha javascript code looks correct though:
> fstSiteLayout.rows="115,*,115";
> frmDiscussThreadFrame.scrolling="auto";
> frmDiscussThreadFrame.noResize=false;

try :
frmDiscussThreadFrame.removeAttribute("noresise");

and don't forget to set it back in first condition
frmDiscussThreadFrame.setAttribute("noresise","noresize");
or ?
frmDiscussThreadFrame.setAttribute("noresise","true");

> I've tried frmDiscussThreadFrame.scrolling="yes"; too but still,
> So my impression on this is that you cannot define the javascript
> frmDiscussThreadFrame.scrolling="auto"; or
> frmDiscussThreadFrame.scrolling="yes"; on demand.

and with setAttribute ?
frmDiscussThreadFrame.setAttribute("scrolling","yes");

--
Stephane Moriaux et son (moins) vieux Mac d�j� d�pass�
Stephane Moriaux and his (less) old Mac already out of date

From: wardemon on 4 Dec 2006 01:11

Hi,
Thanks for the tip. I've tried your suggestions but still it wont
work. Here's a quick excersise example of my problem:
I still can't have the noresize and the scrolling property of the
frame object to work. I'm using IE6 on Windows XP Service Pack 2

Thanks,
Henry :)

framed_site.html
======
<html>
<frameset cols="50%,50%">
<frame id="leftFrame" src="frame_scroll.htm">
<frame id="rightFrame" noresize scrolling="no" src="frame_a.htm">
</frameset>
</html>

frame_scroll.htm
=======
<html>
<head>
<script type="text/javascript">
function enableScrolling()
{
window.parent.document.getElementById("rightFrame").scrolling="yes";
window.parent.document.getElementById("rightFrame").noresize=false;
}
function disableScrolling()
{
window.parent.document.getElementById("rightFrame").scrolling="no";
window.parent.document.getElementById("rightFrame").noresize=true;
}
</script>
</head>
<body>
<input type="button" onclick="enableScrolling()" value="Scroll bars &
Resize" />
<input type="button" onclick="disableScrolling()" value="No scroll bars
& NoResize" />
</body>
</html>

frame_a.htm
=========
<html>
<head>
</head>
<body>
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
Some Text Here 
</body>
</html>

From: ASM on 4 Dec 2006 05:21

wardemon a �crit :
> I still can't have the noresize and the scrolling property of the
> frame object to work. I'm using IE6 on Windows XP Service Pack 2

I'm very sorry for you.

I think you'll have to move border inter-frames to excite IE :-)
(Opera needs that too)
(Safari and iCab do nothing with theses scroll and co)

framed_site.html
======
<html>
<frameset id="general" cols="50%,50%">
<frame id="leftFrame" src="frame_scroll.htm">
<frame id="rightFrame" noresize scrolling="no" src="frame_a.htm">
</frameset>
</html>

frame_scroll.htm
=======
<html>
<head>
<script type="text/javascript">
function enableScrolling()
{
var target = parent.document.getElementById("rightFrame");
target.scrolling='yes';
target.removeAttribute('noresize');
// move your bottom you IE and others !
parent.document.getElementById("general").setAttribute('cols','51%,49%');
setTimeout(
'parent.document.getElementById("general").setAttribute("cols","50%,50%")',
50);
}
function disableScrolling()
{
var target = parent.document.getElementById("rightFrame");
target.setAttribute('noresize',true);
// or ?
// target.noresize=true;
target.scrolling='no';
// move your bottom you IE and others !
parent.document.getElementById("general").setAttribute('cols','51%,49%');
setTimeout(
'parent.document.getElementById("general").setAttribute("cols","50%,50%")',
50);
}
</script>
</head>
<body>
<input type="button" onclick="enableScrolling()" value="Scroll bars &
Resize" />
<input type="button" onclick="disableScrolling()" value="No scroll bars
& NoResize" />
</body>
</html>

--
Stephane Moriaux et son (moins) vieux Mac d�j� d�pass�
Stephane Moriaux and his (less) old Mac already out of date

From: wardemon on 7 Dec 2006 08:40

found the answer by using document.body.scroll

function jsfToggleDiscussionFrame()
{
var fstSiteLayout =
window.parent.document.getElementById("fstSiteLayout");
var frmDiscussThreadFrame =
window.parent.document.getElementById("frmDiscussThreadFrame");
var intRowSize =
fstSiteLayout.rows.substring(fstSiteLayout.rows.lastIndexOf(',') + 1);
if (intRowSize != 22)
{
fstSiteLayout.rows="115,*,22";
frmDiscussThreadFrame.scrolling="no"; //does not work for some
reason
frmDiscussThreadFrame.noResize=true; //disables resizing of
discussion frame
document.body.scroll = "no"; //hides scrollbars
}
else
{
fstSiteLayout.rows="115,*,115";
frmDiscussThreadFrame.scrolling="auto"; //does not work for
some reason
frmDiscussThreadFrame.noResize=false; //enable resizing of
discussion frame
document.body.scroll = "yes"; //displays scrollbars
}
}

|
Pages: 1
Prev: Constant focus on popup
Next: Exception with xmlHttp.status in mozilla/firefox