Simple way to identify iOS user agent in a jQuery if/then statement?
Exactly like it sounds..
Is there some magical and easy way to say:
if (user agent is iOS) {
if (browserRatio >=1.5) {
$container.css('min-height', '360px');
} else {
$container.css('min-height', '555px');
}
}
开发者_如何学编程Found it.
if (navigator.userAgent.match(/(iPod|iPhone|iPad)/)) {
if (browserRatio >=1.5) {
$container.css('min-height', '360px');
} else {
$container.css('min-height', '555px');
}
}
I know you're asking about jquery in particular, but IMO, you almost certainly want to use CSS3 @media queries for this. There's even support for testing for landscape or portrait orientation.
@media (orientation:landscape) {
.container_selector {
min-height: 555px;
}
}
@media (orientation:portrait) {
.container_selector {
min-height: 360px;
}
}
Hope this helps!
In order for this to work you are going to need to define browserWidth, but yes it will work. Here I targeted iPad only.
$(window).load(function(){
var browserWidth = $(window).width();
if (navigator.userAgent.match(/(iPad)/)) {
if (browserWidth == 768) {
$('.sectionI').css({'margin-left': '30px'});
} else if (browserWidth == 1024) {
$('.sectionI').css({'margin-left': '0px'});
}
}
});
For web app version try this.
if (
("standalone" in window.navigator) &&
!window.navigator.standalone
){
// .... code here ....
}
To make sure this string doesn't get matched: Mozilla/5.0 (Mobile; Windows Phone 8.1; Android 4.0; ARM; Trident/7.0; Touch; rv:11.0; IEMobile/11.0; NOKIA; Lumia 925) like iPhone OS 7_0_3 Mac OS X AppleWebKit/537 (KHTML, like Gecko) Mobile Safari/537 just change your code to
if (navigator.userAgent.match(/(\(iPod|\(iPhone|\(iPad)/)) {
if (browserRatio >=1.5) {
$container.css('min-height', '360px');
} else {
$container.css('min-height', '555px');
}
}
Based on comments to my previous answer, it sounds like the real question is, "how do you hide the URL bar in an iPhone". To that question, I found this:
How to Hide the Address Bar in MobileSafari:
<body onload="setTimeout(function() { window.scrollTo(0, 1) }, 100);">...</body>
加载中,请稍侯......
精彩评论