jQueryビューポートのアスペクト比

Question

SCREEENまたはビューポートのアスペクト比をトラッキングするための式を探しています（あなたが知っているガイドがあれば、私にリンクすることができますが、必要な新しいコードは必要ありません:)。

したがって、問題の核心は... 私はビデオ（mp4）を持っています。これは何らかのバックグラウンドのようなものです。今、全画面をカバーするビデオが必要です。 ビデオにはアスペクト比があり、画面にはアスペクト比があることがわかっているので、一部のモニタではエッジがカットされるという事実は問題ありません。

しかし、私はスタイルを変更する必要があるいくつかの制限があり、：

は16まで：9 - 16から1

スタイリング使用：8,99と広い - あなたが知っている、それらの余分広いのように湾曲したモニター、私は別のスタイリングが必要です。だから、

---

- アスペクト比が16以上ANY広い場合、確認方法：9？

はこれまでのところ、私はこのトピック（受け入れ答え）からGDCを使用しようとしましたが、私はそれが働いて（すべての解像度が異なるGDCを持っているとして、私は16と比較することができませんでした：9）を取得することができませんでしたWhats the algorithm to calculate aspect ratio? I need an output like: 4:3, 16:9

ので、最終的にするために、コード

function ratiocompare(width, height){ 
//this I need to create 
//sth like 

//if(aspect ratio is any wider than 16:9){return true;} 
//else{return false;} 
} 

function checkratio(){ 

     var compare = ratiocompare($(window).width(), $(window).width()); 

     if(compare) 
     { $("#video").css("width","100%"); 
      $("#video").css("height","auto"); 
      $("#video").css("left","0"); 
      $("#video").css("top","50%"); 
      $("#video").css("transform","translate(0, -50%)"); 
     } 

     else{ 
      $("#video").css("width","auto"); 
      $("#video").css("height","130vh"); 
      $("#video").css("left","50%"); 
      $("#video").css("top","0%"); 
      $("#video").css("transform","translate(-50%, 0)"); 
     } 
} 

$(document).ready(function() { 
checkratio(); 
} 

ので、任意のヒント、解決策はありますか？私は非常に素晴らしいだろう:)ありがとう。

Answer 1

[OK]を解答は、1つの数学フォーラムから来た： 分割数の比率。私たちが得る数は、他のアスペクト比と比較できる数です。

16：9 - > 16/9 = 1.77777777 1.77777777より高い数値は、アスペクト比が16：9より広いことを意味します。 jqueryの中

：

function gcd(x, y){ 
    if (y == 0){ return x; } 
    return gcd (y, x % y); 
} 

function check(){ 
var ratio = gcd($(window).width(), $(window).height()); 
var testratio = ($(window).width()/ratio)/($(window).height()/ratio); 

if(testratio>1.7777777{//screen is wider than 16:9, do something} 
}