关闭

JS----图片显示出来后放大缩小

115人阅读 评论(0) 收藏 举报
分类:
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script>
        window.onload=function()
        {
            /*var divpostion = document.getElementById("bu1");
            divpostion.style.position="absolute";
            divpostion.style.top=700;
            divpostion.style.left=700;*/


        }
        function show()
        {
            var divdo = document.getElementById("a");
            divdo.innerHTML="<img src='xx.jpg' id='im'>"
            var dis =document.getElementById("im");
            dis.height=300;
            dis.width=300;
        }
        function big()
        {
                 var di =document.getElementById("im");


                di.height= di.height+100;
                  di.width=di.height+100;
        }
        function ss()
        {
            var di =document.getElementById("im");
            di.height= di.height-100;
            di.width=di.height-100;
        }
    </script>
</head>
<body>
  <div id="a">xxxx</div>
<form>
    <input type="button"onclick="show()">
    <input type="button" value="放大"onclick="big();" id="bu1" style="position: absolute;top: 600px;left: 500px" >
    <input type="button" value="缩小"onclick="ss();" id="bu2"style="position: absolute;top: 600px;left: 700px" >
    <input>
</form>
</body>
</html>
0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:26056次
    • 积分:1104
    • 等级:
    • 排名:千里之外
    • 原创:83篇
    • 转载:18篇
    • 译文:2篇
    • 评论:0条
    文章分类