如何在按钮单击一次就把图片变大,然后再单击一次图片又变小,我做了个if语句判断


http://jsbin.com/tumedofono/edit?html,css,js,output

按钮


 $("button").click(function(){  //单击一次图片就变大 再单击一次图片又恢复刚才的样子。怎么玩?
     if($("img").attr("width","280")){ 
         $("img").attr("width","1180");
     }else{
         $("img").attr("width","280");
     }
 });

jquery htm css JavaScript

cat9527 9 years, 3 months ago

给IMG添加一个属性之类值(或者其他无论什么的可以有个值就行)的来标记状态。
如果是放大的状态。点击就缩小。
如果是缩小。点击就放大。
一点思路。。

http://jsbin.com/monigeyafe/edit?html,output

简单改了一下。。

水无月双子 answered 9 years, 3 months ago

偷懒的做法, 定义一个样式, 然后用 toggleClass 来实现.


 <!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.11.3.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
  <style>
  .nw{width:180px;}
  </style>
</head>
<body>
<img src="http://www.w3school.com.cn/i/eg_smile.gif">
<button>1180像素</button>
<script>
    $("button").click(function(){
        $("img").toggleClass('nw');
    });
</script>
</body>
</html>


普通做法:


 $("button").click(function(){
        var img = $('img');

        img.width(img.width() == 1180 ? 280 : 1180);
    });

没事玩路过 answered 9 years, 3 months ago

Your Answer