2019独角兽企业重金招聘Python工程师标准>>>

当这两个js并存时,会造成加载图片闪烁的冲突问题

原因:
jquery.lazyload.js会触发叫"appear"的显示效果,利用jQuery trigger()方法影响图片元素
effects.js中给元素模型添加了appear()方法
这样两个方法同时影响元素,改变透明度,就会造成闪烁

解决:
1.注释effects.js最后一句Element.addMethods(Effect.Methods);
或者改变Effect.Methods,去掉appear()
2.jquery.lazyload.js 替换appear为其他名字

原文
jquery.lazyload.js triggers an event called “appear” to show the effect and because of the way the jQuery trigger() method is written it will try and trigger a method on the element as well as trigger the event. The Effects methods in Scriptaculous add an appear() method to the Element prototype. The Scriptaculous appear() is firing as well as the lazyload fadeIn() and thats were you get a flicker when 2 methods are trying to change the opacity of the element at the same time.

How to fix it:
First Method
/root/js/scriptaculous/effects.js
In your copy of effects.js the last line is

Element.addMethods(Effect.Methods);

If you remove that line it will remove the Scriptaculous Effects methods from the Element prototype and should fix the immediate problem. However if any other plugins are depending on the Effects methods on the Element prototype they will start failing. But if you are using those methods you can change them over to use the anonymous methods. ie

$(‘myelement’).appear();
// changes to
Effect.Appear(‘myelement’);

Second method, i think this the easiest and secure way to remove the conflict and this method also not effect any existing effects.
In your copy of jquery.lazyload.js just replace the “appear” key word with appear1 or any other word, save file and enjoy the lazy load plugin.//成功解决

转载于:https://my.oschina.net/liufeng815/blog/389311

magento effects.js jquery.lazyload.js 冲突相关推荐

  1. jquery.lazyload.js详解

    简介 lazyload.js用于长页面图片的延迟加载,视口外的图片会在窗口滚动到它的位置时再进行加载,这是与预加载相反的. 优点: 它可以提高页面加载速度: 在某些情况清晰它也可以帮助减少服务器负载. ...

  2. Jquery.LazyLoad.js修正版下载,实现图片延迟加载插件

    之前一直有关注过Jquery.LazyLoad.js这个特效,但一直没有用,这几天研究了一下,并应用于实际中,对网站SEO方面没有什么帮助,不过可以节省一些流量,对于大网站来说显的尤为重要,至于节省了 ...

  3. 利用Jquery Lazyload JS插件实现网页图片延迟加载

    Jquery Lazyload是一款网页图片延迟加载JS插件,本文介绍该JS的使用方法. 最新的jquery lazyload可以单独使用(即不依赖jquery),本文介绍的是依赖jquery的使用及 ...

  4. video.js+jquery.danmu.js实现视频播放+发送弹幕

    需要自己去下载video.js和jquery.danmu.js,实在下载不到的评论找我 <!DOCTYPE html> <html lang="en"> & ...

  5. ajax upload file.js,jquery.ajaxfileupload.js

    jquery.ajaxfileupload.js上传插件,利用iframe提交不刷新页面功能完成. /* // jQuery Ajax File Uploader // // @author: Jor ...

  6. 解决:GET http://localhost:**/static/js/jquery.min.js net::ERR_ABORTED 404

    解决引用jquery文件始终不起作用的相关原因 1.首先检查自己引入路径是否正确 2.确保在properties或yml中配置加载静态资源 spring.mvc.static-path-pattern ...

  7. 【前端分享】jQuery.lazyload详解(转)

    jQuery实现图片延迟加载,不知道是否可以节省带宽呢? 有人知道吗? 这究竟只是一个视觉特效还是真的能延迟加载减少服务器的请求呢? <script type="text/javasc ...

  8. 关于ecshop中jquery与js冲突解决的方案

    ECShop把AJAX事件和JSON解析的模块放在common/transport.js之中,可以说它也有自己封装的一套工具,这其实是很正常的. 但恰恰的,在封装JSON各种方法的同时对object的 ...

  9. 【jQuery】利用lazyload.js延迟加载技术应对多图杀猫的单一页面

    有时候不可避免地在某一页面摆上大量图片,众所周知,一张网页如果上面的元素超过100KB,那么,你的网页会加载得很慢,纵使现在的网络已经不是当年的猫,然而,你也应该尽可能地提高你的网页加载速度.对于多图 ...

最新文章

  1. proe4.0安装教程
  2. Combine two strings into one.
  3. linux中printf命令,Linux中printf命令使用实例
  4. RocketMQ如何保证消息不丢失? 如何快速处理积压消息?
  5. python远程执行linux命令256_python远程操作Linux——使用paramiko库
  6. 95-40-032-java.util.concurrent-ConcurrentHashMap
  7. vim 寄存器 操作_说实话,Intellij IDEA 自带的 Vim 插件真心不错。。。
  8. 学生时代的最后一个新年,请一定要做这五件事
  9. 服务器版dll修复工具,DLL修复工具哪个好?五款修复能力强推荐
  10. scanf 详解 - 你所不知道的scanf用法
  11. 一些实用的学生向脚本(补)
  12. Codeforces Round #521 (Div. 3) E. Thematic Contests
  13. python四则运算完整代码_2/20Python之四则运算
  14. 可视化展示炫酷3D图表
  15. python绘制红色五角星_python绘制五角星
  16. easyExcel 导出自动添加序号
  17. 关于godot第三方功能增强版
  18. Android View简易生成Pdf
  19. itools安装驱动组件失败解决办法,实测有效
  20. 推荐系统工程实践经验

热门文章

  1. 在Solaris 下使用Os Watcher 监控Oracle
  2. 写给准备学习Linux的人
  3. 5.7 Components — Sending Actions From Components to Your Application
  4. 删除某个路径下的文件夹
  5. Win7部署基础知识(2):制作WinPE
  6. 学习Ruby的10条理由
  7. JAVA中的引用四种引用类型
  8. SpringCloud 从菜鸟到大牛之五 统一配置中心 Spring Cloud Config
  9. Vue Router history模式的配置方法及其原理
  10. Android中OnItemClick的四个参数意义