注册 登录
编程论坛 JavaScript论坛

图像渐变

努力加油 发布于 2010-04-21 18:17, 660 次点击
程序代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. xmlns="http://www. http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body>
<script language="javascript">
var conut=0;
var w;
var h;
function hehe(){
    if(conut==0){
        h=parseInt(document.images[0].height);
        w=parseInt(document.images[0].width);
        for(var i=0;i<200;i++){
            document.images[0].height=h+i;
            document.images[0].width=w+i;
            }
        conut=1;
        }
    else{
        document.images[0].height=150;
        document.images[0].width=100;
        conut=0;
        }
    }
setInterval("hehe()",1000);
</script>
<img src="../实例及代码/images/2.jpg" height="150" width="100">
</body>
</html>
我想让图像从指定的大小逐渐变成最后规定的大小,可是我写了这个都只是从最开始的大小直接变成最后规定的大小了,请指点下,谢谢了
4 回复
#2
xiaoyuechuan2010-04-23 03:47
    我弄了半天也没弄出来,思路应该是这样的吧:
 
 document.images[0].height=h+i;
  document.images[0].width=w+i;
中左边的
document.images[0].height
document.images[0].width
应该建一个数组循环

楼主有了答案分享一下
#3
努力加油2010-04-23 12:51
呵呵 不是很明白 document下的image属性 你说的循环是哪里的循环啊 我这下边就一个image对象 并只对这个对象进行显示 所以用document.images[0]来调用显示....
#4
xiaoyuechuan2010-04-23 14:52
回复 3楼 努力加油
答案搞出来了么??
#5
努力加油2010-04-23 17:02
弄出来了 其实很简单的 呵呵 先前是我想多了

程序代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. xmlns="http://www. http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
function hehe(){
    var h;
    var w;
    h=parseInt(document.images[0].height);
    w=parseInt(document.images[0].width);
        document.images[0].height=h+5;
        document.images[0].width=w+5;
        if(document.images[0].height>300||document.images[0].width>300){
            document.images[0].height=69;
            document.images[0].width=100;
            }
    }
    setInterval("hehe()",100);
</script>
</head>

<body onload="hehe()">
<img id="image" src="../实例及代码/images/8_07.jpg" height="69" width="100">
</body>
</html>

1