PDA

View Full Version : change tablewidth

siflaar
07-26-2002, 02:52 PM
Hello all,

I have the following problem. I'm creating a website for a friend that uses two frames. (http://www.jbg-beeld-geluid.nl)
In the upper frame is the menu and the bottom frame the text.
The whole text area is surrounded by a line to give it a nice look. But a part of the line is created on the top frame (this because the menu needs some space)
I would like to use the max pagewidth, but when a scrollbar is shown, it will only show for the bottom frame.
When I expand the table on both frames the lines of the bottom frame need space for the scrollbar, but the topframe will show the end of the line to the right side of the screen. (above the scrollbar)


Is there a way to check the current resolution and then change automaticaly the table width so it all will fit nicely?:thumbsup:
siflaar
07-27-2002, 10:31 AM
Hallo all,

I was just thinking, is it possible to extract the widht of the scrollbar current on the screen, and than add a picture at the same size at the end of the topframe?

You are still with me?
siflaar
07-29-2002, 10:39 AM
Hello All,
It seems that I found a solution for my problem.
By using a Javascript that hide the scrollbars and a DHTML script to scroll the page using cutsome buttons I can set both tables in the frame top en bottom to 100%.

Here are the scrips if you are interrested:( BTW not tested yet!)

=====================================
=== Javascript to hide and unhide the scrollbars
=====================================
<HEAD>
<SCRIPT LANGUAGE="JavaScript">

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->
<!-- Original: Scriptbreaker (pieterpareit@hotmail.com) -->
<!-- Web Site: http://www24.brinkster.com/scriptbreaker/home.htm -->

<!-- Begin
function hidden()
{document.body.style.overflow='hidden';}
function unhidden()
{document.body.style.overflow='';}
// End -->
</script>
</head>

<BODY onload="hidden()">


</body>

=========================================
=== DHTML - for scrolling a page with custom buttons
=========================================

<div id="staticbuttons" style="position:absolute;">
<a href="javascript:" onmouseover="myspeed=-thespeed" onmouseout="myspeed=0"><img
src="arrows_up.gif" border="0"></a><br>
<a href="javascript:" onmouseover="myspeed=thespeed" onmouseout="myspeed=0"><img
src="arrows_dn.gif" border="0"></a>
</div>

<script>

//Page Scroller (aka custom scrollbar)- By Dynamic Drive
//For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
//This credit MUST stay intact for use

var Hoffset=70 //Enter buttons' offset from right edge of window (adjust depending on images width)
var Voffset=80 //Enter buttons' offset from bottom edge of window (adjust depending on images height)
var thespeed=3 //Enter scroll speed in integer (Advised: 1-3)

var ieNOTopera=document.all&&navigator.userAgent.indexOf("Opera")==-1
var myspeed=0

var ieHoffset_extra=document.all? 15 : 0
var cross_obj=document.all? document.all.staticbuttons : document.getElementById?

document.getElementById("staticbuttons") : document.staticbuttons

function positionit(){
var dsocleft=document.all? document.body.scrollLeft : pageXOffset
var dsoctop=document.all? document.body.scrollTop : pageYOffset
var window_width=ieNOTopera? document.body.clientWidth+ieHoffset_extra :

window.innerWidth+ieHoffset_extra
var window_height=ieNOTopera? document.body.clientHeight : window.innerHeight

if (document.all||document.getElementById){
cross_obj.style.left=parseInt(dsocleft)+parseInt(window_width)-Hoffset
cross_obj.style.top=dsoctop+parseInt(window_height)-Voffset
}
else if (document.layers){
cross_obj.left=dsocleft+window_width-Hoffset
cross_obj.top=dsoctop+window_height-Voffset
}
}

function scrollwindow(){
window.scrollBy(0,myspeed)
}

function initializeIT(){
positionit()
if (myspeed!=0){
scrollwindow()
}
}

if (document.all||document.getElementById||document.layers)
setInterval("initializeIT()",20)

</script>

If someone else has an other solution I would like to hear of it.
siflaar
07-30-2002, 07:22 AM
Hello All,

I tested my options above.....
And it did not work, because the javascript is not removing the scrollbars but is just not showing them... It will leave the space of the scrollbars visiable.

Pitty
welo
07-30-2002, 08:51 AM
Hi Patrick--

Uncertain whether everyone is waiting for you to answer your own question, don't wanna tell you to take a step up by getting rid of the frames, or just waiting for this thread to get moved to the javascripting forum.

I'll hafta tell ya though: Aside from wondering why Banner_NAVBar.gif has any right to be a 74k image, I'm having difficulty deciphering what you really want to do, especially since you're using cut and paste code from another site. Maybe you're asking in the wrong place. :(
siflaar
07-30-2002, 09:37 AM
Hello Welo,

I started this question in the javascript forum, but is was moved to this forum

Returning to your comments:
I use a frame because I thought that is the way af doing it, not to have the menu structure on every page, just have it ones.
Also I think it is more nice to have the menustructure always visable even after scrolling.
BTW The navbar is not that big, it is just the animated gif on the navbar that is so big, I should change that!

So because of the frame I cannot use the full witdh of the screen, because if the page in the botom frame is to long it will generate a scrollbar, but not in the topframe, so the border of the toppage will be moree to te ricght as the border of the botompage and that is not nice.

Do you understand my problem?
If you think I could solve it by not using frames let me know
And if there is no good solution, then I leave it the way it is.
ronaldb66
07-30-2002, 09:39 AM
If you're fixed on using frames, you could envelop your whole content area in thin vertical left-n-right frames and a footer frame, and have those hold the graphic border. That way, it'll always fit the available space.
siflaar
07-30-2002, 09:54 AM
Hello Ronald,

Yes, this could be the solution
Thanks man
welo
07-30-2002, 05:46 PM
Originally posted by ronaldb66
If you're fixed on using frames, you could envelop your whole content area in thin vertical left-n-right frames and a footer frame, and have those hold the graphic border. That way, it'll always fit the available space.

That a pretty good idea. For awhile I was toying with setting a right margin in the top frame either through CSS or a clear.gif to make centered images align when the bottom frame contains a scrollbar. There really isn't a way to guarantee this would work to match up the images, however, because the various Windows themes change your scrollbar width and you never know what the person is using.
siflaar
08-04-2002, 08:29 PM
Hello Ronald,

I fixed the site with your suggestion and it works great
Thanks again
:thumbsup: :thumbsup: :thumbsup: :thumbsup: :D
ronaldb66
08-05-2002, 12:03 PM
Er... you're most welcome, of course, but when viewing the site you gave the URL from in your initial post, i can't really see it?
I suppose you didn't upload your new version yet, so this may all be mute, but i'd like to suggest a structure for your framesets and frames since the current definition in the top document on your site looks a bit quirky:
<frameset rows="120,*,40" ...>
<frame name="header" ...>
<frameset cols="40,*,40" ...>
<frame name="left" ...>
<frame name="content" ...>
<frame name ="right"...>
</frameset>
<frame name="footer" ...>
</frameset>
The triple dots mean "whatever else you want to specify".
In short, this defines a columns frameset consisting out of a header frame, another frameset and a footer frame; the inner frameset contains the left margin frame, the content frame and the right margin frame.
siflaar
08-05-2002, 01:19 PM
Hello Ronald,

I uploaded the new version already, but take a look here:

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<frameset rows="135,*" cols="*" framespacing="0" frameborder="NO" border="0">
<frame src="navbar.html" name="NAVframe" frameborder="no" scrolling="NO" noresize marginwidth="0" marginheight="0" id="NAVframe" >
<frameset rows="25,*,30" cols="*" framespacing="0" frameborder="NO" border="0">
<frame src="framesettop.html" name="TOPframe" frameborder="no" scrolling="NO" noresize marginwidth="0" marginheight="0" id="TOPframe" >
<frameset cols="30,*" framespacing="0" frameborder="NO" border="0">
<frame src="framesetleft.html" name="LEFTframe" frameborder="no" scrolling="NO" noresize marginwidth="0" marginheight="0" id="LEFTframe">
<frameset cols="*,30" framespacing="0" frameborder="NO" border="0">
<frame src="welkom.html" name="FrameText" frameborder="no" noresize marginwidth="0" marginheight="0" id="FrameText">
<frame src="framesetright.html" name="RIGHTframe" frameborder="no" scrolling="NO" noresize marginwidth="0" marginheight="0" id="RIGHTframe">
</frameset>
</frameset>
<frame src="framesetbottom.html" name="BOTTOMframe" frameborder="no" scrolling="NO" noresize marginwidth="0" marginheight="0" id="BOTTOMframe">
</frameset>
</frameset>
<noframes><body>

</body></noframes>
</html>

I used one extra frame (for navigation at the top) to get it as I realy wanted to be.:rolleyes: