Closed Bug 271843 Opened 20 years ago Closed 19 years ago

A Firefox vertical scrollbar is not removed when the page's contents is reduced to fit inside the window

Categories

(Firefox :: General, defect)

Product:
Firefox
Component:
General
Platform:
x86
All
Type:
defect
Priority:
Not set
Severity:
normal

Tracking

()

Status:
RESOLVED WORKSFORME

People

(Reporter: mail, Assigned: bugzilla)

Details

Attachments

(3 files, 1 obsolete file)

1x1 dot transparent gif for test case
42 bytes, image/gif
Details
1x1 dot black gif for test case
34 bytes, image/gif
Details
Test case using local gifs
5.70 KB, text/html
Details 
User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.5) Gecko/20041107 Firefox/1.0
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.5) Gecko/20041107 Firefox/1.0

I will create an attachment with a test case which also demonstrates a work-around.

Reproducible: Always
Steps to Reproduce:
1.Load the test case into a window at least 650x650 pixels.
2.Decrease and increase the window hight and notice the vertical scrollbar
behaviour.
3.Test again with the work-around partly (doesn't help) or fully (ok) enabled.

Actual Results:  
The vertical scrollbar remains although the page's contents is adjusted to fit
inside the window

Expected Results:  
Removed the scrollbar as in Navigator, Opera and Internet Explorer

    
    

    
  


  

    
    

    
  
Comment on attachment 167106 [details]
Test case for scrollbar mis-behaviour, includes work-around

><HTML><HEAD><TITLE>Resize Test</TITLE>
>
>
><STYLE type="text/css">
>body {background-color: #fcfff0; margin: 0; padding: 0;}
>table#mainTable {background-color: #e4f0d0;}
></STYLE>
>
><SCRIPT language="javascript">
>var ORs = 0, offset = 0, adjust, setHeight;
>var resized, width, height, imgOffset, imgHeight, heightImg, bodyElement, CB1, CB2;
>var ie = navigator.appName=='Microsoft Internet Explorer' &amp;&amp; document.styleSheets;
>  // Opera 5.5 responds 'Microsoft Internet Explorer' to appName but false to document.styleSheets
>
>function init() {
>  resized = document.getElementById('resized');
>  width = document.getElementById('width');
>  height = document.getElementById('height');
>  imgOffset = document.getElementById('imgOffset');
>  imgHeight = document.getElementById('imgHeight');
>  heightImg = document.getElementById('heightImg');
>  bodyElement = document.getElementById('bodyElement');
>  CB1 = document.getElementById('CB1');
>  CB2 = document.getElementById('CB2');
>  adjust = parseInt(document.getElementById('mainTable').cellPadding);
>  if (ie) adjust -= 10; // it works also fine with a negative value when cell padding &lt; 10
>    // It is not explored in details what happens in IE making it preferable to decrease adjust by 10,
>    // but it goes more or less like this: IE paints a 10 pixel stripe in the body background color
>    // below the table. But it allows us to reduce the page height past this stripe without inserting
>    // a scrollbar, thus allowing us to paint the table background color to the bottom of the window.
>    //
>    // Further adjustment may be needed for Opera 5.5 and Netscape 7.1, depending on &lt;body&gt; margin
>    // and padding settings, this is done after the first resize().
>  var obj = heightImg;
>  do {
>    offset += obj.offsetTop;
>    obj = obj.offsetParent;
>  } while(obj);
>  // Notice! It is in general not safe to calculate the offset once and then update parts of the
>  // text. But it works in this test page, provided constant font size. Requires fixed text width.
>  resize();
>  if (!ie &amp;&amp; setHeight&gt;0 &amp;&amp; document.documentElement.scrollHeight &gt; bodyElement.clientHeight) {
>    // further adjustment for Opera 5.5, Navigator 7.1, and whichever browser needing it
>    adjust += (document.documentElement.scrollHeight - bodyElement.clientHeight);
>    resize(); // again
>  } // if (!ie &amp;&amp; ...
>  imgOffset.innerHTML = offset;
>  document.getElementById('adjust').innerHTML = adjust;
>  setDot(document.getElementById('dotCB')); // in case we reload in IE with dotCB checked
>} // function init()
>
>function resize() {
>  setHeight = bodyElement.clientHeight - (offset+adjust);
>  if (setHeight&lt;0) setHeight = 0;
>  resized.innerHTML = ORs++;
>  width.innerHTML = bodyElement.clientWidth;
>  height.innerHTML = bodyElement.clientHeight;
>  imgHeight.innerHTML = setHeight;
>  heightImg.height = setHeight;
>  if (CB1.checked) var temp = heightImg.height; // read back into variable
>  if (CB2.checked) imgOffset.innerHTML = offset; // asign a value to an innerHTML property
>  window.focus(); // blur checkboxes
>} // function resize()
>
>function setDot(cb) {
>  heightImg.src = 'https://bugzilla.mozilla.org/attachment.cgi?id=16717' + (cb.checked ? '4' : '3') + '&action=view';
>  cb.blur();
>} // function setDot()
></SCRIPT></HEAD>
><BODY onresize="resize()" onload="init()" id="bodyElement">
><DIV align="center">
><TABLE width="600" cellspacing="0" cellpadding="10" border="0" id="mainTable"><TBODY><TR><TD>
><P><B>Statistics:</B></P>
><P>OnResize triggered <SPAN id="resized">0</SPAN> times, client width = <SPAN id="width">625</SPAN> 
>pixels (possibly assigned while there was a scrollbar), client height = <SPAN id="height">400</SPAN> pixels 
>(may lock in Firefox, then reload), image offset = <SPAN id="imgOffset">630</SPAN> 
>pixels, adjust = <SPAN id="adjust">10</SPAN> pixels, image height = <SPAN id="imgHeight">0</SPAN> pixels.</P>
><P><B>Explanation:</B></P>
><P>The 600 pixel wide central table has a background color different then the page's 
>background color. The height of an IMG element below the text adjusts dymanically the table 
>to fill the height of the window and thus extending the table color to the bottom of the 
>window. (Firefox and IE support setting table height=100%, but not Navigator and Opera.)</P>
><P>Notice! Reload the page after a font size change.</P>
><P>The case works fine in IE and Opera, and fair in Navigator 7.1 (continually 
>triggering OnResize would improve).</P>
><P>In Firefox, the page gets a vertical scrollbar if the height is reduced  because 
>it doesn't fire the OnReize event continually. It fires when the button is released, 
>and the height of the page is then adjusted to fit the new window. However, the scrollbar 
>remains on the page.</P>
><P>The scrollbar disappears if the window width is changed.</P>
><P style="margin-bottom: 0pt;">The scrollbar can be removed in the resize function with the 
>combination of:</P>
><OL style="margin-top: 0pt; margin-bottom: 0pt;">
>  <LI>Read the height of the IMG element into a variable after it was set (<INPUT type="checkbox" value="ON" id="CB1"/> enabled).</LI>
>  <LI>Assign a string to an element's innerHTML property (<INPUT type="checkbox" value="ON" id="CB2"/> enabled).</LI>
></OL>
><P style="margin-top: 0pt;">This can be performed in a single JavaScript statement:<BR/>
>        imgHeight.innerHTML = heightImg.height;<BR/>
>- That was what revealed this work-around, how lucky!</P>
><P><INPUT type="checkbox" value="ON" onclick="setDot(this)" id="dotCB"/> Use black rather than transparent IMG dot.</P>
><img id="heightImg" src="https://bugzilla.mozilla.org/attachment.cgi?id=167173&action=view" width="1" alt="Transparent (or black) dot" height="0">
></TD></TR></TBODY></TABLE>
></DIV>
></BODY></HTML>

    
    

    
  


  
Sorry for attachment #4 [details] [diff] [review], misunderstood the "Edit" facility for attachment #1 [details] [diff] [review],
can #4 be deleted?

        Attachment #167106 -
        Attachment is obsolete: true

    
    

    
  
We just encountered this bug as well while trying to resize an IFRAME to it's
contents. The IFRAME will grow bigger but never smaller.

    
    

    
  
This is an automated message, with ID "auto-resolve01".

This bug has had no comments for a long time. Statistically, we have found that
bug reports that have not been confirmed by a second user after three months are
highly unlikely to be the source of a fix to the code.

While your input is very important to us, our resources are limited and so we
are asking for your help in focussing our efforts. If you can still reproduce
this problem in the latest version of the product (see below for how to obtain a
copy) or, for feature requests, if it's not present in the latest version and
you still believe we should implement it, please visit the URL of this bug
(given at the top of this mail) and add a comment to that effect, giving more
reproduction information if you have it.

If it is not a problem any longer, you need take no action. If this bug is not
changed in any way in the next two weeks, it will be automatically resolved.
Thank you for your help in this matter.

The latest beta releases can be obtained from:
Firefox:     http://www.mozilla.org/projects/firefox/
Thunderbird: http://www.mozilla.org/products/thunderbird/releases/1.5beta1.html
Seamonkey:   http://www.mozilla.org/projects/seamonkey/


    
    

    
  
This bug is present in Firefox 1.04 - 1.07, however, it is _not_ present in
Firefox 1.5 Beta 1.

The text in my test case states that the bug is not present in Netscape 7.1,
however, it _is_ present in Netscape 8.0.3.3.

    
    

    
  
To be more precise about Netscape 8.0.3.3 behaviour: The bug is present when
"Display Like" is set to Firefox, but not when it is set to Internet Explorer.

    
    

    
  
I can confirm that this bug seems to be fixed in Firefox 1.5 Beta 1 on linux.

    
    

    
  
Worksforme from reporter and another user.
Status: UNCONFIRMED → RESOLVED
Closed: 19 years ago
Resolution: --- → WORKSFORME

          You need to log in
          before you can comment on or make changes to this bug.
        






  

    
  







  

    

      
Attachment

      

      
      
      
      
    

    

      

        

          

            
General

            

              Creator: 



            

            
Created: 

            
Updated: 

            
Size: