2017-05-23 10 views
0

Hy、私のウェブサイトでのズーム/レスポンスデザインのお手伝いをお待ちしております。基本的に、私はなぜ私のサイトを知りたいのですか?それを無効にする方法 - ズームインするときに、メディアクエリーに従ってdivをredelegatesします。私はメディアのクエリキックだけでブラウザ/画面のサイズではなく、ズームにしたいと思います。 HERESに私のアウトラインコード:ズーム時の応答性の高いデザインの防止

body { 
 
\t \t background-image: url(../img/Fotolia.jpg); 
 
\t \t background-position: center center; 
 
\t \t background-repeat: no-repeat; 
 
\t \t background-attachment: fixed; 
 
\t \t background-size: cover; 
 
\t \t background-color: #464646; 
 
\t \t font-family: "Open Sans",Arial,sans-serif; 
 
\t \t font-size: 14px; 
 
\t \t max-width: 100%; 
 
\t } 
 
\t 
 
\t .container { 
 
\t \t padding: 20px 20px 30px 20px; 
 
\t \t margin-right: auto; 
 
\t \t margin-left: auto; 
 
\t \t margin-top: 35px; 
 
\t \t margin-bottom: 35px; 
 
\t \t max-width: 1300px; 
 
\t \t text-align: justify; 
 
\t \t vertical-align: text-top; 
 
\t \t border-radius: 4px; 
 
\t \t border: 0px solid red; 
 
\t \t background-color: white; 
 
\t \t position: relative; 
 
\t \t overflow: hidden; 
 
\t \t background: #f3f3f3; 
 
\t } 
 

 
    @media only screen and (max-width: 1350px) { 
 
     some stuff 
 
    } 
 

 
    @media only screen and (max-width: 1090px) { 
 
     some stuff 
 
    } 
 

 
    @media only screen and (max-width: 650px) { 
 
     some stuff 
 
    }
 <body> 
 
      <div class="container"> 
 
       <div class="left"> 
 
       </div> 
 

 
       <div class="right"> 
 
       </div> 
 
      </div>

に、というように180%のズームで1090回のキックで150%、1350pxキックにブラウザをズーム。ズームでレスポンシブデザインを無効にするにはどうすればよいですか?どうも。

答えて

0

ズームを無効にするメタタグを追加できますか?私が知る限り、ズーム時に応答性を停止する方法はありません。

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

+0

本当にズームを完全に無効にするつもりはありません – Greedy

+0

あなたには本当の選択肢がありません@Greedy – Ian

0

ユーザーがズームするとき、彼らはそれぞれの画素を大きくするために、ブラウザをお願いします。

ピクセルが大きいほど、ウィンドウに収まるピクセルが少なくなります。

これにより、適用される幅、したがって最大幅の@mediaルールが変更されます。

これを防ぐことはできません。

関連する問題