新功能引导实现的思路:
1.类似于intro.js的实现,通过html元素id或者其它属性找到该dom节点,将其z-index调至较高层级;
如果新功能需要可点击操作,则使用该种方法
2.使用css的outline属性
.guide {
outline: 9999px solid rgba(0,0,0,.75);
}
以上方法在火狐浏览器会有兼容性问题,故改成用box-shadow属性
box-shadow: 0 0 0 9999px rgba(0,0,0,.75)
但这个方法可能在低版本的sarafi上有兼容问题,可通过js判断浏览器类型,sarafi用上面的outline方法,其它浏览器则使用box-shadow属性
参考张鑫旭的这篇文章 https://www.zhangxinxu.com/wordpress/2017/05/jquery-guide-js-plugin/
新功能引导实现技巧
本文探讨了新功能引导的实现思路,包括使用类似intro.js的方法调整DOM节点层级,及利用CSS的outline和box-shadow属性突出新功能,同时解决浏览器兼容性问题。
897

被折叠的 条评论
为什么被折叠?



