jQuery viewport aspect ratio

Question

Я ищу формулу для отслеживания пропорций SCREEEN или видового экрана (если есть какой-либо гид, о котором вы знаете, вы можете связать меня, а не обязательно новый код, необходимый :), но до сих пор у меня есть нашел только некоторые изменения размера изображения или онлайн-калькуляторы ...)

Итак, ядро ​​проблемы ... У меня есть видео (mp4), которое похоже на какой-то фон. Теперь мне нужно видео, чтобы охватить весь экран. Я знаю, что у видео есть соотношение сторон, а экран имеет некоторое соотношение сторон, так что я в порядке с фактом, что на некоторых мониторах некоторые ребра будут срезаны.

Но есть некоторый предел, где мне нужно изменить стили:

до 16: 9 - с помощью вводя в моду 1

С 16: 8,99 и шире - вы знаете, как те, сверхширокоугольные изогнутые мониторы, мне нужен другой стиль.

---

Так что - как проверить, если соотношение сторон ANY ВИДЕР чем 16: 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

Хорошо, решение пришло с одного математического форума: разделите номера отношения. Число, которое мы получаем, - это число, которое мы можем сравнить с другим соотношением сторон ...

как 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} 
}