在我們的工作中,很多項(xiàng)目需要在移動(dòng)終端上實(shí)現(xiàn),但是移動(dòng)終端和PC終端之間存在差異。如果某些部分仍然使用PC方法編寫(xiě),則會(huì)出現(xiàn)錯(cuò)誤;讓我們來(lái)談?wù)勔苿?dòng)終端和PC終端的區(qū)別;
PC端考慮瀏覽器兼容性,而移動(dòng)端需要考慮更多的手機(jī)兼容性,如Android、iOS和劉海平;
瀏覽器使用的通用內(nèi)核是WebKit內(nèi)核;移動(dòng)終端需要注意手機(jī)型號(hào)、類(lèi)別、分辨率和操作系統(tǒng)的差異;
移動(dòng)終端使用的觸摸屏操作更加豐富。使用的事件是觸摸屏事件,但缺少的事件是懸停事件。PC終端使用的鼠標(biāo)相對(duì)簡(jiǎn)單;而且,在開(kāi)發(fā)過(guò)程中,移動(dòng)終端需要彈出手機(jī)鍵盤(pán),而PC終端不需要;
在執(zhí)行樣式或動(dòng)畫(huà)時(shí),由于兼容性問(wèn)題,PC端較少使用C3。通常使用JS,但是移動(dòng)端沒(méi)有這個(gè)問(wèn)題。使用C3(簡(jiǎn)單、方便、高效);
移動(dòng)終端上的點(diǎn)擊事件延遲,延遲300毫秒。這是因?yàn)橛脩?hù)單擊屏幕一次后,瀏覽器無(wú)法立即判斷用戶(hù)是要雙擊、縮放還是單擊。因此,iossafari等待300毫秒來(lái)確定用戶(hù)是否再次點(diǎn)擊屏幕(所以Android學(xué)會(huì)了);然后300毫秒的延遲就誕生了
移動(dòng)端的網(wǎng)絡(luò)是一個(gè)問(wèn)題,當(dāng)網(wǎng)絡(luò)不穩(wěn)定時(shí)需要考慮,而PC端的網(wǎng)絡(luò)通常非常穩(wěn)定;
此外,用戶(hù)必須花更多的時(shí)間使用手機(jī)而不是電腦;此外,移動(dòng)端的傳感器非常完整,但PC端的傳感器不完整;
300ms延遲問(wèn)題:它過(guò)去是一個(gè)插件,但現(xiàn)在可以通過(guò)使用tap基本事件來(lái)解決;
您也可以使用背景大小:contain屬性來(lái)解決CSS的問(wèn)題;
這是防止網(wǎng)頁(yè)放大和縮小的最基本方法。這個(gè)問(wèn)題的一般解決方案是添加一個(gè)元標(biāo)記以防止放大和縮小,IOS中的固定元素容易出現(xiàn)定位錯(cuò)誤。當(dāng)軟鍵盤(pán)彈出時(shí),固定元件的定位會(huì)受到影響。
Fixed在Android上的性能優(yōu)于IOS。當(dāng)軟鍵盤(pán)彈出時(shí),不會(huì)影響固定元件的定位位置:iOS4下不支持固定
解決方案:可以使用iscrol插件解決此問(wèn)題;個(gè)人電腦和手機(jī)都有這個(gè)問(wèn)題;某些元件可能在定位時(shí)四處移動(dòng)(位置錯(cuò)誤)
解決方案:使用em、填充、、、、,,,,