喜欢前面的 发表于 2021-7-15 02:24

动图

<DIV style="LEFT: -300px; WIDTH: 1400px; POSITION: relative; TOP: 120px">
<iframe frameborder=0 width=1400 height=820 marginheight=0 marginwidth=0 scrolling=no src="http://pan.yinhuabbs.cn/view.php/d2c0c11f931a8fde2cdd0d71f2214cc0.html"></iframe>

明月佳妮 发表于 2021-7-15 06:03

七掬 发表于 2021-7-15 08:16

组幅音画是大图，你这类的只能算是幻影动画
我归过去了，下次楼主记得了

诺北 发表于 2021-7-15 08:41

七掬 发表于 2021-7-15 08:16
组幅音画是大图，你这类的只能算是幻影动画
我归过去了，下次楼主记得了

七丫，这个不算动画的

诺北 发表于 2021-7-15 08:43

这个应该归到“代码图腾”版块，楼主，我先转过去了啊

诺北 发表于 2021-7-15 08:44

不过这个旋转木马做的真漂亮，图的处理很干净，构思很巧妙，像游戏宣传网页一样，赞一个
越权加个精了

喜欢前面的 发表于 2021-7-15 10:28

七掬 发表于 2021-7-15 08:16
组幅音画是大图，你这类的只能算是幻影动画
我归过去了，下次楼主记得了

哦，知道了

喜欢前面的 发表于 2021-7-15 10:31

诺北 发表于 2021-7-15 08:44
不过这个旋转木马做的真漂亮，图的处理很干净，构思很巧妙，像游戏宣传网页一样，赞一个
越权加个精了

谢谢，{:1_292:}

195400 发表于 2021-7-15 14:28

http://www.yinhuabbs.cn/data/attachment/forum/201912/23/081932efdaeebejfcgdclj.gif


195400 发表于 2021-7-15 14:52

不知楼主如何实现的， 模拟一个效果没有楼主的好:L
<div style="width:1280px;position:relative;margin:100px 0 32px -200px;">
<SCRIPT type="text/javascript">
<!--
var Words="%3Cstyle%20type%3D%22text%2Fcss%22%3E%09%23outframe%09%7B%20%09%09width%3A1280px%3Bheight%3A640px%3B%20%09%09position%3Arelative%3Boverflow%3Ahidden%3B%09%09margin%3A16px%20auto%3B%09%09background-color%3A%23ccf%3B%09%09border-radius%3A32px%3B%09%09background-image%3Aurl(http%3A%2F%2Fpan.yinhuabbs.cn%2Fview.php%2F0f963736a89f2d4716c121a37e537f7a.jpg)%3B%09%09background-size%3Acover%3B%09%7D%09%23picHolder%20%20%20%20%20%20%20%20%7B%09%09width%3A144px%3Bheight%3A400px%3B%09%09position%3Aabsolute%3Btop%3A80px%3Bleft%3A660px%3B%09%09%2F*%E5%A3%B0%E6%98%8E%E4%B8%80%E4%B8%AA3D%E7%A9%BA%E9%97%B4*%2F%09%09transform-style%3A%20preserve-3d%3B%09%09transform%3A%20rotateX(-0.5deg)%3B%09%7D%09%23picHolder%20img%20%20%20%20%20%20%20%20%7B%09%09width%3A144px%3Bheight%3A200px%3B%09%09position%3A%20absolute%3B%09%09overflow%3Ahidden%3B%09%09-webkit-box-reflect%3A%20below%200px%20%09%09-webkit-gradient(linear%2C%20left%20top%2C%20left%20bottom%2C%20from(transparent)%2C%20to(rgba(250%2C%20250%2C%20250%2C%200.5)))%3B%09%7D%09%3Aroot%20%7B%09%09%20%20--turn%3A%20360deg%20%2F%2013%3B%09%7D%09%23picHolder%20img%3Anth-child(1)%7B%09%09transform%3A%20rotateY(0deg)%20translateZ(360px)%3B%09%09animation%3A%20animateP0%2030s%20linear%20infinite%3B%09%7D%20%09%23picHolder%20img%3Anth-child(2)%7B%09%09transform%3A%20rotateY(-60deg)%20translateZ(360px)%3B%09%09animation%3A%20animateP1%2030s%20linear%20infinite%3B%09%7D%09%23picHolder%20img%3Anth-child(3)%7B%09%09transform%3A%20rotateY(-120deg)%20translateZ(360px)%3B%09%09animation%3A%20animateP2%2030s%20linear%20infinite%3B%09%7D%09%23picHolder%20img%3Anth-child(4)%7B%09%09transform%3A%20rotateY(-180deg)%20translateZ(360px)%3B%09%09animation%3A%20animateP3%2030s%20linear%20%20infinite%3B%09%7D%09%23picHolder%20img%3Anth-child(5)%7B%09%09transform%3A%20rotateY(-240deg)%20translateZ(360px)%3B%09%09animation%3A%20animateP4%2030s%20linear%20%20infinite%3B%09%7D%09%23picHolder%20img%3Anth-child(6)%7B%09%09transform%3A%20rotateY(-300deg)%20translateZ(360px)%3B%09%09animation%3A%20animateP5%2030s%20linear%20infinite%3B%09%7D%09%2F*%E5%AE%9A%E4%B9%89%E4%B8%80%E4%B8%AA%E5%8A%A8%E7%94%BB*%2F%09%40keyframes%20animateP5%20%7B%09%090%25%20%2C%2012%25%20%7B%09%09%09transform%3A%20rotateY(-300deg)%20translateZ(360px)%20scale(1.0)%3B%09%09%7D%09%0912.1%25%20%2C%2012.3%25%20%7B%09%09%09transform%3A%20rotateY(60deg)%20translateZ(360px)%20scale(1.0)%3B%09%09%7D%09%0916.67%25%20%2C28.67%25%20%7B%09%09%09transform%3A%20rotateY(0deg)%20translateY(100px)%20translateZ(360px)%20scale(1.5)%3B%09%09%7D%09%0933.34%25%2C%2045.34%25%20%7B%09%09%09transform%3A%20%20rotateY(-60deg)%20translateZ(360px)%20scale(1.0)%3B%09%09%7D%09%0950%25%2C%2062%25%20%7B%09%09%09transform%3A%20%20rotateY(-120deg)%20translateZ(360px)%20scale(0.5)%3B%09%09%7D%09%0966.67%25%20%2C%2078.67%25%20%7B%09%09%09transform%3A%20%20rotateY(-180deg)%20translateZ(360px)%20scale(0.2)%3B%09%09%7D%09%0983.34%25%20%2C%2095.34%25%20%7B%09%09%09transform%3A%20%20rotateY(-240deg)%20translateZ(360px)%20scale(0.5)%3B%09%09%7D%09%7D%09%40keyframes%20animateP4%20%7B%09%090%25%20%2C%2012%25%20%7B%09%09%09transform%3A%20%20rotateY(-240deg)%20translateZ(360px)%20scale(0.5)%3B%09%09%7D%09%0916.67%25%20%2C28.67%25%20%7B%09%09%09transform%3A%20%20rotateY(-300deg)%20translateZ(360px)%20scale(1.0)%3B%09%09%7D%09%0928.77%25%20%2C28.97%25%20%7B%09%09%09transform%3A%20%20rotateY(60deg)%20translateZ(360px)%20scale(1.0)%3B%09%09%7D%09%0933.34%25%2C%2045.34%25%20%7B%09%09%09transform%3A%20%20rotateY(0deg)%20translateY(100px)%20translateZ(360px)%20scale(1.5)%3B%09%09%7D%09%0950%25%2C%2063%25%20%7B%09%09%09transform%3A%20%20rotateY(-60deg)%20translateZ(360px)%20scale(1.0)%3B%09%09%7D%09%0966.67%25%20%2C%2078.67%25%20%7B%09%09%09transform%3A%20%20rotateY(-120deg)%20translateZ(360px)%20scale(0.5)%3B%09%09%7D%09%0983.34%25%20%2C%2095.34%25%20%7B%09%09%09transform%3A%20%20rotateY(-180deg)%20translateZ(360px)%20scale(0.2)%3B%09%09%7D%09%7D%09%40keyframes%20animateP3%20%7B%09%090%25%20%2C%2012%25%20%7B%09%09%09transform%3A%20%20rotateY(-180deg)%20translateZ(360px)%20scale(0.2)%3B%09%09%7D%09%0916.67%25%20%2C28.67%25%20%7B%09%09%09transform%3A%20%20rotateY(-240deg)%20translateZ(360px)%20scale(0.5)%3B%09%09%7D%09%0933.34%25%2C%2045.34%25%20%7B%09%09%09transform%3A%20%20rotateY(-300deg)%20translateZ(360px)%20scale(1.0)%3B%09%09%7D%09%0945.44%25%2C%2045.64%25%20%7B%09%09%09transform%3A%20%20rotateY(60deg)%20translateZ(360px)%20scale(1.0)%3B%09%09%7D%09%0950%25%2C%2063%25%20%7B%09%09%09transform%3A%20%20rotateY(0deg)%20translateY(100px)%20translateZ(360px)%20scale(1.5)%3B%09%09%7D%09%0966.67%25%20%2C%2078.67%25%20%7B%09%09%09transform%3A%20%20rotateY(-60deg)%20translateZ(360px)%20scale(1.0)%3B%09%09%7D%09%0983.34%25%20%2C%2095.34%25%20%7B%09%09%09transform%3A%20%20rotateY(-120deg)%20translateZ(360px)%20scale(0.5)%3B%09%09%7D%09%7D%09%40keyframes%20animateP2%20%7B%09%090%25%20%2C%2012%25%20%7B%09%09%09transform%3A%20%20rotateY(-120deg)%20translateZ(360px)%20scale(0.5)%3B%09%09%7D%09%0916.67%25%20%2C28.67%25%20%7B%09%09%09transform%3A%20%20rotateY(-180deg)%20translateZ(360px)%20scale(0.2)%3B%09%09%7D%09%0933.34%25%2C%2045.34%25%20%7B%09%09%09transform%3A%20%20rotateY(-240deg)%20translateZ(360px)%20scale(0.5)%3B%09%09%7D%09%0950%25%2C%2063%25%20%7B%09%09%09transform%3A%20%20rotateY(-300deg)%20translateZ(360px)%20scale(1.0)%3B%09%09%7D%09%0963.1%25%2C%2063.3%25%20%7B%09%09%09transform%3A%20%20rotateY(60deg)%20translateZ(360px)%20scale(1.0)%3B%09%09%7D%09%0966.67%25%20%2C%2078.67%25%20%7B%09%09%09transform%3A%20%20rotateY(0deg)%20translateY(100px)%20translateZ(360px)%20scale(1.5)%3B%09%09%7D%09%0983.34%25%20%2C%2095.34%25%20%7B%09%09%09transform%3A%20%20rotateY(-60deg)%20translateZ(360px)%20scale(1.0)%3B%09%09%7D%09%7D%09%40keyframes%20animateP1%20%7B%09%090%25%20%2C%2012%25%20%7B%09%09%09transform%3A%20%20rotateY(-60deg)%20translateZ(360px)%20scale(1.0)%3B%09%09%7D%09%0916.67%25%20%2C28.67%25%20%7B%09%09%09transform%3A%20%20rotateY(-120deg)%20translateZ(360px)%20scale(0.5)%3B%09%09%7D%09%0933.34%25%2C%2045.34%25%20%7B%09%09%09transform%3A%20%20rotateY(-180deg)%20translateZ(360px)%20scale(0.2)%3B%09%09%7D%09%0950%25%2C%2063%25%20%7B%09%09%09transform%3A%20%20rotateY(-240deg)%20translateZ(360px)%20scale(0.5)%3B%09%09%7D%09%0966.67%25%20%2C%2078.67%25%20%7B%09%09%09transform%3A%20%20rotateY(-300deg)%20translateZ(360px)%20scale(1.0)%3B%09%09%7D%09%0978.77%25%20%2C%2078.97%25%20%7B%09%09%09transform%3A%20%20rotateY(60deg)%20translateZ(360px)%20scale(1.0)%3B%09%09%7D%09%0983.34%25%20%2C%2095.34%25%20%7B%09%09%09transform%3A%20%20rotateY(0deg)%20translateY(100px)%20translateZ(360px)%20scale(1.5)%3B%09%09%7D%09%7D%09%40keyframes%20animateP0%20%7B%09%090%25%20%2C%2012%25%20%7B%09%09%09transform%3A%20%20rotateY(0deg)%09translateY(100px)%20translateZ(360px)%20scale(1.5)%3B%09%09%7D%09%0916.67%25%20%2C28.67%25%20%7B%09%09%09transform%3A%20%20rotateY(-60deg)%09translateZ(360px)%20scale(1.0)%3B%09%09%7D%09%0933.34%25%2C%2045.34%25%20%7B%09%09%09transform%3A%20%20rotateY(-120deg)%09translateZ(360px)%20scale(0.5)%3B%09%09%7D%09%0950%25%2C%2063%25%20%7B%09%09%09transform%3A%20%20rotateY(-180deg)%09translateZ(360px)%20scale(0.2)%3B%09%09%7D%09%0966.67%25%20%2C%2078.67%25%20%7B%09%09%09transform%3A%20%20rotateY(-240deg)%09translateZ(360px)%20scale(0.5)%3B%09%09%7D%09%0983.34%25%20%2C%2095.34%25%20%7B%09%09%09transform%3A%20%20rotateY(-300deg)%09translateZ(360px)%20scale(1.0)%3B%09%09%7D%09%0995.44%25%20%2C%2095.64%25%20%7B%09%09%09transform%3A%20%20rotateY(60deg)%09translateZ(360px)%20scale(1.0)%3B%09%09%7D%09%09%09%7D%3C%2Fstyle%3E%3Cdiv%20id%3D%22outframe%22%3E%09%3Cdiv%20id%3D%22picHolder%22%3E%09%09%3Cimg%20src%3D%22http%3A%2F%2Fpan.yinhuabbs.cn%2Fview.php%2F4dbfc9641264b34d13a7028aab674538.png%22%20%3E%09%09%3Cimg%20src%3D%22http%3A%2F%2Fpan.yinhuabbs.cn%2Fview.php%2Fed26c44dcc117ff29e882e04664fba7a.png%22%3E%20%09%09%3Cimg%20src%3D%22http%3A%2F%2Fpan.yinhuabbs.cn%2Fview.php%2F6fd7a3aa5698cf84397bf495943e9bdf.png%22%20%3E%09%09%3Cimg%20src%3D%22http%3A%2F%2Fpan.yinhuabbs.cn%2Fview.php%2Fe958e6b6c30a222b6492b8e33c133802.png%22%20%3E%09%09%3Cimg%20src%3D%22http%3A%2F%2Fpan.yinhuabbs.cn%2Fview.php%2F64821542595cb53b5df85e759c67f9e1.png%22%3E%09%09%3Cimg%20src%3D%22http%3A%2F%2Fpan.yinhuabbs.cn%2Fview.php%2F0d5e83cc3577ba182f57796b20116d19.png%22%3E%20%09%3C%2Fdiv%3E%3C%2Fdiv%3E";
function SetNewWords()
{
        var NewWords;
        NewWords=unescape(Words);
        document.write(NewWords);
}
SetNewWords();
// -->
</SCRIPT>
</div>
页: [1] 2
查看完整版本: 动图