div overlay or pop when mouse over and image change

Posted on 2011-04-18
Last Modified: 2012-05-11
div overlay or pop when mouse over and image change

like this  ->
Question by:ninjadude12
    1 Comment
    LVL 10

    Accepted Solution

    I usually use css to do this.
    The concept is to use the :hover psuedo class.

    Something like this... (not tested)
       width: 100px;
       height: 100px;
       background-image: url(FordLogo_bw.png);
       position: absolute;
       display: none;
       background-image: url(FordLogo_color.png);
    .FordLogo:hover popup, popup:hover
       display: block;
    <div class="FordLogo">
       <div class="popup">A lot of links...</div>

    Open in new window


    Featured Post

    How your wiki can always stay up-to-date

    Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
    - Increase transparency
    - Onboard new hires faster
    - Access from mobile/offline

    Join & Write a Comment

    Introduction A frequently asked question goes something like this:  "I am running a long process in the background and I want to alert my client when the process finishes.  How can I send a message to the browser?"  Unfortunately, the short answer …
    Why do we like using grid based layouts in website design? Let's look at the live examples of websites and compare them to grid based WordPress themes.
    In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …
    In this tutorial viewers will learn how to style different bullet points for unordered lists in CSS. Begin with a normal unordered list; the default bullet point is a solid circle: In the CSS, create a defined class of unordered list by typing "ul.S…

    734 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    22 Experts available now in Live!

    Get 1:1 Help Now