运用JavaScript实现网页上图片与文字的放大与缩小

部分具体代码如下:

<script type="text/javascript">
  var size=20;
  function changeStyle(state){
      var a1=document.getElementById('link1');
      if(state=='up'){
          size+=5;
          a1.style.fontSize=size+'px';
      }else{
          size-=5;
           a1.style.fontSize=size+'px';
          }
      }
      
</script>
</head>

<body>
<p id="link1"> jagbfieabv</p>
<input type="button" value="bigger" onclick="changeStyle('up')" />//放大按钮
<input type="button" value="smaller" onclick="changeStyle('down')" />//缩小按钮

</body>

当点击放大按钮时,字体也会放放大,同样,再点击缩小按钮,字体也会缩小,

猜你喜欢

转载自my.oschina.net/u/3820352/blog/1818415