问答详情
源自：4-1 编程挑战

js怎么控制我这个div里的图片放大缩小

<!doctype html>
<html>
 <head>
  <meta charset="utf-8">
  <title>周海的个人网站</title>
  <meta name="viewport" content="width=device-width,initial-scale=1"/>
  <link rel="stylesheet" href="styles.css">
   <base target="_blank">
   <style type="text/css">
  body{
  background:url("imges/background.jpg");
  background-repeat:no-repeat;
  background-size:100% 100%;
  background-position-x:50%;
  }
  </style>
 
    
</head>
<body >
  <div class="header">
       <a class="logo" ><img src="imges/logo.png" ></a>
       <p class="font"> Manifest oneself  </p>
 </div>
 

 <div class="nav">

   <ul>

      <li><a href="#">首页</a></li>

      <li><a href="#">素描</a></li>

      <li><a href="#">油画</a></li>

      <li><a href="#">水粉</a></li>

      <li><a href="#">水彩</a></li>

      <li><a href="#">速写</a></li>

      <li><a href="#">同学回忆录</a></li>

  </ul>

</div>

<div id="bob">

    <img src="imges/01.jpg" width="200" height="200">
    <img src="imges/02.jpg" width="200" height="200">
    <img src="imges/03.jpg" width="200" height="200">
    <img src="imges/04.jpg" width="200" height="200">
    <img src="imges/05.jpg" width="200" height="200">
    <img src="imges/06.jpg" width="200" height="200">
    <img src="imges/07.jpg" width="200" height="200">
    <img src="imges/08.jpg" width="200" height="200">
     
</div>
 
 
  <script type="text/javascript" src="test.js"></script>

 
</body>
</html>  

 
 

提问者：慕斯4282661 2017-06-16 12:22

个回答

  • qq_枯叶蝶_3
    2017-06-16 18:05:29

      <script type="text/javascript" src="test.js">

       

    var aImg=document.getElementById("div's Id").getElementsByTagName('img');

    for(var i=0;i<aImg.length;i++){

          aImg[i].style.height="the height you want";

          aImg[i].style.width="the width you want";

    }

    </script>

    0