Angular中封装fancyBox(图片预览)遇到问题小结
首先在官网下载最新版的fancyBox(一定要去最新网站,以前依赖的jquery版本偏低),附上链接:
成都创新互联公司专注于企业营销型网站、网站重做改版、建湖网站定制设计、自适应品牌网站建设、H5场景定制、成都商城网站开发、集团公司官网建设、外贸网站建设、高端网站制作、响应式网页设计等建站业务,价格优惠性价比高,为建湖等各大城市提供网站开发制作服务。
http://fancyapps.com/fancybox/3/
然后在项目中引用jquery,然后在引用jquery.fancybox.min.css和jquery.fancybox.min.js。
如果需要动画和鼠标滚轮滚动效果还可以引入他提供的相关工具文件。
1.你可以通过链接.css和.js在你的html文件来安装fancyBox 。确保您也加载了jQuery库。以下是用作示例的基本HTML模板
<!DOCTYPE html>我的页面 title> <! - CSS - > HEAD> <! - 您的HTML内容到这里 - > <! - JS - >
遇到的问题:
1.如果使用低版本的图片预览插件,回报Cannot read property 'msie' of undefined的错,原因低版本似乎使用$ .browser方法,但是从jQuery 1.9起已被删除
2.在template或者templateUrl要使用html中传入的imgUrl值,不能直接使用imgUrl或者scope.imgUrl获取。
方法:
或者
后面的th:src可以不用拼接,如果你项目中是用cdn上的资源图片,可以使用。
总结
以上所述是小编给大家介绍的Angular中封装fancyBox(图片预览)遇到问题小结,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对创新互联网站的支持!
本文题目:Angular中封装fancyBox(图片预览)遇到问题小结
文章起源:http://ybzwz.com/article/gpegid.html