网页图片特效小技巧

转载 2007年10月04日 13:42:00
 
这几个网页图片特效小技巧基本主要利用了一些鼠标控制语句、css滤镜代码,加上简单的javascript语句实现的,简单有趣,可以作为帮助一些朋友javascript入门的小例子。

  图片循环渐显渐隐

  效果描述:图片循环渐显渐隐……

  实现方法:

  1、把如下代码加入<body>区域中:
<img src="image1.gif" name="u" border=0
alt="Image" style="filter:alpha(opacity=0)">

<script language="JavaScript">
var b = 1;
var c = true;
function fade(){
  if(document.all);
    if(c == true) {
      b++;
  }
  if(b==100) {
    b--;
    c = false
  }
  if(b==10) {
    b++;
    c = true;
  }
  if(c == false) {
    b--;
  }
  u.filters.alpha.opacity=0 + b;
  setTimeout("fade()",50);
}
</script>
  2、把<body>改为:
<body bgcolor="#ffffff" onLoad="fade()">
  注:图片的文件名及路径可以自行修改。

  禁止图片下载

  效果描述:设置某一图片禁止下载,鼠标移动到图片上面时将会给出提示,此方法治标不治本,只能骗骗菜鸟。

  实现方法:
<A HREF="javascript:void(0)" onMouseover="alert('对不起,此图片不能下载!')">
<IMG SRC="2.gif" Align="center" Border="0" width="99" height="50"></A>
  注:图片的文件名及路径可以自行修改。

    鼠标控制图片隐现效果

  效果显示:图片一开始是模糊显示,当鼠标移到图片上面时图片会清晰显示。

  实现方法:

   1、把如下代码加入<body>区域中:
<SCRIPT language="JavaScript">
<!--
function makevisible(cur,which){
  if (which==0)
    cur.filters.alpha.opacity=100
  else
    cur.filters.alpha.opacity=20
}
//-->
</SCRIPT>
  2、把如下代码加入<body>区域中:
<img src="2.gif" style="filter:alpha(opacity=20)"
onMouseOver="makevisible(this,0)"
onMouseOut="makevisible(this,1)">
  注:图片的文件名及路径可以自行修改。

  鼠标控制的图片大小变换

  效果描述:一开始图片按设置的比例缩小显示,鼠标移动到图片上面时,图片就会按预先设置的一个较大的比例显示。

  实现方法:

  把如下代码加入<body>区域中:
<span id="s1" style = "width : 100">
<a href="index.shtml"
onmouseover="img1.style.width='95';"
onmouseout="img1.style.width= '67';">
<Img src="link1.gif" id="img1">
</a>
</span> 
 

网页代码常用小技巧 特效代码

  • 2008年08月07日 17:04
  • 127KB
  • 下载

分享的是Android图像特效处理的小技巧,比如圆角、倒影、还有就是图片缩放、Drawable转化为Bitmap、Bitmap转化为Drawable等等

第一步:新建一个Android工程命名为ImageDemo,工程结构如下: 第二步:新建一个.java文件,命名为ImageUtil.java,在里面定义一些图片处理方法,代码如下: pack...
  • heliit
  • heliit
  • 2012年05月03日 15:59
  • 620

Android中几种图像特效处理的小技巧,比如圆角,倒影,还有就是图片缩放,Drawable转化为Bitmap,Bitmap转化为Drawable等等

Android中几种图像特效处理的小技巧,比如圆角,倒影,还有就是图片缩放,Drawable转化为Bitmap,Bitmap转化为Drawable等等   大家好,这一节给大家分享的是Android中...
  • xiaowq
  • xiaowq
  • 2011年04月19日 10:03
  • 1678

55种网页常用小技巧(javascript)

  • 2013年03月11日 23:03
  • 18KB
  • 下载

ASP.NET网页设计的24条小技巧

  • 2009年01月08日 15:45
  • 7KB
  • 下载

今天给大家说一个我做UI特效的小技巧,先来看看效果吧(录屏有点渣,所以质量有折扣)

今天给大家说一个我做UI特效的小技巧,先来看看效果吧(录屏有点渣,所以质量有折扣) 首先找你们UI组要一个需要制作特效的UI 然后在max里按照UI尺寸创建一个面片 然后U...

网页常用小技巧JavaScript

  • 2010年11月13日 22:58
  • 12KB
  • 下载

网页代码常用小技巧

  • 2008年08月25日 12:52
  • 14KB
  • 下载

js小技巧 显示跟隐藏文字特效

http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> http://www.w3.org/1999/xhtml"> 显示和隐藏...

40种网页常用小技巧(JavaScript)

  • 2007年04月09日 11:02
  • 8KB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:网页图片特效小技巧
举报原因:
原因补充:

(最多只允许输入30个字)