Records required for mobile platform development

I used to develop front-end applications on the PC end of my school when I was in college. Now I am working and I am still in the trial period. My tutor gave me some exercises. This exercise is displayed on the ipad, at this time, I think we should record the accumulated experience.

1. One of the requirements is to use iscroll for simulation.

But what is iscroll? So I went to google. I read some entry-level articles and probably learned about the use of iscroll.

There are a lot of online usage Introduction: http://www.nb88.net/Index/p/id/406 and so on.

In fact, I have never encountered a rolling problem on the mobile platform. This iscroll solves the rolling problem on the mobile end. I think it is necessary to have a good experience in the application.

 

2. meta tag of the mobile platform.

This meta is amazing on mobile platforms.

2.1 <meta name = "viewport" content = "width = device-width; initial-scale = 1.0; maximum-scale = 1.0; user-scalable = 0;"/>

This sentence allows us to deploy our pages in full screen mode, so we don't have to worry about shrinking the page display by the browser.

Viewport is the visible area. For a desktop browser, viewport is the area used to view webpages after all the toolbar, Status Bar, and scroll bar are removed. For traditional WEB pages, the 980 width display on the iphone is normal and full screen, but it may be a problem for webapps, on the iphone, our webapp is usually 320 in width under the vertical screen. What is the effect of our 320 page on the iphone? Some people may think that the iPhone is not 320 in width. It should be full screen. What is the truth? The screen is scaled and displayed on the PC.

Some parameters:

Width: the width of the viewport. The value ranges from 200 to 10,000. The default value is 980 pixels)
Height: the height of the viewport. The value ranges from 223 to 10,000)
Initial-scale: initial scaling ratio (range:> 0 to 10)
Minimum-scale: minimum scale that allows users to scale
Maximum-scale: maximum scale allowed by users
User-scalable: whether the user can manually Scale

2.2 <meta name = "format-detection" content = "telephone = no"/>

The link style is not added to a string of numbers you clearly write, and the iPhone will automatically add the link style to your text, and click this number to automatically dial! How can I remove this dial-up link? At this time, our meta should be superb again. The Code is as follows:

If telephone is set to no, the number cannot be converted to a dial-up link!
Telephone = yes enables converting numbers to dial-up links. To enable the conversion function, you do not need to write this meta. By default, this function is enabled!

2.3 <meta name = "apple-mobile-web-app-capable" content = "yes"/>

This meta is used to delete the default Apple toolbar and menu bar. Content has two values: "yes" and "no". When we need to display the toolbar and menu bar, this line of meta does not need to be added. The default value is display.

2.4 <meta name = "apple-mobile-web-app-status-bar-style" content = "black | default | black-translucent"/>

The function is to control the display style of the status bar.