网页制作免费教程站—个人网页 建站教程 建站资源 免费建站资源 个人网页制作教程 个人网页制作 ——网页制作与网页设计教程网

域名注册 - 虚拟主机 - 企业邮局 - 网页制作 - 网站推广 - 服务器租用
关键字: - 设置首页 - 加入收藏
业界新闻 建站指南 网页制作 动画制作 网页特效 网络编程 书籍教程 网页素材 视频教程
苏菜 豫菜 辽菜 滇菜 鄂菜 东北菜 客家菜 淮扬菜 海派菜
满汉全席 川菜 粤菜 湘菜 京菜 鲁菜 潮州菜 闽菜 火锅 徽菜 海鲜 浙菜 山珍

超值套餐A型

110M 送cn

超值套餐B型

220M 送cn

超值套餐C型

350M 送cn

超值套餐D型

450M 送cn

超值套餐E型

300M 送com

超值套餐F型

400M 送com

超值套餐G型

500M 送com

超值套餐H型

600M 送com


鼠标事件的基础和完美实现


2007-3-13 13:57:58 来源:本站 评论:


当鼠标滑过一个图片时,图片会变成另外一张图片的效果是怎么制作出来的呢?
  相对一些不熟悉HTML代码的朋友来说,可以使用网页编辑软件自带的动作来编辑。
  最简单的其实要属使用FrontPage了,它的很多特效是Java Applet的,但象这种鼠标事件效果是Javascript的,实现的很累赘,外挂了一个足有14K大小的JS文件。
  Dreamweaver中的效果不错,相对FrontPage虽然代码仍很多,但总体简单些。所以我们推荐初学者使用Dreamweaver来实现这个效果。步骤如下:
  1、插入鼠标没有移上去前显示的图片,打开DW中的行为面板,点击“+”。

  2、在出现的下拉菜单中选择“交换图像”

  3、选择鼠标移上去后显示的图片,确定。

  4、这时候行为面板中会有事件和动作,直接保存叶面,完成。

  不过此方法会产生较长的js代码,所以并不推荐使用。
  其实实现鼠标事件效果最完美的方法是插入一小句代码即可。代码如下:
<image src="img1" onmouseover="this.src='img2'" onmouseout="this.src='img1'">
而事实上,这种效果一般不超过100个字节(你别告诉我文件名就有几十个字节哦)。

相关文章
·暂无
正在读取…
我也评两句

   


最新虚拟主机分类
个人经典型 企业商务型
精品论坛型
PHPWind论坛型 Discuz论坛型
精品网店型
Shopex网店型 ecshop网店型
CMS专用型
Dedecms专用型 php168专用型
Phpcms专用型  
Flash Remoting虚拟主机
ColdFusion,BlueDragon虚拟主机
DotNetNuke虚拟主机