84669 person learning
152542 person learning
20005 person learning
5487 person learning
7821 person learning
359900 person learning
3350 person learning
180660 person learning
48569 person learning
18603 person learning
40936 person learning
1549 person learning
1183 person learning
32909 person learning
请求大伙一个问题,就是小米官网首页http://www.mi.com/的智能硬件下的图片产品,当我鼠标移动到其图片就会有浮动凸出的效果,这个用什么技术实现的呢?css3吗?我查看其元素看不懂,求前辈们帮忙,谢谢了
小伙看你根骨奇佳,潜力无限,来学PHP伐。
hover的时候,加了个类,然后给这个添加box-shadow和transform。打开F12,看看就知道啦
孩纸,拿走不谢:plunker
顺便说下,就是css3的一些简单样式,主要是transition属性
transition
就是加了一个阴影,然后过渡,让你觉得突出来了,其实只是一层阴影而已。至于z-index:2和traslate3d删除这两个属性也没发现有什么影响,我猜是hack什么东西。
firefox下,右键-使用firebug查看元素,上下箭头移动到li标签这一层,右侧可以查看具体样式。
鼠标经过,p显示就可以了嘛,鼠标离开就隐藏,过渡效果的话可以用css也可以用jquery
就是css3的位移和阴影效果。但为什么不直接把translate3d和阴影效果写到伪类:hover里,反而在class里新增个类
hover的时候,加了个类,然后给这个添加box-shadow和transform。
打开F12,看看就知道啦
孩纸,拿走不谢:plunker
顺便说下,就是css3的一些简单样式,主要是
transition
属性就是加了一个阴影,然后过渡,让你觉得突出来了,其实只是一层阴影而已。至于z-index:2和traslate3d删除这两个属性也没发现有什么影响,我猜是hack什么东西。
firefox下,右键-使用firebug查看元素,上下箭头移动到li标签这一层,右侧可以查看具体样式。
鼠标经过,p显示就可以了嘛,鼠标离开就隐藏,过渡效果的话可以用css也可以用jquery
就是css3的位移和阴影效果。
但为什么不直接把translate3d和阴影效果写到伪类:hover里,反而在class里新增个类