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.

Page 1 of 2 1 2 LastLast
Results 1 to 10 of 15
  1. #1
    Junior Member
    Join Date
    Apr 2013
    Posts
    10
    Member #
    36110
    Hi All--

    I am fairly new to this web design stuff, and can't for the life of me figure out why when I hover over the Contact Us menu it does not highlight the entire menu item block. Can someone point me in the right direction to correct this?

    Thanks

    http://klmcomputerservices.com/Cornelous/index.html

  2.  

  3. #2
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,724
    Member #
    5580
    Liked
    718 times
    There is a file you have called "default.css" (your stylesheet).

    If you look for the ID called "navigation", you'll find all of the properties for that.
    In the hover portion, it paints this background image into the item block:
    http://klmcomputerservices.com/Corne...n-bg-hover.gif

    This is the portion in the CSS file:

    #navigation li:hover {
    position: relative;
    z-index: 400;
    cursor: pointer;
    background: url(images/dropdown-bg-hover.gif) repeat-x left top;
    }

    Comment-out the background ... by surrounding it with /* ... */

    #navigation li:hover {
    position: relative;
    z-index: 400;
    cursor: pointer;
    /* background: url(images/dropdown-bg-hover.gif) repeat-x left top; */
    }


    EDIT: I misread your original post ... sorry.
    What do you mean by not highlighting the whole menu block?


  4. #3
    Junior Member
    Join Date
    Apr 2013
    Posts
    10
    Member #
    36110
    Thanks for your response. But if I comment out that line, then my hovering stops altogether. I am just having a problem getting the existing hovering to highlight the entire block like it does for the other menus. When I hover on the "Contact Us" a little piece at the end in not highlighted. Maybe I was clear enough from my initial question. Sorry.

  5. #4
    Junior Member
    Join Date
    Apr 2013
    Posts
    10
    Member #
    36110
    Quote Originally Posted by mlseim, post: 250118, member: 5585
    There is a file you have called "default.css" (your stylesheet).

    If you look for the ID called "navigation", you'll find all of the properties for that.
    In the hover portion, it paints this background image into the item block:
    http://klmcomputerservices.com/Corne...n-bg-hover.gif

    This is the portion in the CSS file:

    #navigation li:hover {
    position: relative;
    z-index: 400;
    cursor: pointer;
    background: url(images/dropdown-bg-hover.gif) repeat-x left top;
    }

    Comment-out the background ... by surrounding it with /* ... */

    #navigation li:hover {
    position: relative;
    z-index: 400;
    cursor: pointer;
    /* background: url(images/dropdown-bg-hover.gif) repeat-x left top; */
    }


    EDIT: I misread your original post ... sorry.
    What do you mean by not highlighting the whole menu block?
    If I put the mouse over Contact Us, the area should change to a darker blue, but for some reason a little piece on the right hand side remains unchanged.

    Thanks

  6. #5
    Senior Member Webzarus's Avatar
    Join Date
    May 2011
    Location
    South Carolina Coast
    Posts
    3,322
    Member #
    27709
    Liked
    770 times
    Without seeing all the code or the actual working page, we'd be guessing.

    Here's te main thing with CSS, there could possibly be a sub class, child class or even a secondary entry somewhere in your code interfering .... And the last reference is the one the browser is going to behave by.

    If nothing else, copy the code you think is controlling the behavior to the page itself, put it below the call to the CSS file itself. If evrything works as designed, then you have a bit somewhere in the CSS file that is causing this, if not... Then we really need to see the rest of the code.

  7. #6
    Junior Member
    Join Date
    Apr 2013
    Posts
    10
    Member #
    36110
    I will continue working at it. Thanks

  8. #7
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,724
    Member #
    5580
    Liked
    718 times
    Yes I had read your original post wrong .. sorry.

    The part you are talking about is the separator.gif

    This is the part ... in the CSS file.

    #navigation li + li{
    background: url(images/separator.gif) no-repeat left center;
    }

    Right now, it disappears on one side but not the other. Do you want it to totally disappear, or remain visible?

    You should also know that you can use PHP to do some dynamic scripting.

    Your page is called "index.html". Change it to "index.php" and then you can do some dynamic things, like make the year on the footer always show the correct year.

    Example:

    <p>&copy; <?=$date("Y");?> Cornelous Music,. All rights reserved. </p>

    That will show up as 2013 instead of 2008.


  9. #8
    Junior Member
    Join Date
    Apr 2013
    Posts
    10
    Member #
    36110
    I would rather it stays visible.

    Thanks

  10. #9
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,724
    Member #
    5580
    Liked
    718 times
    Will that top menu be the same all the time, or will it be changing from page to page?

    The tricky part is the end boxes, as they only have one white bar. So separate classes will be needed for defining whether the menu box is left, middle, or right.

    Where did the original design of the site come from? Is it a pre-made template of some kind?
    Why are you working on it with no development experience? I think it's good that you are doing it and learning, but I'm just curious what led you there.


  11. #10
    Junior Member
    Join Date
    Apr 2013
    Posts
    10
    Member #
    36110
    The menu will be the same on all pages. I am learning as I go. The menu was a simple menu without the hovering stuff. I just added this with different ideas from the internet. But I do appreciate the support here.

    Thanks


Page 1 of 2 1 2 LastLast

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 04:35 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com