Connecting Tech Pros Worldwide Help | Site Map

no scrollbars in div (firefox)

juergen.riemer@gmail.com
Guest
 
Posts: n/a
#1: May 16 '07
Hi,

following code does not render scrollbars in firefox 1.5.x. Bug?
Workaround other than to innerHTML an absolute positioned element
after loading?


<html>
<body>
<div style='width:100px;height:100px;position:absolute; border:1px
solid black;overflow:auto'>
<div id='test' style="position:absolute;top:0px;left:30px">X</div>
</div>
<script>
onload = function(){
document.getElementById('test').style.left = "115px"
}
</script>
</body>
</html>

juergen.riemer@gmail.com
Guest
 
Posts: n/a
#2: May 23 '07

re: no scrollbars in div (firefox)


*bump*
still looking for a nifty solution..

On May 16, 2:08 pm, juergen.rie...@gmail.com wrote:
Quote:
Hi,
>
following code does not render scrollbars in firefox 1.5.x. Bug?
Workaround other than to innerHTML an absolute positioned element
after loading?
>
<html>
<body>
<div style='width:100px;height:100px;position:absolute; border:1px
solid black;overflow:auto'>
<div id='test' style="position:absolute;top:0px;left:30px">X</div>
</div>
<script>
onload = function(){
document.getElementById('test').style.left = "115px"}
>
</script>
</body>
</html>

Jim Carlock
Guest
 
Posts: n/a
#3: May 23 '07

re: no scrollbars in div (firefox)


On May 16, 2:08 pm, juergen wrote:
Quote:
following code does not render scrollbars in firefox 1.5.x. Bug?
Workaround other than to innerHTML an absolute positioned element
after loading?
<juergen.riemer@gmail.comwrote:: *bump*
: still looking for a nifty solution..

You might want to identify things like your DOCTYPE, and the type
of script you're trying to run, then not use function as a function name
(I believe it's a reserved word (?))... Anyways, the following works
in Opera, and may work in some Mozilla browsers.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
<title>Testing JavaScript</title>
</head>
<body>
<div style='width:100px;height:100px;position:absolute; border:1px solid black;overflow:auto'>
<div id='test' style="position:absolute;top:0px;left:30px;">X</div>
</div>
<script type="text/javascript">
onload = callMe();
function callMe() { document.getElementById('test').style.left = "115px"; }
</script>
</body></html>

I'm not sure scrollbars are a part of the <divobject models in
js. Perhaps someone else can help.

http://www.w3schools.com/js/js_obj_htmldom.asp

Scroll down to scrollbars and take a look at the browsers
that support scrollbars for Window objects...
http://www.w3schools.com/htmldom/dom_obj_window.asp

--
Jim Carlock
Post replies to the group.


dd
Guest
 
Posts: n/a
#4: May 24 '07

re: no scrollbars in div (firefox)


On May 23, 6:38 pm, "Jim Carlock" <anonym...@127.0.0.1wrote:
Quote:
then not use function as a function name
He wasn't. He was using an anonymous function.
Quote:
onload = callMe();
Bad code, naughty code !
Quote:
function callMe() { document.getElementById('test').style.left = "115px"; }
Non-defensive code just waiting to cause a JS error when 'test'
doesn't exist.


dd
Guest
 
Posts: n/a
#5: May 24 '07

re: no scrollbars in div (firefox)


On May 16, 2:08 pm, juergen.rie...@gmail.com wrote:
Quote:
following code does not render scrollbars in firefox 1.5.x. Bug?
Workaround other than to innerHTML an absolute positioned element
after loading?
That's what I do and it's reliably calculated the scrollbar size on
NS6,7,8,FF etc. Try this (which declares a global called
ScrollbarOffset):

window.onload=function(){
var outerdiv=document.createElement("div");
outerdiv.style.position="absolute";
outerdiv.style.top="0px";
outerdiv.style.left="0px";
outerdiv.style.width="50px";
outerdiv.style.height="50px";
outerdiv.style.overflow="hidden";
var innerdiv=document.createElement("div");
innerdiv.style.width="100%";
innerdiv.style.height="60px";
outerdiv.appendChild(innerdiv);
document.body.appendChild(outerdiv);
var noscrolloffset=innerdiv.offsetWidth;
outerdiv.style.overflow="auto";
var withscrolloffset=innerdiv.offsetWidth;
document.body.removeChild(document.body.lastChild) ;
ScrollbarOffset=noscrolloffset-withscrolloffset;
}

dd
Guest
 
Posts: n/a
#6: May 29 '07

re: no scrollbars in div (firefox)


On May 24, 10:57 am, dd <dd4...@gmail.comwrote:
Quote:
NS6,7,8,FF etc. Try this (which declares a global called
ScrollbarOffset):
>
window.onload=function(){
var outerdiv=document.createElement("div");
outerdiv.style.position="absolute";
outerdiv.style.top="0px";
outerdiv.style.left="0px";
outerdiv.style.width="50px";
outerdiv.style.height="50px";
outerdiv.style.overflow="hidden";
var innerdiv=document.createElement("div");
innerdiv.style.width="100%";
innerdiv.style.height="60px";
outerdiv.appendChild(innerdiv);
document.body.appendChild(outerdiv);
var noscrolloffset=innerdiv.offsetWidth;
outerdiv.style.overflow="auto";
var withscrolloffset=innerdiv.offsetWidth;
document.body.removeChild(document.body.lastChild) ;
ScrollbarOffset=noscrolloffset-withscrolloffset;
FYI to the people who manage the FAQ at jibbering.com, re: item # 4.9
- that example code isn't taking the scrollbars for Gecko browsers
into account. This code above calculates the scrollbar size (which
varies from 15 to 19 pixels).

Closed Thread