1

CSS メディア クエリを使用してレスポンシブ テーマを作成しています。「GO TO DESKTOP WEBSITE」というラベルの付いた Web サイトのフッターにリンクを追加したいと考えています。このリンクは、特にモバイル デバイスに表示されます。訪問者がデスクトップ Web サイトのリンクをクリックしたときに、Web サイトにモバイルではなくデスクトップ メディア クエリが読み込まれるようにするにはどうすればよいですか。私は自分の問題についてかなり明確にしたことを願っています。Google で解決策を検索しましたが、関連するものは見つかりません。

4

1 に答える 1

0

responsive.css以下を使用してファイルをアンロードします。

document.getElementsByTagName('link')[0].disabled = true;

たとえば、次のような場合があります。

<link rel="stylesheet" href="base.css" type="text/css" id="css_base" />
<link rel="stylesheet" href="responsive.css" type="text/css" id="css_responsive" />

次に、次のことができます。

<a href="#" class="hidden-desktop" id="site_view">Show Full site</a>

$("#site_view").click(function() { 
   $("#css_responsive").prop("disabled", true); 
});

簡単な例を次に示します: http://jsbin.com/elukab/1 (ブラウザ ウィンドウを最小化するだけです)

また

モバイル バージョンをオフにすることを指定した新しい URL にユーザーをリダイレクトできます。次に例を示します。

$("#site_view").click(function() { 
   document.location = document.location.href + '?mobile=off';
});

動的言語では、クエリ文字列を読み取るだけで、レスポンシブ スタイルを読み込まないでください。私は .NET 開発者なので、次のようにします。

<link rel="stylesheet" href="base.css" id="css_base" />
@if(Request["mobile"] == null || Request["mobile"] != "off") {
    <link rel="stylesheet" href="responsive.css" id="css_responsive" />
}
于 2012-11-06T10:09:09.943 に答える