0

最近、レスポンシブ プロパティを使用してレイアウトのコーディングを開始しました。私は個人的にモバイル Web サイトが嫌いですが、訪問者に対応するために、サイトをレスポンシブにすることにしました。

私が理解できないのは、必要に応じてレスポンシブ プロパティを無効にする方法です。

ページの上部に、クリックするとモバイル サイトのオン/オフを切り替えるリンクが必要です。

これはできますか？

ありがとう！

4

3 に答える 3

3

最初に頭に浮かぶのは、切り替えがどちらか一方の場合に、HTML レイアウトから CSS ファイルを追加または削除する JavaScript (/jQuery) 関数です。レスポンシブ メディア クエリのみを含む別の CSS ファイルを作成する必要がありますが、それは大きな問題にはなりません。

于 2013-09-30T09:01:43.697 に答える
1

スタイルシートのレスポンシブ部分を別のファイルに入れるのが最も簡単な方法だと思いますresponsive.css。次に、そのスタイルシートを切り替えるリンクに JavaScript 関数をバインドできます。

で<head>：

<link rel="stylesheet" href="responsive.css" id="responsiveStyle">

で<body>：

<a href="javascript:toggleResponsive()">Toggle</a>

Javascript:

function toggleResponsive() {
   var responsiveStyle = document.getElementById('responsiveStyle');
   if(responsiveStyle.rel === "stylesheet") {
      responsiveStyle.rel = "";
   } else {
       responsiveStyle.rel = "stylesheet";
   } 
}
于 2013-09-30T09:11:10.867 に答える