Web front End--Knowledge point, note overlay (Javascript,jquery,html5+css3.0,ajax)

1, force the width of the document and the width of the device to maintain 1:1, and the maximum width of the document is 1.0, and does not allow users to click on the screen to enlarge browsing;

<meta name= "viewport" content= "width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, User-scalable=no "/>

2. Safari private meta tag in iphone device, which means: Allow full screen mode to browse;<meta content= "yes" name= "apple-mobile-web-app-capable"/>3. The iphone's private label, which specifies the style of the iphone's status bar on the top of safari;<meta content= "Black" name= "Apple-mobile-web-app-status-bar-style"/>4. Tell the device to ignore the number in the page as the phone number

<meta content= "Telephone=no" name= "Format-detection"/>

5. The email address in the page is not automatically recognized in Android, and the email address is not automatically recognized in iOS;

<meta content= "Email=no" name= "Format-detection"/>

6. Gradient (This is often used when making a button)
element{
Background-image:-moz-linear-gradient (Top, #2288cc, #389de2); /* Firefox */
Background-image:-webkit-gradient (linear, left top, left bottom, color-stop (0, #389de2), Color-stop (1, #2288cc)); /* saf4+, Chrome */
}

7. Remove the transparent layer that appears when you click on the handheld device (usually formatted in the head)
a,button,input{
-webkit-tap-highlight-color:rgba (0,0,0,0);
-webkit-tap-highlight-color:transparent; /* For some androids */
}

8. When the user clicks on the link to leave this page, a message box pops up:

$ (window). Unload (function () {  alert ("goodbye!");});

9,/* Cycle rolling */
$ ("button"). Click (function () {
$ ("H3"). EQ (0). AppendTo (' P ');
$ ("H3"). EQ (0). Remove ();
});

10,//JS judge mobile phone access jump to the mobile phone station the first method
function Browserredirect () {

var suseragent= navigator.userAgent.toLowerCase ();

var bisipad= suseragent.match (/ipad/i) = = "ipad";

var bisiphoneos= suseragent.match (/iphone os/i) = = "iphone OS";

var bismidp= suseragent.match (/midp/i) = = "MIDP";

var bisuc7= suseragent.match (/rv:1.2.3.4/i) = = "rv:1.2.3.4";

var bisuc= suseragent.match (/ucweb/i) = = "UCWeb";

var bisandroid= suseragent.match (/android/i) = = "Android";

var bisce= suseragent.match (/windows ce/i) = = "Windows CE";

var biswm= suseragent.match (/windows mobile/i) = = "Windows Mobile";

if (Bisipad | | bisiphoneos | | bismidp | | bIsUc7 | | bisuc | | bisandroid | | bisce | | biswm) {

Window.location.href= ' mobile website address ';

} else {

Window.location= ' computer website address ';

}

}
Browserredirect ();

JS Judge mobile phone access jump to the second method of mobile station
if (navigator.platform.indexOf (' Win32 ')!=-1) {

Pc

window.location.href= "Computer website";

}else{

Shouji

window.location.href= "Mobile url";

}

$.parsejson (response) is used to convert data into JSON format;

Disabled (Disabled) property settings <input type= "submit" disabled/> set in JS, the value is true and false; no double quotes is used to disable an element , such as input The submit will turn gray and cannot be clicked.
such as: document.getelementsbytagname (' input ') [0].disabled=true/false;
Used in jquery: $ ("#removeButton"). Removeattr ("Disabled");//to become enable,jquery can only write like this
$ ("#removeButton"). attr ("Disabled", "disabled");//Change to Disabled

/*html {filter:progid:DXImageTransform.Microsoft.BasicImage (grayscale=1);} This is a full page limit black and white CSS code * /
Background:transparent; / * Set background default to Transparent * /

/* Use CSS gradient filters for background gradients and transparency */
filter:progid:dximagetransform.microsoft.gradient (startcolorstr= ' #cc090909 ', endcolorstr= ' #cc090909 ')! Important /* IE6,IE7 */

background-image:-moz-linear-gradient (Rgba (0,0,0,0.8) 100%, Rgba (0,0,0,0.8) 100%); /*firefox*/
background-image:-webkit-linear-gradient (Rgba (0,0,0,0.8) 100%, Rgba (0,0,0,0.8) 100%); /*chrome*/

/* Determine if the browser supports placeholder*/
$ (function () {
if (!placeholdersupport ()) {//Determine if the browser supports placeholder
$ (' [placeholder] '). focus (function () {
var input = $ (this);
if (input.val () = = input.attr (' placeholder ')) {
Input.val (");
Input.removeclass (' placeholder ');
}
}). blur (function () {
var input = $ (this);
if (input.val () = = "| | input.val () = = input.attr (' placeholder ')) {
Input.addclass (' placeholder ');
Input.val (input.attr (' placeholder '));
Input.css ({' Color ': ' #555 '});
}
}). blur ();
};
})

function Placeholdersupport () {
Return ' placeholder ' in document.createelement (' input ');
}

/* Get the type and name of the browser */

function Isie () {
Return navigator.appName.indexOf (' Microsoft Internet Explorer ') = = "-1"? False:true;
}//to determine the browser's type by acquiring the browser kernel Netscape and Microsoft Internet Explorer---the "to distinguish between the Firefox kernel and the IE kernel"

var isie8=navigator.useragent.touppercase (). IndexOf ("MSIE8.0") = = "1"? False:true;
Determine if it is IE8.0 browser "This usage by getting the name of the browser is clearly what kind of browser,----indexof is case-sensitive, did not find the return value" 1 "--------

/*
Below is the introduction of the next JS get client browser information

The Navigator object contains information about the browser. JS is to get the client browser information through the properties of Navigator
Navigator Object Properties:

Property
Describe

appCodeName returns the code name of the browser.
appMinorVersion returns the secondary version of the browser.
AppName returns the name of the browser.
AppVersion returns the platform and version information for the browser.
Browserlanguage returns the language of the current browser.
Cookieenabled returns a Boolean value that indicates whether cookies are enabled in the browser.
Cpuclass returns the CPU level of the browser system.
OnLine returns a Boolean value that indicates whether the system is in offline mode.
Platform returns the operating system platform running the browser.
Systemlanguage returns the default language used by the OS.
UserAgent returns the value of the user-agent header of the server sent by the client.
Userlanguage returns the natural language setting of the OS.

*/

Web front End--Knowledge point, note overlay (Javascript,jquery,html5+css3.0,ajax)