• 技术文章 >web前端 >H5教程

    CSS transform中rotate能不能实现以对角线为轴进行旋转?

    2016-06-07 08:43:48原创1886
    如图中名为in的div,用rotate以AD为轴进行“斜的旋转”可以实现吗?
    我进行的尝试,transform-origin属性好像只能将坐标轴进行偏移但没办法令其旋转,所以旋转的轴都是水平或者垂直的...rotateX()和rotateY()的搭配也不太可行...
    要怎么样才能实现这种旋转?

    回复内容:

    谢邀,
    你的需求和origin并没有直接的关系。
    就在你当前页改的哦:

    结果:
    前三个是(x,y,z)矢量坐标, 第四个是角度

    而且,既然transform是支持matrix函数的,理论上是可以应用任意三维变换的,同学你思维不用停留在css提供的便利函数。

    你甚至也可以不使用transform而使用别的css属性配合矩阵运算来实现3d,就更灵活了,安利下之前做的DEMO
    GitHub - leeluolee/clip3d: 3D rendering with css:clip-path


    当然实用性目前接近0 谢邀
    用rotate3d(1,1,0,xxdeg) xx是角度值 对于这种情形,你应该使用 matrix3d 做矩阵变化的运算
    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    上一篇:各视频站做到自动切换flash和html5播放器的难度有多大? 下一篇:自己动手写 PHP MVC 框架(40节精讲/巨细/新人进阶必看)

    相关文章推荐

    • html5 实现客户端验证上传文件的大小(简单实例)_html5教程技巧• html5的离线缓存• HTML4和HTML5之间的10个主要不同• 避免常见的六种HTML5错误用法 (5-6)• 小强的HTML5移动开发之路(11)——链接,图片,表格,框架
    1/1

    PHP中文网