在LazyLoad脚本上获取mootools vs jQuery冲突

时间:2018-11-10 21:57:10

标签: javascript jquery jquery-ui mootools

因此,我正在尝试在我的网站中使用此脚本https://codepen.io/cjl750/pen/pEAmgR

21 f 1
9  c 1
5  a 1
17 d 2
7  b 2

但是由于该网站同时处理jQuery和Mootools,所以我遇到了冲突:

// LAZY LOAD FUNCTION function lazyLoad() { $('iframe').each(function() { var frame = $(this), vidSource = $(frame).attr('data-src'), distance = $(frame).offset().top - $(window).scrollTop(), distTopBot = window.innerHeight - distance, distBotTop = distance + $(frame).height(); if (distTopBot >= 0 && distBotTop >= 0) { // if frame is partly in view $(frame).attr('src', vidSource); $(frame).removeAttr('data-src'); } }); } var throttled = _.throttle(lazyLoad, 100); $(window).scroll(throttled); // ILLUSTRATION OF VARIABLES // as calculated on div#example function lazyLoadExample() { var frame = $('#example'), vidSource = $(frame).attr('data-src'), distance = $(frame).offset().top - $(window).scrollTop(), distTopBot = Math.round(window.innerHeight - distance), // distance from top of frame to bottom of viewport distBotTop = Math.round(distance + $(frame).height()); // distance from bottom of frame to top of viewport document.getElementById('stick1').innerHTML = "distBotTop: " + distBotTop; document.getElementById('stick2').innerHTML = "distTopBot: " + distTopBot; } var throttled = _.throttle(lazyLoadExample, 100); $(window).scroll(throttled); 根据我的工作,我什至得到Uncaught TypeError: $ is not a function

要“修复”它,我已将每个LazyLoad is not a function替换为$

赞:

jquery

但是我知道这不是正确的解决方法。请帮忙。

我什至尝试过类似// LAZY LOAD FUNCTION function lazyLoad() { jQuery('iframe').each(function() { var frame = jQuery(this), vidSource = jQuery(frame).attr('data-src'), distance = jQuery(frame).offset().top - jQuery(window).scrollTop(), distTopBot = window.innerHeight - distance, distBotTop = distance + jQuery(frame).height(); if (distTopBot >= 0 && distBotTop >= 0) { // if frame is partly in view jQuery(frame).attr('src', vidSource); jQuery(frame).removeAttr('data-src'); } }); } var throttled = _.throttle(lazyLoad, 100); jQuery(window).scroll(throttled); // ILLUSTRATION OF VARIABLES // as calculated on div#example function lazyLoadExample() { var frame = jQuery('#example'), vidSource = jQuery(frame).attr('data-src'), distance = jQuery(frame).offset().top - jQuery(window).scrollTop(), distTopBot = Math.round(window.innerHeight - distance), // distance from top of frame to bottom of viewport distBotTop = Math.round(distance + jQuery(frame).height()); // distance from bottom of frame to top of viewport document.getElementById('stick1').innerHTML = "distBotTop: " + distBotTop; document.getElementById('stick2').innerHTML = "distTopBot: " + distTopBot; } var throttled = _.throttle(lazyLoadExample, 100); jQuery(window).scroll(throttled); 之类的事情,

其他javascript:

jQuery(function lazyLoad(&) {});

PS:该脚本应该可以延迟加载iframe。

0 个答案:

没有答案