第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全，請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題，去搜搜看，總會(huì)有你想問(wèn)的

類問(wèn)題中的方法（不能更新所有對(duì)象，只有一個(gè)受影響）

類問(wèn)題中的方法（不能更新所有對(duì)象，只有一個(gè)受影響）

月關(guān)寶盒 2023-03-03 15:00:12
在這段代碼中，我想用一些元素產(chǎn)生視差效果，但無(wú)論我做什么，只有一個(gè)元素在移動(dòng)，我不知道問(wèn)題出在哪里：/我嘗試了不同的東西，但無(wú)論制作了多少對(duì)象，只有最后一個(gè)表格數(shù)組（ParaElements）在移動(dòng)。function ParaElement(x, y, z, id) {  this.x = x;  this.y = y;  this.z = z;  this.id = id;  document.getElementById("paralax").innerHTML +=    '<div class="para-elmt"> </div>';  this.htmlObj = document.getElementsByClassName("para-elmt")[id];  this.positionChange = function (tx, ty) {    this.htmlObj.style.top = String(tx) + "px";    this.htmlObj.style.left = String(ty) + "px";    this.htmlObj.style.zIndex = this.z;  };  this.positionChange(this.x, this.y);  this.scrollHandler = function () {    let scrollPosition = document.documentElement.scrollTop;    let tx = this.x - scrollPosition / this.z;    let ty = this.y;    this.positionChange(tx, ty);  };}var ParaElements = [];ParaElements.push(new ParaElement("30", "100", "25", "0"));ParaElements.push(new ParaElement("100", "300", "50", "1"));ParaElements.push(new ParaElement("200", "200", "10", "2"));$(document).on("scroll", function () {  for (let i = 0; i < ParaElements.length; i++) {    ParaElements[i].scrollHandler();  }});body {  min-height: 2000px;}#paralax {  width: 100%;  height: 100%;  position: fixed;  margin: 0;}#paralax .para-elmt {  position: absolute;  width: 100px;  height: 100px;  border-radius: 50px;  background-color: teal;  z-index: 9999;}    <html>    <body>      <div id="paralax">      </div>          <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"        integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"        crossorigin="anonymous"></script>    </body>
查看完整描述

1 回答

?
慕斯709654

TA貢獻(xiàn)1840條經(jīng)驗(yàn) 獲得超5個(gè)贊

通過(guò)在每次啟動(dòng) ParaElement 時(shí)使用 innerHTML，您將破壞以前用來(lái)抓取元素的選擇器。這就是為什么只有最后一個(gè)在移動(dòng)。這樣的事情應(yīng)該可以解決問(wèn)題。


function ParaElement(x, y, z, id) {

  this.x = x;

  this.y = y;

  this.z = z;

  this.id = id;


  this.htmlObj = document.getElementsByClassName("para-elmt")[this.id];


  this.positionChange = function (tx, ty) {

    this.htmlObj.style.top = String(tx) + "px";

    this.htmlObj.style.left = String(ty) + "px";

    this.htmlObj.style.zIndex = this.z;

  };


  this.positionChange(this.x, this.y);


  this.scrollHandler = function () {

    let scrollPosition = document.documentElement.scrollTop;


    let tx = this.x - scrollPosition / this.z;

    let ty = this.y;

    this.positionChange(tx, ty);

  };

}


// Let's define the number of element we want, by creating an array with the differents parameters.

// I removed the last parameter from the arrays because it can be added directly when we will loop over the arrays.

let paraElementsParams = [["30", "100", "25"], ["100", "300", "50"], ["200", "200", "10"]]


var ParaElements = [];

// Instead of initializing by hand, let's loop over the elements in our parameters array so we can first create all the dom elements

for (let i = 0; i < paraElementsParams.length; i++) {

  document.getElementById("paralax").innerHTML += '<div class="para-elmt"> </div>';

}

// Then, let's loop again so we can initialize our elements without losing the node references.

for (let i = 0; i < paraElementsParams.length; i++) {

  // we add i at the end of the initialization using the current loop index

  ParaElements.push(new ParaElement(...paraElementsParams[i], i));

}


$(document).on("scroll", function () {

  for (let i = 0; i < ParaElements.length; i++) {

    ParaElements[i].scrollHandler(); 

  }

});


查看完整回答
反對(duì) 回復(fù) 2023-03-03
  • 1 回答
  • 0 關(guān)注
  • 97 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

 幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

 公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)