Menu bar - that old favourite

Collapse
This topic is closed.
X
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • Andy Dingley
    #1

    Menu bar - that old favourite

    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
    Tags: None
    • Jedi Fans
      #2
      Re: Menu bar - that old favourite

      Andy Dingley wrote:[color=blue]
      > 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[/color]
      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>

        Comment

        • jlbdoc95
          #3
          Re: Menu bar - that old favourite

          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" <dingbat@codesm iths.com> wrote in message
          news:26jde199b1 23plf4n6c0eti4f mn1f6jlq9@4ax.c om...[color=blue]
          >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[/color]


            Comment

            • JDS
              #4
              Re: Menu bar - that old favourite

              On Wed, 27 Jul 2005 01:07:23 +0100, Andy Dingley wrote:
              [color=blue]
              > In the future there will be new tabs
              > and it would be nice to have them come straight from the database, not
              > Photoshop.[/color]

              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 | jeffrey@example .invalid
              | http://www.newtnotes.com
              DJMBS | http://newtnotes.com/doctor-jeff-master-brainsurgeon/

                Comment

                Previous template Next
                Working...