Solved: Moving Sidebar?

Status
This thread has been Locked and is not open to further replies. Please start a New Thread if you're having a similar issue. View our Welcome Guide to learn how to use this site.

Tanis

Shane
Thread Starter
Joined
May 29, 2006
Messages
3,969
I am putting together some training material in .html at our customers request. My html knowledge is quite limited having only done a 2 day intro course to Dreamweaver CS5 (did some basic html programming many years ago).

The setup they want is a simple sidebar for navigation with the main information being in the div content area of each page. The pages themselves are likely to be fairly long in some cases which the customer isn't concerned about, however they have asked that the unordered list items in the sidebar move down as you scroll down the page, basically so the sidebar stays visible on the page regardless where the user scrolls to.... hope that makes sense haha.

However, if this is possible I have no idea how to do so am asking if anyone on here can help me out.

Another significant limitation is that the resultant html must be fully compatible with Internet Explorer 6! (veryold etc. I know, don't even go there haha).

Any help or pointers very much appreciated, even if someone says 'it can't be one' thats not ideal but if it is the case so be it.

Edit: I should point out I am using an external CSS for overall formatting, so if it can be done using that it would be ideal.
 

DrP

Joined
Jul 23, 2005
Messages
739
Was going to try and help but then saw the IE6 gag! Ha ha!

Seriously, though - have you tried giving the sidebar the CSS attribute position:fixed?
 

Tanis

Shane
Thread Starter
Joined
May 29, 2006
Messages
3,969
Going to be having a play around with it today so ill have a look at that.

Yea, making it IE6 compatible is limiting possibilities to say the least, it will only be accessible on the customers closed work network an they have never upgraded that as there has never been a need. The network is never, and never will be, connected to the internet in any way, shape or form.
 
Joined
Jan 10, 2006
Messages
120
Hi,

Try this. It should work regardless of browser version. I believe MSIE 6+ supports css 2.0. Put the navigation list inside a div block, then set its css position property to fixed. It can take the structure below:

HTML:
<!... this should be inside the external css file ..>
div#navblock{
  position: fixed;
  left: /* set this one d way it will appear on the site  */
  top: /* set this one d way it will appear on the site */
}

<!... this should be inside the html blocks ..>

<div id='navblock'>
 <ul>
   <li>Link 1</li>
   <li>Link 2</li>
 </ul>
</div>
 

Tanis

Shane
Thread Starter
Joined
May 29, 2006
Messages
3,969
Hi, many thanks for the replies so far, this is pretty new to me so a steep learning curve :)
This is what I have at the moment:

HTML:
<...inside html block...>
<div class="sidebar1">
    <ul class="nav">
          <li>link</li>
          <li>link</li>
    </ul>
</div>

<...inside external css...>
.sidebar1 {
    position: fixed;
    background-image: url ...
    background-repeat: repeat-y;
    width: 185px;
    float: left;
What I am assuming, from what has been said, is that I am missing a seperate div ID that the sidebar ul elements need to sit inside, then apply the class attributes to that specific div tag?

Edit: According to this site (http://www.webdevout.net/browser-support-css) IE6 does not support the 'fixed' position in CSS! So I may not be able to do this at all.
 
Joined
Jan 10, 2006
Messages
120
Ok. I had fears for this during the last post but all hope isn't lost. MSIE should support frames. So, I suggest you use frames for the task.
 

Tanis

Shane
Thread Starter
Joined
May 29, 2006
Messages
3,969
Now theres an idea, think I will leave that for the next iteration of the document though as I need to get the content finished and am running out of time haha. I hadn't even thought about using frames (does anyone use frames anymore :) ), I used to do a bit of that when I was teaching myself basic html many years ago using Notepad.
 
Status
This thread has been Locked and is not open to further replies. Please start a New Thread if you're having a similar issue. View our Welcome Guide to learn how to use this site.

Users Who Are Viewing This Thread (Users: 0, Guests: 1)

As Seen On
As Seen On...

Welcome to Tech Support Guy!

Are you looking for the solution to your computer problem? Join our site today to ask your question. This site is completely free -- paid for by advertisers and donations.

If you're not already familiar with forums, watch our Welcome Guide to get started.

Join over 807,865 other people just like you!

Latest posts

Top