首先了解iPad開(kāi)發(fā)的局限性

 

1、在iPad上使用Safari瀏覽普通網(wǎng)站網(wǎng)頁(yè)的時(shí)候，網(wǎng)頁(yè)因為太大而導致需要手動(dòng)放大縮小或者滑動(dòng)，雖然這種滑動(dòng)行為在iPad上市之初的各種宣傳中被津津樂(lè )道，但時(shí)間久了我們還是會(huì )發(fā)現這樣做并不方便，給用戶(hù)帶來(lái)的感受并不十分好。

 

2、不支持Flash

 

在沒(méi)有越獄的iPad Safari中，網(wǎng)站的Flash都是無(wú)法顯示的，但可以通過(guò)第三方軟件或插件或者瀏覽器來(lái)解決，不過(guò)，即使不能顯示Flash，你一樣能夠用HTML5和CSS3實(shí)現同樣的效果。

 

3、沒(méi)有鼠標光標

 

這意味著(zhù)鼠標屬性，例如鼠標懸停屬性是不可能有的。

 

你或許可以為這個(gè)找到一些變通的辦法，但是到你的用戶(hù)那里這些該如何工作將會(huì )是困難的事。

 

4、滾動(dòng)條不能按照預期那樣起作用

 

滾動(dòng)條不能顯示包含了充滿(mǎn)過(guò)多分區的內容?？蚣芤泊嬖诟叨群蛯挾鹊膯?wèn)題。另外，滾動(dòng)過(guò)程中需要兩個(gè)手指的手勢。（我們將在下文中進(jìn)行充分的討論）

 

5、不支持CSS固定布局

 

HTML 元素 position:fixed CSS屬性不能正確顯示，常常會(huì )使得頁(yè)面停留在第一屏，無(wú)法向下翻頁(yè)、放大縮小。

 

設置viewpoint

 

viewpoint，可以理解為：視窗、可視區域，相對于iPad硬件限定的窗口來(lái)定義的。iPad窗口大小不可改變,但viewpoint視窗大小可以設置調整。

 

如果在iPhone開(kāi)發(fā)中指定了視窗標簽設置, 在iPad開(kāi)發(fā)中必須進(jìn)行必要的校正。例如：

 

在iPhone中，我們會(huì )用下述代碼的方式指定屏幕寬度

 

 

而在iPad中，則必須用device-width替代具體的寬度像素數。

 

 

我們在設置寬度的同時(shí)可以設置可縮放的比例范圍

 

 

用 textareas 取代 contenteditable

 

iPhone和iPad瀏覽器不支持contenteditable元素。

 

默認隱藏工具欄

 

iPhone的瀏覽器工具欄會(huì )在頁(yè)面最頂端，卷動(dòng)網(wǎng)頁(yè)后才隱藏。這樣在加載網(wǎng)頁(yè)完成后顯得很浪費空間，特別是橫向屏幕時(shí)。我們可以讓它自動(dòng)卷動(dòng)上去。

 

 

iPad圖標

 

iPad開(kāi)發(fā)完成后，會(huì )體現圖標的地方主要有：

 

iPad桌面，不大于72×72的png格式圖標；

 

iPhone桌面，不大于57×57的png格式圖標，在Xcode中的資源部分添加，并在xxxInfo.plist中設置Icon file屬性為添加的圖片資源名稱(chēng)。

 

圖標文件不需要做圓角和反光，iPad/iPhone自己會(huì )完成。

 

App Store中軟件簡(jiǎn)介中顯示的縮略圖，在打包生成zip文件的根目錄放置的文件名為iTunesArtwork的jpg圖片，大小要求在512×512以下 如果你的用戶(hù)將你的網(wǎng)站添加到home screen，iPhone會(huì )使用網(wǎng)站的縮略圖作為圖標。然而你可以提供一個(gè)自己設計的圖標，這樣當然更好。圖片是57×57大小，png格式。不需要自己做圓角和反光，系統會(huì )自動(dòng)完成這些工作。然后將下面這條加入head中：

 

 

用iScroll控制你的觸摸滾動(dòng)

 

這是一個(gè)簡(jiǎn)單且最有用的源碼，能夠幫助你控制你的網(wǎng)絡(luò )應用程序。由Matteo Spinelli創(chuàng )作，iScorll是一個(gè)開(kāi)發(fā)項目，因為網(wǎng)絡(luò )瀏覽器引擎Webkit工具套件（用于iPhone,iPod,iPad,Android 以及Palm上）不提供本地方式去滾動(dòng)文章內部一個(gè)固定的高度/寬度元素。

 

這種不幸的情況防止任何Web應用程序有一個(gè)頭和/或頁(yè)腳的 position:absolute CSS屬性，并滾動(dòng)中心區域的內容。

 

iScroll代碼非常易于使用。如果你喜歡iScroll，你需要這些類(lèi)似的jQuery插件：jQuery Swipe和JQTouch

---