2019年09月10日 阅读：5805
之前看过一个主题，忘记是谁的了，他的首页轮播特别好看，当时我还天真的以为他的轮播的背景色是自动获取的，为此还特意自己去看了下自动获取图片平均色，现在学了jq后尝试性仿写了一个，因为找不到原来主题的地址，所以大部分都是凭借自己的印象做的，有能力者可以自行移植到typecho主题上。
先上图：
响应式预览：
功能特性：
采用jquery 3.4.1 图片预加载 自动提取对应的内容 增加自动轮播功能 可以自行移植到主题上使用 响应式功能完善，只是320分辨率及以上设备
轮播图demo
本文系作者 @木灵鱼儿 原创发布在木灵鱼儿 - 有梦就能远航站点。未经许可，禁止转载。
泽泽
Google Chrome MacOS手机端样式保持不变就行，左侧的文字信息其实不用展示那么多，有标题和描述文字即可:huaji:【试图让你支持移动端】
木灵鱼儿
FireFox Windows 10我有个疑问，如果这边写了media only screen and (max-width:900px) and (min-width:300px;){}这个媒体查询会不会冲突，你自己又写了一个这个分辨率内的媒体查询，虽然里面的css设置的元素不一样
泽泽
Google Chrome MacOS不会冲突，如果即使里面设置的元素一样，也是以后面的为准
木灵鱼儿
FireFox Windows 10那就还行
泽泽
Google Chrome MacOS之前qingyi模板的夜间模式就是重写css样式，覆盖掉默认样式:weixiao:，话说你模板能不能点击完表情就自动把表情框关掉啊，每次点完还以为没点上呢:xiaoku:
木灵鱼儿
FireFox Windows 10要是点多个那不是每次都要点开，不是更麻烦
泽泽
Google Chrome MacOS很酷，不过轮播居然没有自动轮播，仿佛失去了灵魂。。。:kaixin::kaixin:
木灵鱼儿
FireFox Windows 10自动轮播还不简单，直接做个setInterval()，然后里面隔一段时间模拟点击就行了，还挺简单的，然后再做个判断，当hover状态时删除这个定时器，离开时重新设置即可
泽泽
Google Chrome MacOS等你写好有需要的时候直接拿:huaji:
木灵鱼儿
FireFox Windows 10好说好说