原版
目前為
此腳本不應該直接安裝，它是一個供其他腳本使用的函式庫。欲使用本函式庫，請在腳本 metadata 寫上： // @require https://update.greatest.deepsurf.us/scripts/488188/1332826/Lasy_load_img_Library.js
// ==UserScript==
// @name Lasy_load_img_Library
// @namespace http://tampermonkey.net/
// @version 2024.2.24
// @description 原版
// @author You
// @grant none
// ==/UserScript==
let img = null
let lock = false
let loadnum = 10
function set_img(tag){
if(!tag || tag.length==1){return}
if(tag.first()[0] instanceof HTMLImageElement){img = tag}else{img = tag.find('img')}
hide_img(img)
img.on('touchstart',img_touchstart)
// img.on('touchmove',img_touchmove)
// img.on('touchend',img_touchend)
loadimg(loadnum)
}
function hide_img(iimg){
iimg.each(function(){
if($(this).attr('native_src') || !$(this).attr('src')){return}
$(this).attr('native_src',src)
$(this).attr('src','no')
$(this).css({
'background-color':'#535353',
width:'100%',
height:'80vh',
})
})
}
let scroll_state = "down"
function CheckScroll_up_or_down(){
let scrollend = null
let sy = $('.box').scrollTop()
$('.box').scroll(function(){
if(scrollend){clearTimeout(scrollend)}
scrollend = setTimeout(function() {
if($('[touch]').length==0){return null}
console.log(sy+":"+$('.box').scrollTop())
if(Math.abs($('[touch]')[0].getBoundingClientRect().top)<$(window).height()/2){
console.log('return touch')
//return $('[touch]')
}
if(sy<$('.box').scrollTop()){
console.log('down')
scroll_state = 'down'
//return null
}else{
//向上滚动
console.log('up')
scroll_state = 'up'
//return null
}
}, 500);
})
}
function img_touchstart(){
showimg($(this))
if(this.naturalHeight==0){
let myself = this
let img = new Image
img.onload=function(){
$(myself).after(img)
$(myself).remove()
}
img.src=this.src
}
$('[touch]').removeAttr('touch')
$(this).attr('touch','yes')
}
function showimg(iimg){
console.log(iimg)
var pre = img.slice(Math.max(0,iimg.index()-3),iimg.index())
console.log(pre)
var nex = img.slice(iimg.index(),Math.min(img.length,iimg.index()+3))
console.log(nex)
var all = null
if(pre.length==0){all = nex}
if(nex.length==0){all = pre}
if(!all){all = pre.add(iimg).add(nex)}
all.each(function(){
if(lock){return false}
if(!$(this).attr('native_src')){return true}
if(this.src == $(this).attr('native_src')){return true}
loadimg(loadnum)
return false
})
}
function loadimg(nums){
let now = img.index($('[touch]:first'))
if(now==-1){now = 0}
let needload = null
if(scroll_state=="down"){
needload = img.slice(now,Math.min(now+nums,img.length))
}else{
needload = img.slice(Math.max(now-nums,0),now+1).get().reverse()
needload = $(needload)
}
needload.each(function(){
let native_src = $(this).attr('native_src')
if(native_src && native_src!=this.src){
$(this).attr('src',native_src)
}
})
}
function setLoadNum(num){
loadnum = num
}
window.LasyLoad = {
CheckScroll_up_or_down : CheckScroll_up_or_down, //这个必须先调用一次，且只能调用一次
set_img : set_img, //设置须要懒加载的图片
setLoadNum : setLoadNum, //设置每次加载的数量，默认是10
}