jQuery围绕xy轴旋转矩形

小男孩

我有一个矩形div,其左上角的宽度为200px,高度为100%。我想在该div内放置一个图像,但是该图像是横向的(w:1024 h:200)我以为没有概率只是旋转它,我可以这样做,但是我不能定位它。因此,在这里需要一些帮助,将其定位在左上方!

$('.header_rotate').css({                              
transform: 'rotate('+ -90 +'deg)',                                                                                    
backgroundColor: 'green',
height: '100%',
width: '200'                      
})

<div class="header">
  <div class="header_rotate">
      <img id="logo" src="img/Logo_Design_2048x410.png" />
  </div>
 </div>

菲斯德尔

莎玛

使用transform:rotate(90deg),您可以添加translateX和translateY以将其恰好定位。

$('.header_rotate').css({

  transform: 'translateX(-130px) translateY(200px) rotate(90deg)',
  backgroundColor: 'green',
  height: '200',
  width: '600',
});

这是小提琴:

http://jsfiddle.net/dRvy8/2/

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章