本質(zhì)上,我試圖創(chuàng)建一個(gè)基本功能,可以滾動(dòng)滾動(dòng)圖像。我這里有 jsfiddle 中的所有內(nèi)容: https ://jsfiddle.net/JUST_RJ/6zb37d94/$(document).ready(function() { $("#c1").fadeIn(0); console.log() $(window).scroll(function() { var pos = $(document).scrollTop(); if (pos < 200) { hideAll("c1"); $("#c1").fadeIn(0); } if (pos > 200 && pos < 400) { hideAll("c2"); $("#c2").fadeIn(0); } if (pos > 400 && pos < 600) { hideAll("c3"); $("#c3").fadeIn(0); } }); function hideAll(exceptMe) { $(".image").each(function(i) { if ($(this).attr("id") == exceptMe) return; $(this).fadeOut(0); }); }});現(xiàn)在我已經(jīng)可以使用它了,盡管我認(rèn)為添加更多圖像時(shí)會(huì)變得復(fù)雜。我想保留 html 中列出的圖像 src,以便輕松添加新圖像并手動(dòng)選擇圖像大小。我想知道 JS 部分是否可以簡化為做兩件事......獲取滾動(dòng)高度并自動(dòng)添加預(yù)設(shè)值(200)以滑動(dòng)到下一個(gè)圖像。目前,必須手動(dòng)添加更改圖像的滾動(dòng)量,如下所示......滾動(dòng)到 200 時(shí)更改為圖像 2在 200 > 600 處顯示圖像 2滾動(dòng)到 600 時(shí)更改為圖像 3ETC這將使每個(gè)圖像顯示 200 個(gè)滾動(dòng),然后輕拂到下一個(gè)圖像,而無需每次手動(dòng)添加滾動(dòng)量和與前一個(gè)圖像的距離。有沒有辦法可以簡化代碼,這樣在js中,就不需要每次都添加新圖像和id?也許有一種方法可以用“image”類來計(jì)算html中圖像的數(shù)量,然后自動(dòng)添加一個(gè)id號(hào),在之前的id上加1?就像是..使用“image”類計(jì)算 html 中圖像的數(shù)量商店數(shù)量(本例中為 3)創(chuàng)建#c1創(chuàng)建#c2創(chuàng)建#c3顯示 #c1 滾動(dòng) 200顯示 #c2 滾動(dòng) 200ETC謝謝!
更改滾動(dòng) JS/jQuery 上的圖像
幕布斯7119047
2023-08-21 19:32:22