css hover怎样延迟加载

html-css023

css hover怎样延迟加载,第1张

.class{

    opacity:0

}

.class:hover{

    animation:ttt 3s 1 forwards /*这里的3s表示总动画长3秒，其它属性感兴趣自己去查，反正主要就是那个3s*/

}

@keyframes ttt {

    0%{

        opacity:0

    }

    66%{ /*这里表示3s的66%也就是大约2秒的时候*/

        opacity:0

    }

    100%{

        opacity:1

    }

}

最终就会前2秒没变化，然后才开始执行了

css的执行方法是设置延迟函数

第一个设置1s

 transition-duration：1s

第二个设置第一个执行完成的函数时间假设第一个需要5s+开始时间1s

 transition-duration:6s

jq就用回调函数