按钮说:我要疯狂! |
效果演示:
首先,在 <head> 区定义 CSS(层叠式样式表单)的 2 个 class, 分别是 .over 和 .down (注意在名字前面有个点)。代表含义是"鼠标覆盖和按下去的式样效果"。 你可以修改颜色等属性。属性请参考 CSS 相关属性。 <html> <head> <style type="text/css"> <!-- .over {color:yellow; background: navy} .down {color:yellow; background: navy; font-style: italic} --> </style> </head> <body> <input type="Button" onMouseOver="this.className='over';" onMouseOut="this.className='';" onMouseDown="this.className='down';" onMouseUp="this.className='over';" value="我是按钮" onClick="this.value='我要疯狂!!!'" name="Button"> </body> </html> 补充说明: (1)、这里用到了一些与鼠标动作有关的事件,其实 DHTML 就是依靠事件驱动的。这里用到的事件有onmouseover,onmouseout,onmousedown,onmouseup,分别代表鼠标覆盖(移动到某个对象上),鼠标离开,鼠标按下去,鼠标按下去又松开。 (2)、与按钮相关的知识:在 HTML 中我们使用 <input type="button" value="button"> 和 <input type="submit" value="button"> 都可以生成按钮,但是用法是有区别的。用 <input type="submit" value="button"> 生成的按钮,在点击后交由 Form 标签中的 action 中指定的程序去处理,一般是 CGI/ASP 等程序(例如:<form method="post" action="submit.cgi">)。而 <input type="button" value="button"> 生成的按钮在点击后通过 Onclick 事件定义的方法处理。 本例 onClick="this.value='我要疯狂!!!'" 表示显示"我要疯狂!!!"字符串。这实际上没有什么实际意义。 下面是一些常用的 onclick 事件的写法: A)onClick="javascript:alert('ok!')" 弹出警告窗口显示ok信息。 B)onClick="javascript:location.href='http://100000.home.sohu.com'" 点击后连向某个站点或页面。 注意:括号不要混用。双套单"''",或者单套双'""'。 |
Copyright(C) Net-e Network Studio,Xi'an China |
![]() |
站长邮箱:zhangking@263.net Bp:029-95808 呼 822686 |