编写纯CSS弹出菜单的原理及实现Byshawl.qiu
摘要:
本文介绍了使用CSS编写适用于Opera,Firefox,IE的多风格弹出菜单
说明:
编写CSS弹出菜单的要点不外乎当鼠标移到目标上时,显示出隐藏的标签.
要隐藏的标签使用display:none;属性进行隐藏.
触发显示隐藏标签主要使用:hover属性,并用display:block;显示隐藏的标签.
但由于浏览器对CSS的支持并非一致.
对于Opera或者Firefox,我们可以编写出纯CSS菜单,他们支持任何标签的:hover属性.
而对于IE浏览器,:hover只对a标签起作用,但我们可以使用脚本的onmouseover,onmouseout模拟出其他标签的:hover属性.
因此编写适用于IE的CSS弹出菜单必须使用到少许的脚本.
目录:
1.编写直排右侧弹出的CSS菜单.
1.1真正的基于Opera,Firefox纯CSS弹出菜单
1.2兼容IE,Opera,Firefox的CSS弹出菜单(脚本实现)
2.编写横排底部弹出的CSS菜单.
2.1真正的基于Opera,Firefox纯CSS弹出菜单
2.2兼容IE,Opera,Firefox的CSS弹出菜单(脚本实现)
3.结论
4.预览
shawl.qiu
2006-10-01
http://blog.csdn.net/btbtd
1.编写直排右侧弹出的CSS菜单.
1.1真正的基于Opera,Firefox纯CSS弹出菜单
linenum