Maison  >  Article  >  interface Web  >  想在页面实现图片随意旋转功能_html/css_WEB-ITnose

想在页面实现图片随意旋转功能_html/css_WEB-ITnose

WBOY
WBOYoriginal
2016-06-24 12:23:541625parcourir

旋转 拖动 图片 叠加

大致是一个在页面放置几个图片,然后图片以不同的角度,不同的位置分布,最好还可以实现叠加,拖动。
不知道有没有哪位大神有思路的   小弟实在没有思路啊    不知如何下手    谢谢指导

回复讨论(解决方案)

 

http://threedubmedia.com/code/event/drag/#demos

用flash来做效果更好,几乎什么效果都能实现。

拖动还好实现 网上代码很多,你要学 Photoshop  一样 搞个工具栏, 旋转角度 , 上一层,下一层 按钮
拖动 mousedown 记住当前鼠标,元素位置, mousemove ,left,top=当前鼠标位 - mousedown 时偏移量
  ,旋转角度,你看一下css3 ,IE 的滤镜, 层次就改变 z-index

大致是一个在页面放置几个图片,然后图片以不同的角度,不同的位置分布,最好还可以实现叠加,拖动。
不知道有没有哪位大神有思路的   小弟实在没有思路啊    不知如何下手    谢谢指导
哥来帮你理下思路
首先解决角度  就是旋转问题  旋转要考虑几点  1)浏览器的支持 2)旋转的中心点
其次 叠加 拖动  就是一个坐标问题把 1)以左上角为基准 设置元素的位置

核心功能就这样 

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn