寒江雪润 发表于 2018-3-6 10:39:40

html+css+js魔方旋转

<div style="LEFT: -200px;WIDTH:1000px; POSITION: relative; TOP: 200px">
<iframe marginwidth="0" marginheight="0" src="http://wp.zyxqw.com/wp/userfiles/hanjiangxuerun/123/index1%20.html" frameborder="0" width="1000" scrolling="no" height="600"></iframe></div>

<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><div><br /></div>

寒江雪润 发表于 2018-3-6 10:40:13

此帖子适用浏览器：360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. 不支持IE8及以下浏览器。

否则，只能看到平面效果，看不到立体效果。

html还不成熟，尚未建立统一的平台标准，所以有些浏览器不匹配其插件代码。

<embed height="1" style="MARGIN: 0px" pluginspage="http://www.macromedia.com/go/getflashplayer" allownetworking="internal" align="center" width="0" allowscriptaccess="never" quality="high" invokeurls="false" src="http://wp.zyxqw.com/wp/userfiles/hanjiangxuerun/lztx/nrh.swf" type="application/x-shockwave-flash" wmode="transparent"></div>

寒江雪润 发表于 2018-3-6 10:41:33

把鼠标放上去图片透明度增加。

寒江雪润 发表于 2018-3-6 10:42:25

<div style="LEFT: -200px;WIDTH:1000px; POSITION: relative; TOP: 200px">
<iframe marginwidth="0" marginheight="0" src="http://wp.zyxqw.com/wp/userfiles/hanjiangxuerun/123/index1.3.html" frameborder="0" width="1000" scrolling="no" height="600"></iframe></div>

<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><div><br /></div>

寒江雪润 发表于 2018-3-6 10:43:21

魔方的原理是先由代码建立透明立体框，然后将图片黏贴上去。

欧阳风刀 发表于 2018-3-6 18:36:08

神奇的魔方，视觉效果漂亮！

欧阳风刀 发表于 2018-3-6 18:36:30

感谢哥们精彩分享！

云朵朵 发表于 2018-3-6 19:02:48

寒江雪润 发表于 2018-3-6 10:41
把鼠标放上去图片透明度增加。

把鼠标放上去，有2个头像重叠在一起

云朵朵 发表于 2018-3-6 19:03:48

很不错的制作，充满了不一般的味道.............

醉雪胡杨 发表于 2018-3-6 23:30:58

魔方旋转太妙了，欣赏问好雪润！
页: [1] 2
查看完整版本: html+css+js魔方旋转