首页
学习
活动
专区
工具
TVP
发布

Hexo添加首页置顶轮播

前言 在写系列博文时对于某一篇文章的寻找过程会比较繁琐(对于博主而言自然会简单些,但是对于访客来讲就没那么轻松),因此参考Akilar的博文弄了一个置顶轮播图。...可以把系列博文的链接汇总起来做一个索引,放置在轮播图中。这样既可以展示博主想对外展示的内容,又方便快速进行文章跳转。 效果可以在博客首页查看。 本篇教程会涉及大量源码的改动,对缩进有严格要求。...data-pjax src=url_for(theme.CDN.swiper_init)) 2.在路径\themes\butterfly\layout修改文件index.pug,添加以下两行代码(注意缩进)引入轮播图板块...修改文件_config.butterfly.yml,在CDN模块下添加如下代码: # 首页轮播图 swiper_js: https://cdnjs.cloudflare.com/ajax/libs/

95120

源计划-方舟:首页轮播

点击查看更新记录 更新记录 2023-01-03:内测版 沿用源计划-方舟:首页卡片的配色方案,建议一起使用。...首页轮播图采用液晶屏风格设计 窄屏样式已适配 点击查看参考教程 参考方向 教程原贴 参考了UI风格和配色样式 Neon-Space-Rainmeter 参考了UI风格和配色样式 JARVIS-Highpitched-OS...npm uninstall hexo-butterfly-swiper --save 本篇沿用了源计划-方舟:首页卡片中用到的部分方案,为保证样式完整,且避免报错,推荐先完成首页卡片的魔改后再考虑使用本方案...如果没完成首页卡片,那么大概率绝对会报错。...# 源计划-方舟:首页轮播图 # see https://akilar.top/posts/658f52d0/ swiperBar: enable: true # 开关 timemode: updated

57210
您找到你想要的搜索结果了吗?
是的
没有找到

使用 UICollectionView 实现首页卡片轮播效果

UICollectionView 是 iOS6 之后引入的一个新的 UI 控件,与 UITableView 有着很多相似的地方,在开发过程中我们都会选择使用它们俩来为 App 的整个页面进行布局,比如说淘宝的首页...如何使用 UICollectionView 实现网易云首页卡片轮播效果。...思路分析 通过观察上面的图我们可以得出,这个网易云的轮播控件有三个特点,分别是: 1.支持图片手动横向滚动2.支持图片自动的滚动播放3.底部的分页控件会高亮显示出当前的图片是哪一张 好了,既然已经分析出来了它的特点...if autoScroll { self.setupTimer() } } } // 轮播时间间隔 public...万事具备,只欠东风啊(数据),最后还得给轮播控件提供一个对外的数据加载接口,代码如下: // 网络图片URL private var imageUrlStrArray: [BannerModel

1.7K20

开发日志2021530-首页轮播图性能

1 首页性能 1.1 问题 突然发现刚刚开发完成的首页性能损耗较大,通过火狐浏览器调试发现、平均fps降到了35左右。...页面已经出现明显卡顿 1.2 查找原因 切换其他页面后,fps恢复到60左右,这说明不是全局变量或者函数的影响 因此问题范围定在了首页 通过火狐性能调试器查看:页面有大量的样式计算和重绘 因为之前首页做了轮播图...,所以立马就考虑到是不是轮播的问题 首页轮播图是通过改变optiacty值来做淡入淡出效果的,所以打印了日志,发现轮播一次react组件的更新竟高达200多次。...,保持现在展示的组件不变,并把即将展示的组件按html标签顺序规则,将它置于当前展示组件的底部。...下一次轮播就重复上述过程 这样也就达到了淡入淡出的效果,也尽可能不去影响太多性能

41920

Android首页无限轮播功能的示例代码

最近工作不是很忙,也跟大神学习下总结一些小的技术点: 对于一个App几乎都有Banner广告功能,也就是我们常见的轮播图,当然目前市场第三方框架已经非常成熟了,尤其是youth5201314/banner...这里有github地址也可以学习下:https://github.com/youth5201314/banner.git 那么下面给大家介绍我的一些总结: 首先分析下轮播图的设计 多张轮播图定时效果...指示点以及每张图片的文字说明 实现无限轮播,可滑动,图片点击事件 开始布局: <RelativeLayout xmlns:android="http://schemas.android.com/...Override public int getItemPosition(Object object) { return POSITION_NONE; } } 在这里面也遇到一些问题,做了一些“妥协”,比如说无限<em>轮播</em>的时候发现播放到最后一张时会返回到第一张再次<em>轮播</em>...所以我做了个“妥协的处理”,就是在播放到最后一张时,取消自带的动画效果,直接跳转到第一张,然后进行<em>轮播</em>。

1K20
领券