prevent children from inheriting transformation css3

后端 未结 4 1315
太阳男子
太阳男子 2020-12-05 10:04

I have a div that i\'m tranforming (scale and translate), but inside that div i have another div. Now i would to see that the inner

4条回答
  •  时光取名叫无心
    2020-12-05 10:13

    Here is it what worked for me..

    I used opposite transition for children. Then it was stable

    .logo {
        background: url('../images/logo-background.png') no-repeat;
        width: 126px;
        height: 127px;
        margin-top:-24px;
        z-index: 10;
        display: block;
    
    }
    a.logo span{
        display: block;
        width: 126px;
        height: 127px;
        background: url('../images/logo-bismi.png') no-repeat;
        z-index: 20;
        text-indent: -9999px;
        text-transform: capitalize;
        -webkit-transition: -webkit-transform 0.4s ease-out;
        -moz-transition: -moz-transform 0.4s ease-out;
        transition: transform 0.4s ease-out;    
    
    }
    a.logo:hover span{
        -webkit-transform: rotateZ(-360deg);
        -moz-transform: rotateZ(-360deg);
        transform: rotateZ(-360deg);
    }
    a.logo {
        -webkit-transition: -webkit-transform 0.4s ease-out;
        -moz-transition: -moz-transform 0.4s ease-out;
        transition: transform 0.4s ease-out;        
    }
    a.logo:hover{
        -webkit-transform: rotateZ(360deg);
        -moz-transform: rotateZ(360deg);
        transform: rotateZ(360deg); 
    }
    

提交回复
热议问题