SitePoint Sponsor

User Tag List

Results 1 to 4 of 4

Hybrid View

  1. #1
    SitePoint Member
    Join Date
    Jul 1999
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm working on a dhtml drop down menu like that on microsoft.com. I'm using some code from http://www.simplythebest.net/info/dhtmscript42.html and I was wondering.. How do I add separators like | in between my menus?

  2. #2
    SitePoint Wizard creole's Avatar
    Join Date
    Oct 2000
    Location
    Nashvegas Baby!
    Posts
    7,845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    not sure what you mean by seperators. Are you referring to the thin lines between each "cell"? If so, then that is accomplished using cellpadding and/or cellspacing.
    Adobe Certified Coldfusion MX 7 Developer
    Adobe Certified Advanced Coldfusion MX Developer
    My Blog (new) | My Family | My Freelance | My Recipes

  3. #3
    SitePoint Member
    Join Date
    Jul 1999
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    My fault, I wasn't very clear.

    If you look at microsoft.com. You'll see that they have a dhtml/javascript drop down menu. They have two actually, the one I'm referring to is the light blue bar that spans the entire screen.

    In between the headers, they have | This is an actual character: shift + \

    If you highlight microsoft's bar - you'll see that the separators are little headers of their own.

    That's what I'm trying to accomplish. I could just add some spaces and then the character - but when a user selects that header, the | gets highlighted too. I don't want this to happen.

    How do I add in another header (which will contain a few spaces and |) but won't be highlighted when moused over?

    Thanks in advance.

  4. #4
    SitePoint Wizard creole's Avatar
    Join Date
    Oct 2000
    Location
    Nashvegas Baby!
    Posts
    7,845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I would assume that they have their header set up like so:

    <table> (extra stuff left out for shortness)
    <tr>
    <td>
    | (called a pipe actually)
    <div class="menuitem">
    Events & Training
    </div>
    |
    <div class="menuitem">
    Subscribe
    </div>
    |
    <div class="menuitem">
    About Microsoft
    </div>
    </td>
    </tr>
    </table>

    All dHTML menus work by "styling" (using CSS) a div (or some other block level element). Now, with the code that I mocked up for you, you would just style the DIV's individually. Just paste them from your existing code into a structure such as that. Then the pipes won't get added into the drop down rollover.

    Or you could just sneak a peek at how Microsoft did it. Wouldn't that be the easiest?
    Adobe Certified Coldfusion MX 7 Developer
    Adobe Certified Advanced Coldfusion MX Developer
    My Blog (new) | My Family | My Freelance | My Recipes


Bookmarks

Posting Permissions

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