Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS [Solved] CSS Hover Problem

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #27812
    ssstratos
    Member

    I have a problem. I want to change header’s image when the mouse is over navbar. For example:

    header { background: url(‘myimages.jpg’) repeat; } -> The image before over

    navbar:hover { } -> The code for over, i don’t know what i have to add here

    Thanks

    #70308
    benben
    Participant

    If you can make the header child of the navbar in some way, then this would be possible…

    Code:
    navbar header { background: url(image1.jpg); }
    navbar:hover { background:url(image2.jpg); }

    Though in some situations it might not be good semantics to have your header within your navbar.

    Otherwise a bit of jquery would do the trick. Something like this…

    Code:
    $(‘navbar’).hover(function() {
    // Function called on hover
    $(‘header’).css({ background : “url(image2.jpg)” });
    },
    function() {
    // Function called when mouse moved off navbar element
    $(‘header’).css({ background : “url(image1.jpg)”
    });
    #70369
    ssstratos
    Member

    I will use Jquery’s code. Thanks!

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘CSS’ is closed to new topics and replies.