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学习之路(持续更新),里面有讲解: ...
随机推荐
- 2019/7/18 --1.<%@ include file=""%>与<jsp:include page=""/>两种方式的作用
一.前言 身为一名coder有太多太多的知识点要去学,太多太多的东西要去记.往往一些小细节也就难免疏忽,但悲催的是多数困恼你的bug就是因为这些微不足道的知识点.我们又不是机器人,怎么可能什么都记得了 ...
- .net文件夹上传下载组件
ASP.NET上传文件用FileUpLoad就可以,但是对文件夹的操作却不能用FileUpLoad来实现. 下面这个示例便是使用ASP.NET来实现上传文件夹并对文件夹进行压缩以及解压. ASP.NE ...
- 2017.10.7 国庆清北 D7T1 计数
题目描述 给出m个数a[1],a[2],…,a[m] 求1~n中有多少数不是a[1],a[2],…,a[m]的倍数. 输入输出格式 输入格式: 输入文件名为count.in. 第一行,包含两个整数:n ...
- Sage Math中的语法
1.赋值后不能立即输出,而需要停顿.x= 3 不能输出显示,而 x= 3; x 可以显示. 2.可以用分号连续书写多行. 3.矩阵可以用 mtx[i, j]引用,但是行列号通常从0开始,维度n, m ...
- Tkinter 之PanedWindow标签
一.参数说明 参数 作用 background(bg) 设置背景颜色 borderwidth(bd) 设置边框宽度 cursor 指定当鼠标在PanedWindow上飘过的时候的鼠标样式 handl ...
- Linux 文件与目录的权限
文件默认权限:umask umask就是指定“目前用户在新建文件或目录时候的权限默认值”.查询umask有以下两种方式: 目录与文件的默认权限是不一样的: - 文件,默认没有可执行(x)权限,只有r. ...
- 覆盖elementui样式
前台以表格形式展示后台数据,图片或视频点击后弹出框播放,用el-dialog实现. 希望播放视频的时候不显示dialog的背景那些. 尝试 scoped 无果 <style lang=" ...
- Ubuntu -- unknown error: Chrome failed to start: exited abnormally (Driver info: chromedriver=...)
#添加沙盒模式 chrome_options.add_argument("--no-sandbox")
- 《Linux性能及调优指南》 Linux进程管理
版权所有: 原文名称:<Linux Performance and Tuning Guidelines> 原文地址:http://www.redbooks.ibm.com/abstract ...
- JVM 类加载器命名空间深度解析与实例分析
一.创建Sample 1.创建实例 public class MyPerson { private MyPerson myPerson; public void setMyPerson(Object ...