LM_ReadImgMode.js PC单页轮播读图模式组件,零依赖!
LM_ReadImgMode.js
PC单页轮播读图模式组件,零依赖!
github:http://dtdxrk.github.io/LM-ReadImgMode/
TXT
1.全新的2.0版本,脱离对于jQuery的依赖,压缩后只有2k。
2.逻辑层跟业务完全脱离,不带缩略图滚动功能,只有底层的翻页功能。
3.增加了对外的接口方法。
Works


CDN
http://dtdxrk.github.io/LM_ReadImgMode/LM_ReadImgMode-min.js
Demo
USE
生成一个单页轮播读图组件的实例
var box = new LM_ReadImgMode({
imgID : @sting, //轮播的图片id *必填
aImg : @Array, //轮播图片url的数组 *必填
isAuto : @Boole //是否自动播放 (默认或省略为暂停)
});
当前页数 从1开始
box.page = number;
总页数
box.tote = number;
跳转到number页
box.jump(number)
翻页开始(fn执行翻页开始前的方法)
box.onPageStart(fn);
翻页结束(fn执行翻页结束后的方法)
box.onPageEnd(fn);
上一张
box.prev();
下一张
box.next();
上一张到头事件(fn执行需要的方法)
box.prevEnd(fn);
下一张到头事件(fn执行需要的方法)
box.nextEnd(fn);
是否自动播放(设置布尔值)
box.isAuto = false;
自动播放时间(默认6000毫秒)
box.autoTime = 6000;
自动播放
box.autoPlay();
自动播放暂停
box.autoStop();
LM_ReadImgMode.js PC单页轮播读图模式组件,零依赖!的更多相关文章
- 【JavaScript】案例二:使用JS完成首页轮播图效果——事件(onclick&onload)
1.切换图片例子: 事件(onclick) <!DOCTYPE html> <html> <head> <meta charset="UTF-8&q ...
- 使用JS完成首页轮播图效果
获取document.getElementById("id名称"); 事件onload 定时操作setInterval("changeImg()",3000); ...
- JavaScript学习——使用JS实现首页轮播图效果
1.相关技术 获取元素 document.getElementById(“id 名称”) 事件(onload) 只能写一次并且放到body标签中 定时操作:setInterval(“changeImg ...
- Vue.js示例:树型视图; 模式组件;
树型图 本示例是一个简单的树形视图实现,它展现了组件的递归使用. mycode pen:https://codepen.io/chentianwei411/pen/KGKQxE 重点:递归是如何形成的 ...
- JS+css3焦点轮播图PC端
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 【VIP视频网站项目二】搭建爱奇艺优酷腾讯视频官网首页轮播图效果及实现原理分析
这个是实现的效果,基本上轮播效果和主流网站的一致,但是我也在上面优化了一些效果, 可以在线预览效果:https://vip.52tech.tech/ 目前项目代码已经全部开源:项目地址:https:/ ...
- 商城05——首页轮播图显示实现&Redis环境搭建&Redis实现缓存
1. 课程计划 1.首页轮播图的展示 2.首页大广告展示流程图 3.Redis的常用命令 4.Redis的服务器搭建 (集群的搭建) 5.向业务逻辑中添加缓存 6.Jedis的使用(redis的客 ...
- 用jQuery实现优酷首页轮播图
▓▓▓▓▓▓ 大致介绍 看到了一个轮播图的思路,就想的自己动手实践一下,总体来说用jQuery实现起来简单多了 如果对代码中使用的方法有疑问,可以参考我的jQuery学习之路(持续更新),里面有讲解: ...
- 关于用jQuery知识来实现优酷首页轮播图!
▓▓▓▓▓▓ 大致介绍 看到了一个轮播图的思路,就想的自己动手实践一下,总体来说用jQuery实现起来简单多了 如果对代码中使用的方法有疑问,可以参考我的jQuery学习之路(持续更新),里面有讲解: ...
随机推荐
- php自定义函数之变量函数
在之前的变量部份,我们学习了可变变量.可变函数仅仅是可变变量的一个变种.变形表达.大理石平台价格表 可变函数,我们也会称呼为变量函数.简单回顾一下之前的知识点: <?php $hello = ...
- Intel 8086 CPU
一.8086概述 Intel8086拥有四个16位的通用寄存器,也能够当作八个8位寄存器来存取,以及四个16位索引寄存器(包含了堆栈指标).资料寄存器通常由指令隐含地使用,针对暂存值需要复杂的寄存器配 ...
- COM Error Code(HRESULT)部分摘录
Return value/code Description 0x00030200 STG_S_CONVERTED The underlying file was converted to compou ...
- Linux 的磁盘格式化、挂载、磁盘检验、df、du、fdisk、free命令的使用
df:列出文件系统的整体磁盘使用量du:检查磁盘空间使用量fdisk:用于磁盘分区 free:查看内存占用情况 一.df命令列出系统的整体磁盘使用量 df命令参数功能:检查文件系统的磁盘空间占用情况. ...
- Codeforces Round #557 题解【更完了】
Codeforces Round #557 题解 掉分快乐 CF1161A Hide and Seek Alice和Bob在玩捉♂迷♂藏,有\(n\)个格子,Bob会检查\(k\)次,第\(i\)次检 ...
- 16、job触发流程原理剖析与源码分析
一.以Wordcount为例来分析 1.Wordcount val lines = sc.textFile() val words = lines.flatMap(line => line.sp ...
- 获取句柄的类型以及对应的ID序号
遍历所有进程下的所有句柄,以及对应句柄类型. 一丶简介 在有的时候.我们会需要对应句柄名字.以及句柄类型的名称. 以及它所对应的的ID. 因为每个系统不一样.所以每次都是不一样的. 有的时候我们就需要 ...
- jmeter正则中常见的转义字符-笔记三
背景和目的 接口测试过程中难免会遇到由于有转义符号正则表达式提取不出来的情况,根据小伙伴们的分享和参考自己实践总结了多种情况 参考 首先,感谢如下常见转义字符,感谢提供参考的小伙伴 参考:https ...
- Pytest权威教程21-API参考-05-对象(Objects)
目录 对象(Objects) CallInfo Class Collector Config ExceptionInfo FixtureDef FSCollector Function Item Ma ...
- 4、http协议之二
URL(Unifrom Resource Locator)简述 相对URL 从当前页面(同一个站点内或同一个文章内引用) 绝对URL 从当前页面或其他页面跳转而来(跨站引用) HTTPD版本<0 ...