Using only CSS, show div on hover over

后端 未结 13 1334
时光取名叫无心
时光取名叫无心 2020-11-22 01:58

I would like to show a div when someone hovers over an element, but I would like to do this in CSS and not JavaScript. Do you know how this can be ach

13条回答
  •  深忆病人
    2020-11-22 02:12

    I found using opacity is better, it allows you to add css3 transitions to make a nice finished hover effect. The transitions will just be dropped by older IE browsers, so it degrades gracefully to.

    #stuff {
        opacity: 0.0;
        -webkit-transition: all 500ms ease-in-out;
        -moz-transition: all 500ms ease-in-out;
        -ms-transition: all 500ms ease-in-out;
        -o-transition: all 500ms ease-in-out;
        transition: all 500ms ease-in-out;
    }
    #hover {
        width:80px;
        height:20px;
        background-color:green;
        margin-bottom:15px;
    }
    #hover:hover + #stuff {
        opacity: 1.0;
    }
    Hover
    stuff

提交回复
热议问题