introJs用法及在webkit内核浏览器的一个报错
1、用法
很简单的用法,引入js,引入css,再执行introJs().start();
就可以了(备注:introJs会自动去抓取含有data-intro的dom在introJs源码中_introForElement有一段var allIntroSteps = targetElm.querySelectorAll("*[data-intro]"))
所以只要在想要有引导的某个块元素加上data-intro=“这是一个引导文本”,理论上就可以实现,当然introJs有很多插槽可以供前端更好的去做一些事情,
传送门https://www.lagou.com/lgeduarticle/94133.html
this._options = {
/* 下一步按钮的显示名称 */
nextLabel: 'Next →',
/* 上一步按钮的显示名称 */
prevLabel: '← Back',
/* 跳过按钮的显示名称 */
skipLabel: 'Skip',
/* 结束按钮的显示名称 */
doneLabel: 'Done',
/* 引导说明框相对高亮说明区域的位置 */
tooltipPosition: 'bottom',
/* 引导说明文本框的样式 */
tooltipClass: '',
/* 说明高亮区域的样式 */
highlightClass: '',
/* 是否使用键盘Esc退出 */
exitOnEsc: true,
/* 是否允许点击空白处退出 */
exitOnOverlayClick: true,
/* 是否显示说明的数据步骤*/
showStepNumbers: true,
/* 是否允许键盘来操作 */
keyboardNavigation: true,
/* 是否按键来操作 */
showButtons: true,
/* 是否使用点点点显示进度 */
showBullets: true,
/* 是否显示进度条 */
showProgress: false,
/* 是否滑动到高亮的区域 */
scrollToElement: true,
/* 遮罩层的透明度 */
overlayOpacity: 0.8,
/* 当位置选择自动的时候,位置排列的优先级 */
positionPrecedence: ["bottom", "top", "right", "left"],
/* 是否禁止与元素的相互关联 */
disableInteraction: false,
/* 默认提示位置 */
hintPosition: 'top-middle',
/* 默认提示内容 */
hintButtonLabel: 'Got it'
};
2、报错TypeError: 'undefined' is not a function (near '...}.bind(this));...')
bind()方法不存在,添加bind方法
// 该webkit浏览器不支持bind方法,添加bind方法
if (!Function.prototype.bind) {
Function.prototype.bind = function(oThis) {
if (typeof this !== "function") {
throw new TypeError("Function.prototype.bind - what is trying to be bound is not callable");
}
var aArgs = Array.prototype.slice.call(arguments, 1),
fToBind = this,
fNOP = function() {},
fBound = function() {
return fToBind.apply(this instanceof fNOP && oThis ? this : oThis,
aArgs.concat(Array.prototype.slice.call(arguments)));
};
fNOP.prototype = this.prototype;
fBound.prototype = new fNOP();
return fBound;
};
}
introJs用法及在webkit内核浏览器的一个报错的更多相关文章
- 八大Webkit内核浏览器
列举出时下最流行的Webkit内核浏览器,所以我们并不会做出评测和对比.PS:本文列举的浏览器有一部分为IE+Webkit双核浏览器,如果您对其他IE内核浏览器很感兴趣<抛弃数据!用体验和感觉告 ...
- 【前端】webkit内核浏览器DIV滚动条样式修改和设置
webkit内核浏览器DIV滚动条样式修改和设置 引言: 最近在做自己的小项目,为了设计出好看的页面费劲了心思,大到页面的整体布局,小到DIV的滚动条都不放过,以下是我通过查阅资料总结的webkit内 ...
- 浅谈关于QT中Webkit内核浏览器
关于QT中Webkit内核浏览器是本文要介绍的内容,主要是来学习QT中webkit中浏览器的使用.提起WebKit,大家自然而然地想到浏览器.作为浏览器内部的主要构件,WebKit的主要工作是渲染.给 ...
- C# webkit 内核浏览器 访问https 网站 提示 Problem with the SSL CA cert (path? access rights?)
C# webkit 内核浏览器 访问https 网站 提示 Problem with the SSL CA cert (path? access rights?) 解决方法: 陈凯文11112014- ...
- IE浏览器连接WebSocket报错:java.lang.IllegalArgumentException: Invalid character found in the request target. The valid characters are defined in RFC 7230 and RFC 3986
在项目开发中整合了WebSocket,本来没什么问题了,但是偶尔发现用IE浏览器打开web端不能推送消息,因为PC端与服务器建立连接失败了.网上查了很多资料, 又看了看源码,都不对症:又怀疑是Spri ...
- 关于浏览器访问iLO报错ERR_SSL_BAD_RECORD_MAC_ALERT
公司有几台HP DL380 G7服务器,ilo版本是ilo3(Integrated Lights-Out 3),ilo口配置好后,无法正常打开ilo页面 ping ilo口是通的,并且telnet 8 ...
- 拥有webkit内核浏览器的平台
1-拥有webkit内核的浏览器: IOS safari Android 的浏览器 Google chrome 猎豹浏览器 百度浏览器 Opera 以上可知手机的浏览器均为webkit内核 2-拥有其 ...
- 当html中存在url中如: onclick="toView('参数1')", 参数1是特别字符,如&asop;"' "等时,浏览器解析时会报错。解决方法如文中描述
解决方案: 自定义标签将字符串转换成unicode编码后输出显示到页面即可 解析原理:解析顺序html ---url ----javascript---url,由于unicode编码在htm解析阶段 ...
- python3+selenium使用浏览器IE的时候,无法打开IE浏览器,老是报错: Unexpected error launching Internet Explorer. Protected Mode settings are not the same for all zones
python3+selenium使用浏览器IE的时候,老是报错: Unexpected error launching Internet Explorer. Protected Mode settin ...
随机推荐
- PyQt Designer中带参数的信号为什么匹配不到带参数的槽函数?
老猿在学习ListView组件时,想实现一个在ListView组件中选中一个选择项后触发消息给主窗口,通过主窗口显示当前选中的项的内容. 进入QtDesigner后,设计一个图形界面,其中窗口界面使用 ...
- 第四章 、PyQt中的信号(signal)和槽(slot)机制以及Designer中的使用
老猿Python博文目录 专栏:使用PyQt开发图形界面Python应用 老猿Python博客地址 一.引言 前面章节其实已经在使用信号和槽了,但是作为Qt中最重要的机制也是Qt区别与其他开发平台的重 ...
- Python基础知识学习随笔
Python学习随笔:PyCharm的错误检测使用及调整配置减少错误数量 Python学习随笔:获取当前主机名和用户名的方法 博客地址:https://blog.csdn.net/LaoYuanPyt ...
- [GYCTF2020]Blacklist
这题是用堆叠注入,同时也是借这题记录一下CTF中堆叠注入的一些骚操作 以下部分内容转载大佬的文章 show databases; 获取数据库名 show tables; 获取表名 show colum ...
- Project Lombok——带给你简洁、清晰的代码
相信但凡有一点Java编程经历的人,都见过或者写过下面这种代码.这是一个简单的POJO,只有4个fields,加上构造器.equals.hash.toString以及各种getter setter,前 ...
- 小齐读者拿到快手、百度、网易等 offer 的独门秘籍!
小齐说: 这篇文章来自读者冰红茶,他刚结束了秋招,拿了很多家 offer. 和他聊完之后,我觉得他的备考思路也完全适用于美国的面试,只是分值要调整一下,但是具体每一块的内容,地球村通用.所以分享给大家 ...
- 剑指offer二刷——数组专题——数字在升序数组中出现的次数
题目描述 统计一个数字在升序数组中出现的次数. 我的想法 完整的解法我只想到了遍历数组然后依次统计,但这是不聪明的解法,而且没有利用上"升序数组"的这个条件. 题目标签有提醒可以用 ...
- 深度剖析目标检测算法YOLOV4
深度剖析目标检测算法YOLOV4 目录 简述 yolo 的发展历程 介绍 yolov3 算法原理 介绍 yolov4 算法原理(相比于 yolov3,有哪些改进点) YOLOV4 源代码日志解读 yo ...
- 最简单的 K8S 部署文件编写姿势,没有之一!
1. 头疼编写K8S部署文件? K8S yaml 参数很多,需要边写边查? 保留回滚版本数怎么设? 如何探测启动成功,如何探活? 如何分配和限制资源? 如何设置时区?否则打印日志是GMT标准时间 如何 ...
- JVM的艺术—JAVA内存模型
*喜欢文章,动动手指点个赞 * 引言 亲爱读者你们好,关于jvm篇章的连载,前面三章讲了类加载器,本篇文章将进入jvm领域的另一个知识点,java内存模型.彻底的了解java内存模型,是有必要的.只要 ...