你的js代码开始的那句oGCtranslate100，100改变了绘图的原点，虽然你清除的图形宽高设置够所以你clearRect清楚画布的时候只清除了一点点正确写法oGCclearRect0，0，oCwidth，oCheight你可以吧其余代码注释掉看；分享一款效果挺不错的HTML5 3D文字特效，首先文字本身具有投影的立体效果，再加上文字的旋转摆动动画，就更显文字3D动感了之前我们也分享过几款挺不错的HTML5文字特效，像HTML5CSS3 3D文字特效 文字外翻效果，也具有3D；ltdivltbodylthtml效果如下对于英文，IE还有一种方式，使用mswritingmode，中文只能竖排，不能旋转，英文可以 mswritingmodetbrl；首先你要在html页面头部加上下面的代码，其次你要把页面中的宽度修改为百分比，不能不用固定尺寸，一些小的模块可以用固定尺寸再就是css中要应用到媒体查询，也就是@media，不懂可以百度ltmeta name=quotviewportquot content=；首先save是保存当前状态，restore是返回上一次保存的状态你画出quot文字1quot，后旋转，后返回相当于没有旋转，最后才画quot文字2quot，所以两次文字都不旋转其次rotate的参数不是角度制，而是弧度制MahtPI相当于180；你试试 S_login_top，S_login_bottom margin0px 0px 0px 0pxpadding0px 0px 0px 0pxbackgroundimageurlSpritesSpritespng S_login_topwidth420pxheight23pxbackgroundposition；transform rotate360deg ltstyleltheadltbodyltimg src=quotquot alt=quot没图片quot width=quot100pxquot height=quot100pxquotltbodylthtml这是旋转效果， 换图你是想怎么个换法。

2然后在上方的head标签中的style标签设置样式，这里设置图片的宽度和高度并设置相对定位，然后设置图片的鼠标悬浮样式，其中设置动画的形式为3d以及设置图片3d旋转偏移的角度，添加一个动画，设置好延时即可3最后打开浏览器；lt！DOCTYPE HTMLlthtmlltheadltmeta charset=UTF8lttitleYuGiOhlttitleltstyle type=quottextcssquot#div position absolutetop 50pxleft 300pxwidth 300pxheight 300pxlineheight 300pxtextalign；html5鼠标悬停字体从下移到上移，需要配合鼠标甚至功能键来操作的，如果字体从下一道单一，我们只需要把鼠标中间的滑轮整体把他按下，然后不放手，慢慢的移动鼠标从下移到上移，在移动的过程中，我们需要有一定，鼠标操作技巧；将你的 canvas 旋转一定的角度 绘制出你想要的文字 例如 需求 1，一行水平文字quotI love youquot2，一行与1中的文字成45度角的文字 html 代码 ltcanvas id=quotmyCanvasquot width=quot300quot height=quot300quot styl；contexttranslate圆心x， 圆心y接下来就是转圈 你要先设定一个转速时间例如 6000ms 再用自订 function animateRotate 和 function drawanimateRotate 这里写你想要的转圈效果 draw draw context；你可以用phoneGap 这个跨的框架 phoneGap就是封装了一堆的方法，通过js去调用ios 或者 android系统的一些应用 例如拍照上传，获取联系人定位，重力，方向感应等等 这些套装，可以在各种上使用 建议查看phoneGap资料。

html5中引入3d模型的方法是借助第三方PlayCanvas插件来完成的比如可以用以下方法实现图片的360度旋转代码示例var render， loop， t， dt， 定义变量 DEG2RAD = MathPI 180， 角度转弧度 cvs =；给html添加head标签，在标签中定义样式ltstyle p border1px solid red img floatleft margin0 5px 5px 0 ltstyle 用chrome浏览器打开上面的html文件，可以看到文字绕排效果，如下图所示 由于在引入。

首先是HTML代码，非常简单，列出我们需要渲染的文字ltdiv class=quotfooquot ltspan class=quotletterquot dataletter=quotAquotAltspan ltspan class=quotletterquot dataletter=quotBquotBltspan ltspan class=quotletterquot dataletter；语义特性ClassSemanticHTML5赋予网页更好的意义和结构更加丰富的标签将随着对RDFa的，微数据与微格式等方面的支持，构建对程序对用户都更有价值的数据驱动的Web本地存储特性Class OFFLINE STORAGE基于HTML5；lt！doctype html lthtml lthead ltmeta charset=quotutf8quot lttitle旋转lttitle ltstyle margin0 padding0 border0 div width200px height200px marginleft100px margintop100px img。