課程
/前端開發(fā)
/HTML/CSS
/H5+JS+CSS3實現(xiàn)七夕言情
為什么x坐標這樣表示:-' + (width * 2) + 'px
2016-11-18
源自:H5+JS+CSS3實現(xiàn)七夕言情 2-2
正在回答
學到這里有兩個場景,這個是在實現(xiàn)兩個場景之間的切換。用的方法是移動父元素的x坐標。使用js獲取的width是頁面可視區(qū)域的width,因為之前我們寫了hidden,所以可視頁面的width其實是等于一個場景的width。 而我們要實現(xiàn)從第一個頁面滾動到第三個頁面,我們的x坐標應該是2倍的width。所以這里用了 ? (width*2) ? 。 ?
PS:說的有點啰嗦,希望你能理解我的意思
Hyram_wu 提問者
Lukewarmer
慕斯慕斯
在x軸上移動 ?translate3d這里指明了3d就是啟用了3d加速,也就是啟動GPU來處理,性能更強 (-'+(width*2)+'px,0px,0px)表示x軸向左移動width*2,y軸、z軸不移動。
舉報
為七夕節(jié)準備的H5+JS+CSS3特效案例,由淺入深案例拆分講解
3 回答width : (slides.length * width) + 'px',
1 回答這句'transform': 'translate3d(-' + (width * 2) + 'px,0px,0px)' //設置頁面X軸移動
4 回答width : (slides.length * width) + 'px', 這句是怎么理解的?
1 回答width: (slides.length * width) + 'px',這句如何計算的呢?
1 回答boy 的top坐標為什么是這樣算的,這是按幾維計算的
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網(wǎng)安備11010802030151號
購課補貼聯(lián)系客服咨詢優(yōu)惠詳情
慕課網(wǎng)APP您的移動學習伙伴
掃描二維碼關注慕課網(wǎng)微信公眾號
2016-11-18
學到這里有兩個場景,這個是在實現(xiàn)兩個場景之間的切換。用的方法是移動父元素的x坐標。使用js獲取的width是頁面可視區(qū)域的width,因為之前我們寫了hidden,所以可視頁面的width其實是等于一個場景的width。 而我們要實現(xiàn)從第一個頁面滾動到第三個頁面,我們的x坐標應該是2倍的width。所以這里用了 ? (width*2) ? 。 ?
PS:說的有點啰嗦,希望你能理解我的意思
2017-08-27
在x軸上移動 ?translate3d這里指明了3d就是啟用了3d加速,也就是啟動GPU來處理,性能更強 (-'+(width*2)+'px,0px,0px)表示x軸向左移動width*2,y軸、z軸不移動。