码迷,mamicode.com
首页 > Web开发 > 详细

通过js修改图片的css样式,实现简单的图片旋转

时间:2015-03-13 14:18:37      阅读:182      评论:0      收藏:0      [点我收藏+]

标签:

html代码:

<img style="max-width: 700px; transform: rotate(360deg);" src="/image/test1.img" class="image1">

<input type="hidden" value="0" name="tran_num1">

<a href="javascript:;" class="rotate" image_id="1">旋转</a>

 

js代码:

$(‘.rotate‘).click(function () {

    var id = $(this).attr(‘image_id‘);

  var num = $(‘input[name=tran_num‘ + id + ‘]‘).val();

  var num = Number(num) + 1;

    var i = 90 * num;

  $("#image"+id).css("transform", "rotate(" + i + "deg)");

  if (num == 4) {

    var num = 0;

  }

  $(‘input[name=tran_num‘ + id + ‘]‘).val(num);

})

 

通过js修改图片的css样式,实现简单的图片旋转

标签:

原文地址:http://www.cnblogs.com/YTzZ/p/4334855.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!