☰

Lasy_load_img_Library

img_reflash_bug

Version vom 24.02.2024. Aktuellste Version

Dieses Skript sollte nicht direkt installiert werden. Es handelt sich hier um eine Bibliothek für andere Skripte, welche über folgenden Befehl in den Metadaten eines Skriptes eingebunden wird // @require https://update.greatest.deepsurf.us/scripts/488188/1332829/Lasy_load_img_Library.js 

// ==UserScript==
// @name         Lasy_load_img_Library
// @namespace    http://tampermonkey.net/
// @version      2024.2.24.2
// @description  img_reflash_bug
// @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(){
			let newimg = $(myself).clone(true)
			$(myself).after(newimg)
			$(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
}