当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 使用button标签,实现三态图片按钮

Javascript
IE中直接运行显示当前网页中的图片 推荐
广告显示判断
srcElement表格样式
免费空间广告万能消除代码
[原创]手机号码本地检测
JS实现浏览器菜单命令
JS代码混淆初步
经验几则 推荐
MSN消息提示类
正宗的日历(含农历)
农历与西历对照
在网页中屏蔽快捷键
简单获取键盘的KeyCode
音乐播放用的的几个函数
你的编程语言可以这样做吗?
如何遍历对象的属性?
自动关闭的层
prototype 的说明 js类
js脚本学习 比较实用的基础
日期函数扩展类Ver0.1.1

Javascript 中的 使用button标签,实现三态图片按钮


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-12   浏览: 216 ::
收藏到网摘: n/a

三态图片按钮对于好的用户体验来说必不可少。我对dom事件进行一些处理,在不改变html的情况下,实现了三态按钮。下面的解决方法的关键,主要是去掉虚线选框和对背景进行定位,没有使用循环处理,任何一个按钮,只要定义了背景图片和边框为0,就自动变成了三态按钮。
点击运行可以看到效果:
[Ctrl+A 全选 提示:你可先修改部分代码,再按运行]

上面的解决方法还有点美中不足,就是在firefox下,没办法用Tab键定位按钮,这是因为为了去掉虚框,屏蔽了点击事件。下面的程序解决了这个问题,方法是在按钮里创建一个不可见的新按钮,由它转移焦点。
点击运行可以看到效果:
[Ctrl+A 全选 提示:你可先修改部分代码,再按运行]