Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 8 of 8
  1. #1
    Junior Member
    Join Date
    Nov 2009
    Posts
    8
    Member #
    20426
    I use dreamweaver and the following looks perfect in firefox.
    If you hit reunions, look what happens!...please assist.. thanks kindly

    http://www.sanfele.org/index3.html

  2.  

  3. #2
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,720
    Member #
    5580
    Liked
    718 times
    Not that there's anything wrong with the menu you are using ...
    But look at the over 200 examples of various CSS menus here:

    http://www.cssplay.co.uk/menu/

    Find one you like and view the HTML/CSS coding for it.
    I think this might help you out. They seem to work well with all browsers.


  4. #3
    Junior Member
    Join Date
    Nov 2009
    Posts
    8
    Member #
    20426
    Where do i find the code to this? How can i use these examples? Do not see the code.

    ps.. i still dont know how to fix my current problem Im having with the spryy menu.

  5. #4
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,720
    Member #
    5580
    Liked
    718 times
    In the examples, you use your browser to view the HTML source.

    It takes way too long to duplicate your page on my server.
    No way to troubleshoot without trying out various things.


  6. #5
    Junior Member
    Join Date
    Nov 2009
    Posts
    8
    Member #
    20426
    do you mean just hit view source?... then within view source what do i look for?
    isnt it the source of the entire page, just not example?

  7. #6
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,720
    Member #
    5580
    Liked
    718 times
    This is actually the URL with all the CSS menus ... the one I gave previous was their main page.
    http://www.cssplay.co.uk/menus/

    Take this particular menu for example:
    http://www.cssplay.co.uk/menus/new-dropdown.html
    If you view the HTML source, you'll see the CSS and HTML code for the demo.


  8. #7
    Junior Member
    Join Date
    Nov 2009
    Posts
    8
    Member #
    20426
    okay, i guess i have a dumb question. how do i use that particular menu? So i need to create buttons, then place them on page? or so i save image of menu? I know, dumb question, i apologize.....

  9. #8
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,720
    Member #
    5580
    Liked
    718 times
    They use a few images.

    By viewing the CSS section, I see these are the ones they use:
    http://www.cssplay.co.uk/menus/newdrop/tab125.gif
    http://www.cssplay.co.uk/menus/newdrop/tab125b.gif
    http://www.cssplay.co.uk/menus/newdrop/tab125c.gif
    http://www.cssplay.co.uk/menus/newdrop/tab125d.gif

    This is the CSS section that you can use on your own site, or within your
    own CSS file ... depending on how you do your CSS:
    Code:
    <style type="text/css">
    /* ================================================================ 
    This copyright notice must be untouched at all times.
    
    The original version of this stylesheet and the associated (x)html
    is available at http://www.cssplay.co.uk/menus/new-dropdown.html
    Copyright (c) 2005-2009 Stu Nicholls. All rights reserved.
    This stylesheet and the associated (x)html may be modified in any 
    way to fit your requirements.
    =================================================================== */
    /* defaults for ie6 */
    a, a:hover, a:active, a:focus {outline:0; direction:ltr;}
    
    .positioner {position:relative; height:25px;}
    .menuHolder {position:absolute; z-index:100; font:normal 11px/25px verdana, sans-serif; left:50%; margin-left:-315px; width:630px;}
    ul.ulTop {padding:0; margin:0; list-style:none; width:125px; overflow:hidden; float:left; margin-right:1px;}
    ul.ulTop a {text-decoration:none; color:#fff; padding-left:5px;}
    
    ul.ulTop li.liTop {
    float:left;
    width:250px;
    margin:-32767px -125px 0 0;
    background:url(newdrop/tab125b.gif) no-repeat left bottom;
    }
    ul.ulTop li.liTop a.aTop {
    position:relative;
    z-index:50;
    display:block;
    float:left;
    width:120px;
    margin-top:32767px;
    background:transparent;
    }
    ul.ulTop li.liTop a.aTop:hover,
    ul.ulTop li.liTop a.aTop:focus,
    ul.ulTop li.liTop a.aTop:active {
    margin-right:1px;
    background:url(newdrop/tab125.gif) no-repeat left top;
    }
    ul.sub {float:left; padding:25px 0 0 0; margin:0; list-style:none; background:url(newdrop/tab125.gif) no-repeat left top; margin-top:-25px;}
    ul.sub li a {
    float:left;
    width:120px;
    background:#099;
    clear:left;
    }
    ul.sub li a.last {background:url(newdrop/tab125c.gif);}
    
    ul.sub li a.last:hover,
    ul.sub li a.last:focus,
    ul.sub li a.last:active {
    background:url(newdrop/tab125d.gif);
    }
    
    ul.sub a:hover,
    ul.sub a:focus,
    ul.sub a:active {
    background:#06c;
    margin-right:1px;
    }
    
    /* this is for the click version */
    ul.ulTop li.liTop a.aTop2 {
    position:relative;
    z-index:50;
    display:block;
    float:left;
    width:120px;
    margin-top:32767px;
    background:transparent;
    }
    ul.ulTop li.liTop a.aTop2:hover {
    background:url(newdrop/tab125.gif) no-repeat left top;
    }
    ul.ulTop li.liTop a.aTop2:focus,
    ul.ulTop li.liTop a.aTop2:active {
    margin-right:1px;
    background:url(newdrop/tab125.gif) no-repeat left top;
    }
    
    </style>

    And here's the actual menu that you can use, but change it for your own links:
    Code:
    <div class="positioner">
    <div class="menuHolder">
    <ul class="ulTop">
    <li class="liTop">
    	<a class="aTop" href="#top1">Home</a>
    </li>
    </ul>
    <ul class="ulTop">
    <li class="liTop">
    	<a class="aTop" href="#top1">Products</a>
    
    	<ul class="sub">
    		<li><a href="#top1a">Cameras</a></li>
    		<li><a href="#top1b">Lenses</a></li>
    		<li><a href="#top1c">Flashguns</a></li>
    		<li><a class="last" href="#top1d">Tripods</a></li>
    	</ul>
    </li>
    
    </ul>
    <ul class="ulTop">
    <li class="liTop">
    	<a class="aTop" href="#top2">Services</a>
    	<ul class="sub">
    		<li><a href="#top2a">Printing</a></li>
    		<li><a href="#top2b">Framing</a></li>
    		<li><a href="#top2c">Retouching</a></li>
    
    		<li><a href="#top2d">Enlarging</a></li>
    		<li><a class="last" href="#top2e">Copying</a></li>
    	</ul>
    </li>
    </ul>
    <ul class="ulTop">
    <li class="liTop">
    	<a class="aTop" href="#top3">Outlets</a>
    	<ul class="sub">
    
    		<li><a href="#top3a">Bristol</a></li>
    		<li><a href="#top3b">Keynsham</a></li>
    		<li><a class="last" href="#top3c">Gloucester</a></li>
    	</ul>
    </li>
    </ul>
    <ul class="ulTop">
    <li class="liTop">
    	<a class="aTop" href="#top1">Contact Us</a>
    
    </li>
    </ul>
    </div>
    </div>



Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 11:51 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com