4

テレビに表示することのみを目的としたHTML/CSSを使用して作成されたページがあります。1920x1080の比率に完全に収まるようにページを開発しましたが、元のデザインとまったく同じアスペクト比でページを拡大または縮小する方法が必要です。一定の比率を維持するために使用できるJavascriptスクリプトはありますか？

編集：これは最終的に、ニュース/イベントなどのコンテンツを絶えず更新するRoRアプリケーションになります。

4

3 に答える 3

3

これにはCSS@mediaクエリを使用できます

@media screen and (min-width: 1920px) {
   /*Styles goes here*/
}

またはあなたは使用することができますmedia = projection

于 2012-10-26T19:51:14.503 に答える
3

ウィンドウのサイズ変更をリッスンするだけで問題は解決します。

$(window).on('resize',funciton(){
  var self=$('#ur_id');
  self.height( self.width() * (1080/1920))
})
于 2012-10-26T19:56:49.500 に答える
0

1920x1080の解像度をサポートするデバイスの設計は、たとえばモバイルデバイスにはほとんど適用できません。たぶん、いくつかの要素（通常はサイドバー）を非表示にするか、フォントサイズを小さくして、別のロゴをロードする必要があります...したがって、最良の解決策は、@Mrとしてクエリを使用するレスポンシブWebデザインです。@mediaエイリアンが提案します。

レスポンシブウェブデザインは、ウェブデザインへのアプローチであり、さまざまなデバイス（デスクトップコンピューターのモニターからモバイルまで）全体で、最適な表示エクスペリエンス（サイズ変更、パン、スクロールを最小限に抑えた簡単な読み取りとナビゲーション）を提供するようにサイトを作成します。電話）。

SmashingMagazineでいくつかのガイドラインとチュートリアルを確認できます。

于 2012-10-26T20:47:31.617 に答える