[Last Call] Learn how to a build a cloud-first strategyRegister Now

x
?
Solved

Remove Vertical Scroll Bar from Home Page

Posted on 2007-07-28
16
Medium Priority
?
7,710 Views
Last Modified: 2008-01-09
I am creating a website for a customer and am having trouble with the vertical scrollbar.  Basically the home page is meant to fit inside a screen resolution of 1024x768 without any scroll bars.  The customer wants his homepage to have no scrollbars.  When I created and add the Flash Menu, I can't seem to figure out where I have gone wrong.

I keep getting the vertical scrollbar.  Only when I remove the entire Flash Menu Navigation do I get the desired effect.

Your help is greatly appreciated.

Here is the code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

<link href="../Styles/ccps.css" rel="stylesheet" type="text/css" />
<script src='../Scripts/ActiveContentDropDown.js' type='text/javascript'></script>

</head>


<body>
<table width="900" border="0" align="center">
  <tr>
    <td colspan="2" valign="top">
<!-- menu navigation settings (search engine friendly) -->
<!-- Change these links and press F12 to test -->
      <div id='menu' style='position:absolute; visibility:hidden;'>
                <div><a href='http://'>&lt;b&gt;About US&lt;/b&gt;</a></div>
        <div class='submenu'>
                <div><a href='http://' target='_blank'>Parent & Citizens</a></div>
                <div><a href='http://'>After School Care</a></div>
        </div>
        <div><a href='http://'>&lt;b&gt;School Information&lt;/b&gt;</a></div>
        <div class='submenu'>
                    <div><a href='http://' target='_blank'>Starting School</a></div>
                <div><a href='http://'>Procedures</a></div>
                        <div class='submenu'>
                      <div><a href='http://' target='_blank'>School Enrolments</a></div>
                <div><a href='http://' target='_blank'>School Forms</a></div>
              </div>
                <div><a href='http://' target='_blank'>Bike Policy</a></div>
                <div><a href='http://' target='_blank'>Uniform</a></div>
                <div><a href='http://' target='_blank'>Local High Schools</a></div>
                <div><a href='http://' target='_blank'>Staff Contacts</a></div>
        </div>  
            <div><a href='http://'>&lt;b&gt;Learning at CCPS&lt;/b&gt;</a></div>
            <div class='submenu'>
                <div><a href='http://'>Learning Areas</a></div>
                  <div class='submenu'>
                      <div><a href='http://' target='_blank'>Creative Arts</a></div>
                        <div><a href='http://' target='_blank'>English</a></div>
                <div><a href='http://' target='_blank'>HSIE</a></div>
                <div><a href='http://' target='_blank'>Mathematics</a></div>
                <div><a href='http://' target='_blank'>PDHPE</a></div>
                <div><a href='http://' target='_blank'>Science & Technology</a></div>
                <div><a href='http://'>Special Programs</a></div>
                      <div class='submenu'>
                    <div><a href='http://' target='_blank'>English as a Second Language ESL</a></div>
                    <div><a href='http://' target='_blank'>Environmental Educations</a></div>
                    <div><a href='http://' target='_blank'>Information Technology</a></div>
                    <div><a href='http://' target='_blank'>Learning Support</a></div>
                    </div>
                   <div><a href='http://' target='_blank'>Homework</a></div>
                </div>
            <div><a href='http://'>Classrooms</a></div>
                  <div class='submenu'>
                <div><a href='http://'>Early Stage 1</a></div>
                      <div class='submenu'>
                          <div><a href='http://' target='_blank'>KC</a></div>
                          <div><a href='http://' target='_blank'>KG</a></div>
                          <div><a href='http://' target='_blank'>KW</a></div>
                    </div>
                <div><a href='http://'>Stage 1</a></div>
                      <div class='submenu'>
                          <div><a href='http://' target='_blank'>1B</a></div>
                          <div><a href='http://' target='_blank'>1FW</a></div>
                          <div><a href='http://' target='_blank'>1R</a></div>
                          <div><a href='http://' target='_blank'>1/2W</a></div>
                          <div><a href='http://' target='_blank'>2M</a></div>
                          <div><a href='http://' target='_blank'>2K</a></div>
                    </div>
                     <div><a href='http://'>Stage 2</a></div>
                         <div class='submenu'>
                          <div><a href='http://' target='_blank'>3C</a></div>
                          <div><a href='http://' target='_blank'>3G</a></div>
                          <div><a href='http://' target='_blank'>4B</a></div>
                          <div><a href='http://' target='_blank'>4H</a></div>
                         </div>
                    <div><a href='http://'>Stage 3</a></div>
                         <div class='submenu'>
                        <div><a href='http://' target='_blank'>5J</a></div>
                        <div><a href='http://' target='_blank'>6A</a></div>
                  </div>
                </div>
                     <div><a href='http://' target='_blank'>Library</a></div>
                       <div><a href='http://' target='_blank'>Performing Arts</a></div>
                       <div><a href='http://' target='_blank'>Out of School Hours Activites</a></div>
                       <div><a href='http://' target='_blank'>Assessment & Reporting</a></div>
            </div>
        <div><a href='http://'>&lt;b&gt;Newsletters&lt;/b&gt;</a></div>
        <div><a href='http://'>&lt;b&gt;Online Calendar&lt;/b&gt;</a></div>
        <div ><a href='http://www.google.com/search?sitesearch=castlecove-p.schools.nsw.edu.au%26q=' target='_blank'>&lt;b&gt;Search&lt;/b&gt;</a></div>
      </div>
      <div id="f-source-menu" style="position:relative;">
        <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="650" height="48">
          <param name="flash_component" value="VistaDDMenuFull.swc" />
          <param name="movie" value="../CCPSFlashMenu.swf" />
          <param name="quality" value="high" />
          <param name="FlashVars" value=
"flashlet={_subButtonTextColor:#00FFFF,_subMenuColor:#1E1E1E,_removeSubDelay:500,_mainButtonHeight:26,showSearchField:true,searchFieldWidth:143,_subHighlightColor:#FF0000,searchTextColor:#000000,mainSoundURL:'None',_subFont:'Trebuchet MS',_subButtonHeight:23,_menuColor:#131313,clickSoundURL:'None',_mainButtonTextColor:#FFFF00,stretch_width_to:'0px',_mainFontSize:12,subSoundURL:'None',_subHlTransparency:50,bg_Pic_URL:'None',_minSubWidth:60,_mainFont:'Arial',_mainButWidthExt:22,_mainHighlightColor:#FF0000,xml_Path:'None',_subFontSize:11,searchFieldColor:#FFFFFF}" />
        </object>
<script type="text/javascript">var connected; if (connected){ Run_f_source_menu() }else{ alert("The page is not connected with script file ActiveContentDropDown.js") };function JSF(url){alert("javascript: "+url);}</script>
      </div>
      <!-- End of Navigation menu code --></td>
  </tr>
  <tr>
        <td width="175" valign="top" background="../TableBorders/HmColorBg.gif" class="standard">&nbsp;</td>
    <td width="715" height="225" align="left" valign="top" bgcolor="#FFF7DE"><table width="715" height="117" cellpadding="0" cellspacing="0">
      <tr>
        <td height="18" colspan="3" valign="top"><img src="../TableBorders/subContentTop.gif" width="715" height="34" /></td>
        </tr>
      <tr>
        <td width="18" valign="top"><img src="../TableBorders/subContentLeft.gif" width="28" height="389" /></td>
        <td width="658" valign="top" class="tabletext"><p style="margin-left:10px; margin-top:10px; margin-right:10px; margin-bottom:10px">This is a test clip</p></td>
        <td width="25" valign="top"><img src="../TableBorders/subContentRight.gif" width="30" height="389" /></td>
      </tr>
      <tr>
        <td colspan="3"><img src="../TableBorders/subContentBtm.gif" width="715" height="34" /></td>
        </tr>
    </table></td>
  </tr>
</table>

</body>
</html>
0
Comment
Question by:Worldsplayground
  • 7
  • 5
  • 2
  • +2
16 Comments
 
LVL 49

Expert Comment

by:Roonaan
ID: 19584724
What is your customers requirement in the following situations:
- The user has google toolbar and/or other toolbars installed
- The user is not viewing your website fullscreen
- The user turns on/off the status and/or toolbar

-r-
0
 
LVL 12

Expert Comment

by:oceanbeach
ID: 19584788
Hello Worldsplayground,

If you want to make sure the scrollbars never appear, you can use overflow:hidden style on the body tag.  However, this will 'cutoff' any content that does not appear on the screen.

I hope this helps!

oceanbeach
0
 

Author Comment

by:Worldsplayground
ID: 19584915
Hi guys,
Roonaan: In answer to your question, what they want is to have no scroll bars on the home page.  At the moment, regardless of what toolbars are being displayed, there is just an endless amount of black space below the end of their advertisement.  So when a user enters the page, if they scroll there is nothing but black space (which is the background color).  There is little going on the in the HOMEPAGE for there to even be vertical scrollbar.

Oceanbeach: I tried the code overflow:hidden however the scrollbar still exists.
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
LVL 12

Expert Comment

by:oceanbeach
ID: 19585136
Hi Worldsplayground,

How about trying...

html, body { height: 100%; width: 100%; overflow: hidden; }

-OB
0
 
LVL 12

Expert Comment

by:Sinoj Sebastian
ID: 19585358
Worldsplayground,
 Page code you have given, may not be useful without css and js files. Its better to give url than page code. If you don't mind, let me have the url.
0
 

Author Comment

by:Worldsplayground
ID: 19586814
Hi OceanBeach,
Tried that code and it still didn't work.  It is as if it disregards any overflow command.
0
 

Author Comment

by:Worldsplayground
ID: 19586819
Hi Sinoj,
As requested here is a testpage URL link to the homepage I am writing.
I have also noticed, that upon uploading the pages, the FlashMENU search field keeps flashing on and off.  That is weird because it doesn't do it when I debug it off my PC.

The URL is http://www.worldsplayground.com/TESTPAGE/index.htm
0
 
LVL 16

Expert Comment

by:OliWarner
ID: 19587342
Your scripting on that page for the marquee uses an obscene amount of CPU! 20% of a very powerful computer... It drops off to 0% when you hover over the text and it stops scrolling so you might want to have a look at alternative methods of scrolling the text.

But I can't see a scrollbar on Firefox 2 or IE7.
0
 

Author Comment

by:Worldsplayground
ID: 19587354
OliWarner,
I tried it out on my CPU and it is only running on 1%, I don't get a 20% usage as yours.
Nonetheless, the I am still able to see the scrollbars on IE7 and now more importantly part of the navigation seems to fade out, unless you place your mouse over the right end of ONLINE CALENDAR.

I am so confused.
0
 
LVL 12

Expert Comment

by:Sinoj Sebastian
ID: 19587716
Your HTML menu is making problems. Use noscript tag.
****************************************
      <!-- menu navigation settings (search engine friendly) -->
      <!-- Change these links and press F12 to test -->
<noscript>
      <div id="menu" style="position: absolute; visibility: hidden;">
                <div><a href="http:///">&lt;b&gt;About US&lt;/b&gt;</a></div>
        <div class="submenu">
                <div><a href="http:///" target="_blank">Parent &amp; Citizens</a></div>
                <div><a href="http:///">After School Care</a></div>
        </div>
        <div><a href="http:///">&lt;b&gt;School Information&lt;/b&gt;</a></div>
        <div class="submenu">
                    <div><a href="http:///" target="_blank">Starting School</a></div>
                <div><a href="http:///">Procedures</a></div>
                        <div class="submenu">
                      <div><a href="http:///" target="_blank">School Enrolments</a></div>
                <div><a href="http:///" target="_blank">School Forms</a></div>
              </div>
                <div><a href="http:///" target="_blank">Bike Policy</a></div>
                <div><a href="http:///" target="_blank">Uniform</a></div>
                <div><a href="http:///" target="_blank">Local High Schools</a></div>
                <div><a href="http:///" target="_blank">Staff Contacts</a></div>
        </div>  
            <div><a href="http:///">&lt;b&gt;Learning at CCPS&lt;/b&gt;</a></div>
            <div class="submenu">
                <div><a href="http:///">Learning Areas</a></div>
                  <div class="submenu">
                      <div><a href="http:///" target="_blank">Creative Arts</a></div>
                        <div><a href="http:///" target="_blank">English</a></div>
                <div><a href="http:///" target="_blank">HSIE</a></div>
                <div><a href="http:///" target="_blank">Mathematics</a></div>
                <div><a href="http:///" target="_blank">PDHPE</a></div>
                <div><a href="http:///" target="_blank">Science &amp; Technology</a></div>
                <div><a href="http:///">Special Programs</a></div>
                      <div class="submenu">
                    <div><a href="http:///" target="_blank">English as a Second Language ESL</a></div>
                    <div><a href="http:///" target="_blank">Environmental Educations</a></div>
                    <div><a href="http:///" target="_blank">Information Technology</a></div>
                    <div><a href="http:///" target="_blank">Learning Support</a></div>
                    </div>
                   <div><a href="http:///" target="_blank">Homework</a></div>
                </div>
            <div><a href="http:///">Classrooms</a></div>
                  <div class="submenu">
                <div><a href="http:///">Early Stage 1</a></div>
                      <div class="submenu">
                          <div><a href="http:///" target="_blank">KC</a></div>
                          <div><a href="http:///" target="_blank">KG</a></div>
                          <div><a href="http:///" target="_blank">KW</a></div>
                    </div>
                <div><a href="http:///">Stage 1</a></div>
                      <div class="submenu">
                          <div><a href="http:///" target="_blank">1B</a></div>
                          <div><a href="http:///" target="_blank">1FW</a></div>
                          <div><a href="http:///" target="_blank">1R</a></div>
                          <div><a href="http:///" target="_blank">1/2W</a></div>
                          <div><a href="http:///" target="_blank">2M</a></div>
                          <div><a href="http:///" target="_blank">2K</a></div>
                    </div>
                     <div><a href="http:///">Stage 2</a></div>
                         <div class="submenu">
                          <div><a href="http:///" target="_blank">3C</a></div>
                          <div><a href="http:///" target="_blank">3G</a></div>
                          <div><a href="http:///" target="_blank">4B</a></div>
                          <div><a href="http:///" target="_blank">4H</a></div>
                         </div>
                    <div><a href="http:///">Stage 3</a></div>
                         <div class="submenu">
                        <div><a href="http:///" target="_blank">5J</a></div>
                        <div><a href="http:///" target="_blank">6A</a></div>
                  </div>
                </div>
                     <div><a href="http:///" target="_blank">Library</a></div>
                       <div><a href="http:///" target="_blank">Performing Arts</a></div>
                       <div><a href="http:///" target="_blank">Out of School Hours Activites</a></div>
                       <div><a href="http:///" target="_blank">Assessment &amp; Reporting</a></div>
            </div>
        <div><a href="http:///">&lt;b&gt;Newsletters&lt;/b&gt;</a></div>
        <div><a href="http:///">&lt;b&gt;Online Calendar&lt;/b&gt;</a></div>
        <div><a href="http://www.google.com/search?sitesearch=castlecove-p.schools.nsw.edu.au%26q=" target="_blank">&lt;b&gt;Search&lt;/b&gt;</a></div>
      </div>
</noscript>
*************************************************
0
 

Author Comment

by:Worldsplayground
ID: 19587731
Hi Sinoj,
The HTML menu is part of the FLASH Menu, by adding and closing the script with the <noscript> tag, the navigational menu doesn't exist than.
You can view it at the same location http://www.worldsplayground.com/TESTPAGE/index.htm.

I can't seem to work it out either.
0
 
LVL 12

Expert Comment

by:Sinoj Sebastian
ID: 19587772
Hi Worldsplayground,
Try this
<div id='menu' style='position:absolute; display:none'>
0
 
LVL 12

Accepted Solution

by:
Sinoj Sebastian earned 2000 total points
ID: 19587785
also find
width="650"
and change it to
width="900"
in your code.

I hope that help.
0
 

Author Comment

by:Worldsplayground
ID: 19587790
Hi Sinoj,
That worked.  You deserve a whole lot more than 500 points.  I am with total awe and appreciation for the effort and perserverance you guys place in helping almost complete strangers.  That so worked.  One little word can make such a big difference.

Since we have placed that display:none command, the end part of the FLASH navigation disappears unless you place the mouse over it.  Is there a way of fixing that.

Thanks Sinoj.
0
 
LVL 12

Expert Comment

by:Sinoj Sebastian
ID: 19587799
>>Since we have placed that display:none command, the end part of the FLASH navigation disappears unless you place the mouse over it.  Is there a way of fixing that.

You have to set the width of the the menu flash object to "900px"
0
 

Author Comment

by:Worldsplayground
ID: 19587824
Hi Sinoj,

I worked that one out, thanks again for your help.
0

Featured Post

Upgrade your Question Security!

Add Premium security features to your question to ensure its privacy or anonymity. Learn more about your ability to control Question Security today.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

There’s a good reason for why it’s called a homepage – it closely resembles that of a physical house and the only real difference is that it’s online. Your website’s homepage is where people come to visit you. It’s the family room of your website wh…
Strategic internal linking is often considered an SEO power technique, especially for content marketing. Do you need to hire an SEO agency to optimize you internal linking? No, this article will help you understand the basics of internal linking and…
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.
The is a quite short video tutorial. In this video, I'm going to show you how to create self-host WordPress blog with free hosting service.
Suggested Courses

830 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question