当鼠标放到图片上图片慢慢放大(关键:以图片中心为中心放大)
当鼠标离开图片上图片慢慢缩小(关键:以图片中心为中心缩小)

解决方案 »

  1.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    <script type="text/javascript">
    var p="";
    function init(){
    var img=document.images[0];
    img.onmouseover=change;
    img.onmouseout=change;
    }
    function change(e){
    var a=e||window.event;
    var d=0;
    if(a.type=="mouseover"){
    d=1;
    }else{
    d=-1;
    }
    if(p){
    window.clearTimeout(p);
    }
    cs(this,d);
    }
    function cs(a,d){
    a.style.width=parseInt(a.style.width)+d+"px";
    a.style.height=parseInt(a.style.height)+d+"px";
    a.style.left=parseInt(a.style.left)-d+"px";
    a.style.top=parseInt(a.style.top)-d+"px";
    p=window.setTimeout(function(){cs(a,d)},100);
    }
    window.onload=init;
    </script>
    </head><body>
    <img src="csxt.jpg" style="width:400px; height:400px; position:absolute; left:100px; top:100px;" />
    </body>
    </html>
    这样看看可以不