一、transform: rotateX() rotateY() 先要将图片进行旋转。 rotateX(30deg)变成了 有点难理解。附上几何图(侧面视角)： rotateY(30deg): 同样的道理，几何图（顶部视角）： 然后就可以将图片进行旋转，准备了8张图片需要旋转的角度为（360/8 = ...
分类：
Web程序 时间：
2017-09-29 14:00:52
阅读次数：
284
HTML页面 <!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>旋转木马轮播图</title> <link rel="stylesheet" href="css/css.css"/> <!--先引工具包,在引逻辑包 ...
分类：
Web程序 时间：
2017-09-27 11:34:20
阅读次数：
136
写旋转木马的时候，突发奇想想加个遮罩效果，那当然是用box-reflect属性了，然鹅，却被overflow：hidden坑了。。。。。。。 写的效果就是不出来，太任性了有木有，代码无误呀，也没报错，但是出不来效果肯定是有原因的，原来就是手残给包图片的li标签加了个overflow：hidden，也 ...
分类：
Web程序 时间：
2017-08-13 22:13:06
阅读次数：
283
jQuery Feature Carousel 插件是国外的一比较优秀的旋转木马图片插件。 点击这里进入原文。 插件特点： 1.处理div的3d旋转木马效果。 2.支持一个中心，2个侧面的功能 3.中心区域可点击 4.显示隐藏文本功能（可以使用css显示在图片的任何位置） 5.可以修改速度，效果，等 ...
分类：
Web程序 时间：
2017-08-10 13:24:20
阅读次数：
396
博主在浏览网页时无意间发现了一种banner图的轮播方式——像旋转木马一样的轮播方式，博主感觉非常新颖独特，经过查阅资料，观看某课网教程总算搞了出来的，其原理主要利用了JQuery代码实现，好了不多说，看楼下代码及演示效果吧 首先是HTML及CSS代码 HTML CSS代码 然后是JS代码 运行可知 ...
分类：
Web程序 时间：
2017-06-26 00:33:55
阅读次数：
259
html部分 <!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>旋转木马轮播图</title> <link rel="stylesheet" href="css/css.css"/> <script type="t ...
分类：
其他好文 时间：
2017-06-19 10:59:39
阅读次数：
188
<!DOCTYPE> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="description" content="CSS3 transform实 ...
分类：
其他好文 时间：
2017-05-16 10:55:24
阅读次数：
292
html,body{ height: 100%;} *{ box-sizing:border-box;} .imgBox{ transform-style: preserve-3d; position: relative; width:100px; height: 100px; margin:200 ...
分类：
Web程序 时间：
2017-04-12 13:29:50
阅读次数：
259
虎牙是一个直播网站，很多年轻人都喜欢的网站。那天我看到虎牙的幻灯片做的挺好看的，于是就模仿着谢了一个插件，关键是它不像旋转木马幻灯片，能很好的解决偶数帧的问题，下面贴上我的源码地址：https://github.com/CuteBlackCat/huya-slider 简单介绍一下，这个幻灯片使用了 ...
分类：
其他好文 时间：
2017-04-05 17:53:52
阅读次数：
189
