Results 1 to 9 of 9
  1. #1
    Uranium Lounger CWBillow's Avatar
    Join Date
    Jul 2002
    Location
    Las Vegas, NV USA
    Posts
    6,371
    Thanks
    78
    Thanked 12 Times in 11 Posts

    Navigational bars

    I'm just putting together a site (for my daughter).

    With a little help (make that BIG help) from those here, I've gotten it workable. (See http://ImOnIt.us )

    It has been suggested that I could use a navigation bar at the top of the page, via CSS. I think that's a swell idea, and the use of CSS saves me from learning frames right at this moment). I was given a sample (attached) and I tried to to look at color adjustments, but I lost myself.... Then I'd be able to pick "key item categories", which would allow for building on the menus as need dictates. I was going to, maybe, deepen the yellow (a skosh ) and adjust the selected item color accordingly ( for visibility, maybe to deep red?).

    This also would explicitly raise the question of using CSS, because I would then put the menus to show every page, without actually having to code each separately.

    But I am *totally* a babe in the woods with CSS. Any idea how the attached would be modified to adopt the above changes? And then, how would I make this an external sheet and attach it to each sheet, thereby allowing for one change to affect all the pages?

    Regards,
    Chuck Billow
    Attached Files Attached Files
    -------------------------------------------------
    "Good judgment comes from experience, and experience - well, that comes from poor judgment."

    ~ A(lan) A(lexander) Milne (1882-1956)- "House at Pooh Corner"

  2. #2
    Platinum Lounger
    Join Date
    Feb 2002
    Location
    A Magic Forest in Deepest, Darkest Kent
    Posts
    5,681
    Thanks
    0
    Thanked 1 Time in 1 Post

    Re: Navigational bars

    I will post the image first ....
    Jerry

  3. #3
    Platinum Lounger
    Join Date
    Feb 2002
    Location
    A Magic Forest in Deepest, Darkest Kent
    Posts
    5,681
    Thanks
    0
    Thanked 1 Time in 1 Post

    Re: Navigational bars

    ....and the code second.

    In this part of the post I have created a couple of extra styles header and adjusted the colours to be a bright yellow and a hover of red with white text to give a bright contrast.

    The header style has been placed in the code to allow a nice section to place the page name. I have made it the same colour as the backgroud of the "bars" so that it blends.
    Jerry

  4. #4
    Platinum Lounger
    Join Date
    Feb 2002
    Location
    A Magic Forest in Deepest, Darkest Kent
    Posts
    5,681
    Thanks
    0
    Thanked 1 Time in 1 Post

    Re: Navigational bars

    <P ID="edit" class=small>(Edited by Jezza on 22-Oct-06 19:52. To change link to a better page)</P>In addition have a look at this link that will give you the hexadecimal values of the colours used so we can get away from talking about what "Bright Yellow " and "Not so bright yellow" <img src=/S/grin.gif border=0 alt=grin width=15 height=15>

    Hexadec colour codes

    BTW <img src=/S/whisper.gif border=0 alt=whisper width=29 height=17>What is skosh?
    Jerry

  5. #5
    Uranium Lounger CWBillow's Avatar
    Join Date
    Jul 2002
    Location
    Las Vegas, NV USA
    Posts
    6,371
    Thanks
    78
    Thanked 12 Times in 11 Posts

    Re: Navigational bars

    Jerry:

    I'll bookmark the link...

    >>
    Dictionary.com Unabridged (v 1.0.1) - Cite This Source
    skosh /sko??/ Pronunciation Key - Show Spelled Pronunciation[skohsh] Pronunciation Key - Show IPA Pronunciation
    -------------------------------------------------
    "Good judgment comes from experience, and experience - well, that comes from poor judgment."

    ~ A(lan) A(lexander) Milne (1882-1956)- "House at Pooh Corner"

  6. #6
    Uranium Lounger CWBillow's Avatar
    Join Date
    Jul 2002
    Location
    Las Vegas, NV USA
    Posts
    6,371
    Thanks
    78
    Thanked 12 Times in 11 Posts

    Re: Navigational bars

    Jerry:

    I've d/l both files... that looks like it would be great...

    I'll look at the code, and be back...

    Thanks,
    Chuck
    -------------------------------------------------
    "Good judgment comes from experience, and experience - well, that comes from poor judgment."

    ~ A(lan) A(lexander) Milne (1882-1956)- "House at Pooh Corner"

  7. #7
    Uranium Lounger CWBillow's Avatar
    Join Date
    Jul 2002
    Location
    Las Vegas, NV USA
    Posts
    6,371
    Thanks
    78
    Thanked 12 Times in 11 Posts

    Re: Navigational bars

    Jerry:

    This is looking great!

    I see where the actual menu text starts, and am understanding how that works... pretty much. But: Assume for the sake of this exercise that my menu is 10 items across.

    Can it be made to scroll? If yes, how? If no (an even if yes) what would the format be if I wanted to have these be drop-down menus, so that I could set up "major categories", and then just add items as they are created?

    And "lastly": How can I make all this into a stand-alone (CSS?) so that I could then just reference it from a page? Obviously then I'd have to make just one set of changes...

    BTW, have I thanked you for the help? You also do fabulous work.

    Regards,
    Chuck
    -------------------------------------------------
    "Good judgment comes from experience, and experience - well, that comes from poor judgment."

    ~ A(lan) A(lexander) Milne (1882-1956)- "House at Pooh Corner"

  8. #8
    Platinum Lounger
    Join Date
    Feb 2002
    Location
    A Magic Forest in Deepest, Darkest Kent
    Posts
    5,681
    Thanks
    0
    Thanked 1 Time in 1 Post

    Re: Navigational bars

    I have done some extra curricular work for you ..attached using an old page that I have manipulated.

    I am going to be off-line for a couple of hours as there is a film I want to watch but will provide you with the external CSS file for as a seperate attachmentthis page
    Jerry

  9. #9
    Platinum Lounger
    Join Date
    Feb 2002
    Location
    A Magic Forest in Deepest, Darkest Kent
    Posts
    5,681
    Thanks
    0
    Thanked 1 Time in 1 Post

    Re: Navigational bars

    Put this file in your root folder next to the html files and put this code in the head tag to replace everything in style tags

    <link href="main.css" rel="stylesheet" type="text/css">

    You can put this in all pages and one change i the main.css will effect all pages on the site
    Jerry

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •