Menu bar - that old favourite

Discussion in 'HTML' started by Andy Dingley, Jul 27, 2005.

  1. Andy Dingley

    Andy Dingley Guest

    I need a menu bar - the "tabbed folders" look, nothing particularly
    odd. A highlighted tab for "current" and rollover highlighting too.

    If this were for my own site, I'd do something like the "sliding doors"
    CSS version and be done in minutes. I'd have nice
    semantically-meaningful HTML and very few images too.

    However the dezyner on this project has specified a weird font for the
    tabs which I can't render from text and standard web fonts. So it looks
    like I'm reduced to using bitmaps for each tab.

    This is my dilemma - is there any way to use CSS bitmap rollovers _and_
    have a text string in the HTML ?

    I like the sliding doors approach because the text re-sizes on demand
    and I don't have to generate 30 bitmaps. In the future there will be new
    tabs and it would be nice to have them come straight from the database,
    not Photoshop. However if I want this crazy font, am I really reduced
    to just a triplet of fixed-size bitmaps for each tab ? Is that really
    the best I can hope for ?

    Font sizes are set in pixels (10px !) according to the design and the
    tabs are fixed width. Usability is obviously poor, but that's not the
    customer's priority.

    Maybe I should go with <img> and ChavaScript rollovers for a quiet life
    - it's clearly what they're happiest with.


    All comments welcome
     
    Andy Dingley, Jul 27, 2005
    #1
    1. Advertising

  2. Andy Dingley

    Jedi Fans Guest

    Andy Dingley wrote:
    > I need a menu bar - the "tabbed folders" look, nothing particularly
    > odd. A highlighted tab for "current" and rollover highlighting too.
    >
    > If this were for my own site, I'd do something like the "sliding doors"
    > CSS version and be done in minutes. I'd have nice
    > semantically-meaningful HTML and very few images too.
    >
    > However the dezyner on this project has specified a weird font for the
    > tabs which I can't render from text and standard web fonts. So it looks
    > like I'm reduced to using bitmaps for each tab.
    >
    > This is my dilemma - is there any way to use CSS bitmap rollovers _and_
    > have a text string in the HTML ?
    >
    > I like the sliding doors approach because the text re-sizes on demand
    > and I don't have to generate 30 bitmaps. In the future there will be new
    > tabs and it would be nice to have them come straight from the database,
    > not Photoshop. However if I want this crazy font, am I really reduced
    > to just a triplet of fixed-size bitmaps for each tab ? Is that really
    > the best I can hope for ?
    >
    > Font sizes are set in pixels (10px !) according to the design and the
    > tabs are fixed width. Usability is obviously poor, but that's not the
    > customer's priority.
    >
    > Maybe I should go with <img> and ChavaScript rollovers for a quiet life
    > - it's clearly what they're happiest with.
    >
    >
    > All comments welcome

    not sure about the text+image thing BUT something to look into [cuts 30
    bitmaps to 10]: <URL: http://wellstyled.com/css-nopreload-rollovers.html>
     
    Jedi Fans, Jul 27, 2005
    #2
    1. Advertising

  3. Andy Dingley

    jlbdoc95 Guest

    If the color difference is not that great, you might be able to get away and
    keep the same "text image" for all different states (on/off/hover). If you
    designer can get the text in a transparent fashion so that it looks good
    against all 3 background, then that will simplify the coding quite a bit,
    otherwise, good old roll overs might save you some headaches for sure.


    "Andy Dingley" <> wrote in message
    news:...
    >I need a menu bar - the "tabbed folders" look, nothing particularly
    > odd. A highlighted tab for "current" and rollover highlighting too.
    >
    > If this were for my own site, I'd do something like the "sliding doors"
    > CSS version and be done in minutes. I'd have nice
    > semantically-meaningful HTML and very few images too.
    >
    > However the dezyner on this project has specified a weird font for the
    > tabs which I can't render from text and standard web fonts. So it looks
    > like I'm reduced to using bitmaps for each tab.
    >
    > This is my dilemma - is there any way to use CSS bitmap rollovers _and_
    > have a text string in the HTML ?
    >
    > I like the sliding doors approach because the text re-sizes on demand
    > and I don't have to generate 30 bitmaps. In the future there will be new
    > tabs and it would be nice to have them come straight from the database,
    > not Photoshop. However if I want this crazy font, am I really reduced
    > to just a triplet of fixed-size bitmaps for each tab ? Is that really
    > the best I can hope for ?
    >
    > Font sizes are set in pixels (10px !) according to the design and the
    > tabs are fixed width. Usability is obviously poor, but that's not the
    > customer's priority.
    >
    > Maybe I should go with <img> and ChavaScript rollovers for a quiet life
    > - it's clearly what they're happiest with.
    >
    >
    > All comments welcome
     
    jlbdoc95, Jul 27, 2005
    #3
  4. Andy Dingley

    JDS Guest

    On Wed, 27 Jul 2005 01:07:23 +0100, Andy Dingley wrote:

    > In the future there will be new tabs
    > and it would be nice to have them come straight from the database, not
    > Photoshop.


    This doesn't help with the rollovers, but I have a PHP script that will
    generate an image of text from a string and your desired TTF (or Type 1)
    font file:

    http://www.newtnotes.com/index.php?itemid=105&catid=4


    later...
    --
    JDS | lid
    | http://www.newtnotes.com
    DJMBS | http://newtnotes.com/doctor-jeff-master-brainsurgeon/
     
    JDS, Jul 27, 2005
    #4
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Matt
    Replies:
    0
    Views:
    3,604
  2. John Hann
    Replies:
    0
    Views:
    6,170
    John Hann
    Aug 21, 2004
  3. Matt
    Replies:
    9
    Views:
    71,254
  4. Matt
    Replies:
    9
    Views:
    650
    kaeli
    Aug 23, 2004
  5. Tim
    Replies:
    1
    Views:
    337
    Grant Wagner
    Jan 18, 2005
Loading...

Share This Page