                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /JS+CSS3实现带预览图幻灯片效果

课程JS+css3实现带预览图幻灯片效果问题

有个问题请大家指导哈，就是那两个标题没有在:hover下怎么就动起来了 11分钟左右
.slider .main .main-i h2{margin-left:45px;} .slider .main .main-i h3{margin-left:-45px;} .slider .main .main-i h2,.slider .main .main-i h3{ -webkit-transform:all 0.8s;} .slider .main .main-i_active h2,.slider .main .main-i_active h2{margin-right:0;}

Mr君

2016-08-18

源自：JS+CSS3实现带预览图幻灯片效果 2-3

关注问题我要回答

938

操作

收起

2 回答

慕盖茨4878874
2016-08-22

这个是css3动画呀，transition就是一个动画属性，你可以去w3school看看这个API（transition），所以它跟hover是没有关系的，hover是鼠标覆盖，而transition是页面加载时就可以动了

transform:all 0.8s all指的就是.slider .main .main-i h2,.slider .main .main-i h3到.slider .main .main-i_active h2,.slider .main .main-i_active h2里的所有有变化的属性，可以看到margin-right产生了变化，而0.8就是运动的时间了。