2012-03-05 8 views
3

iosデバイスとAndroidデバイスからアクセスしたときにdivの内容を変更するにはどうすればよいですか。私はjqueryのモバイルフレームワークに基づいて、私は働いている会社のためのアプリケーションのためのモバイルウェブサイトを作成しています。問題は、ユーザーがiOS端末にいる場合、アプリストアリンクを取得する必要があり、アンドロイドデバイスを使用している場合はアンドロイドマーケットリンクを取得する必要があります。iosやアンドロイドに固有のものを表示しますか?

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title>Thank You</title> 
    <link rel="stylesheet" href="../../jquery.mobile-1.0.1.min.css" /> 
    <link rel="stylesheet" href="../_assets/css/jqm-docs.css"/> 
    <script src="../../jquery.js"></script> 
    <script src="../../experiments/themeswitcher/jquery.mobile.themeswitcher.js"></script> 
    <script src="../_assets/js/jqm-docs.js"></script> 
    <script src="../../jquery.mobile-1.0.1.min.js"></script> 


    <script type="text/javascript"> 
    <!-- 
    if (screen.width >= 330) { 
    document.location = "indexandroid.html"; 
    } 
//--> 
</script> 

</head> 
<body> 
<div data-role="page" class="type-home"> 
<div data-role="header" data-theme="f"> 
     <h1>ThankYou!</h1>  
     <a href="../../" data-icon="home" data-iconpos="notext" data-direction="reverse" class="ui-btn-left jqm-home">Home</a> 
    </div><!-- /header --> 

    <div class="content-secondary"> 
    <div> 
      <p class="intro2"><strong>Download the App.</strong></p> 
      <div class="store"> 
      <a href="##"><img src="../_assets/images/app-store.png"></a> 
      <a href="##"><img src="../_assets/images/android-market.png"></a> 
     </div> 
     </div> 


</div> 
</body> 
</html> 

私はこの特定のページよりも画面サイズが大きい場合、特定のページにユーザーを送信するこのjavascriptコードを持っています。

答えて

3

私の知る限りでは、ユーザーエージェントの検出となり、これを行うための最も簡単な方法...私はjqueryのブラウザオプションに見てよ

+0

感謝ryan、それはiphoneのために働いているが、ipadで動作させるように見えることはできません。 アンドロイドは問題ありません。 – user1139877

2

ユーザーエクスペリエンスの観点からは、両方のリンクを表示します。同じOSを持っていなくても、会社や他の潜在的な顧客の他のユーザーを知っている可能性があるため、両方のプラットフォームにアプリケーションが存在することを顧客が認識していることはおそらく良いことです。

つまり、ユーザーエージェントの文字列を確認する必要があります。

http://api.jquery.com/jQuery.browser/

画面サイズは、モバイルオペレーティングシステムの貧弱な、そうでない場合は悪い指標である:jQueryのbrowser

はオプションです。

+0

など

var ua = navigator.userAgent.toLowerCase(); var isAndroid = ua.indexOf("android") > -1; var isiPhone = ua.indexOf("iphone") > -1; if(isAndroid) { // display your android app store etc.. } 

... 。私は両方のものを見せたいと思っていますが、私の上司は他の方法を望んでいます。 DAに感謝します。 – user1139877

関連する問題