最简单的hover写法,淡入淡出,关键在于pointer-events的使用,保证淡入淡出都有过渡效果的同时,子元素不会被父元素hover事件所影响!
就是隐藏display:none
当前显示的设置为display:block
一般使用脚本实现
比如你要隐藏的元素为<div id="info1"></div>
要显示的元素为<div id="info2"></div>
假设使用jquery控制
代码为以下两句：
$("#info1").hide()
$("#info2").show()
用css的:hover伪类。给你介绍下css的伪类。
a:link {} /* 未访问的链接 */
a:visited {} /* 已访问的链接 */
a:hover {}/* 当有鼠标悬停在链接上 */
a:active {} /* 被选择的链接 */
但是你说的img实现的不如用css的background来实现更容易些，不过你还需要准备这六块鼠标放在上面变灰的图片。当鼠标悬停在某张图片时，背景自动换成灰的。
