Показать или скрыть Div на основе ОС

У меня есть веб-сайт, на котором я хотел бы иметь возможность рекламировать загружаемую программу только для Windows.

  • Реклама для этого будет лежать внутри div под названием "adfor windows".
  • Я хотел бы использовать метод обнаружения, аналогичный указанному здесь: http://www.javascripter.net/faq/operatin.htm

Резюме:

If Operating System = Windows

Then set visibility of Div 'adforwindows' to visible
Else Set visibility of Div 'adforwindows' to hidden

Кто-нибудь знает хороший скрипт html/javascript, который может это сделать?

РЕДАКТИРОВАТЬ

Это решение? Не могу заставить его работать;

<!DOCTYPE html>
<html>
<head>
<script>
var OSName="Unknown OS";
if (navigator.appVersion.indexOf("Win")!=-1) OSName="Windows";
if (navigator.appVersion.indexOf("Mac")!=-1) OSName="MacOS";
if (navigator.appVersion.indexOf("X11")!=-1) OSName="UNIX";
if (navigator.appVersion.indexOf("Linux")!=-1) OSName="Linux";

if(OSName == "Windows"){
   document.getElementById('adforwindows').style.visibility = "visible";
}
else{
   document.getElementById('adforwindows').style.visibility = "hidden";
}
</script>
</head>
<body>
<div class="adforwindows">
Windows Advert 
</div>
<p>Main site content<P>
</body>
</html>

2 ответа

Решение

Поскольку вы уже знаете ОС по этому коду (взято с сайта)

var OSName="Unknown OS";
if (navigator.appVersion.indexOf("Win")!=-1) OSName="Windows";
if (navigator.appVersion.indexOf("Mac")!=-1) OSName="MacOS";
if (navigator.appVersion.indexOf("X11")!=-1) OSName="UNIX";
if (navigator.appVersion.indexOf("Linux")!=-1) OSName="Linux";

Таким образом, вы можете использовать простой оператор if для проверки и document.getElementById для установки видимости.

var OSName="Unknown OS";
if (navigator.appVersion.indexOf("Win")!=-1) OSName="Windows";
if (navigator.appVersion.indexOf("Mac")!=-1) OSName="MacOS";
if (navigator.appVersion.indexOf("X11")!=-1) OSName="UNIX";
if (navigator.appVersion.indexOf("Linux")!=-1) OSName="Linux";

if(OSName == "Windows"){
   document.getElementById('adforwindows').style.display = "block";
}
else{
   document.getElementById('adforwindows').style.display = "none";
}


Если вам не нужно знать другие операционные системы, просто используйте этот короткий код:

if (navigator.appVersion.indexOf("Win")!=-1)
   document.getElementById('adforwindows').style.display = "block";
}
else{
   document.getElementById('adforwindows').style.display = "none";
}


РЕДАКТИРОВАТЬ: если вы хотите иметь его visibility:none/visible вместо display:none (есть разница: http://www.w3schools.com/css/css_display_visibility.asp вы можете изменить .style.display = "none"; в .style.visibility = "hidden"; и изменить .style.display = "block"; в .style.visibility = "visible";

Ты можешь использовать navigator.platform или же navigator.appVersion,

Например:

var getOS = function() {
    var operatingSystems = {
        'Win': 'Windows',
        'Mac': 'MacOS',
        'Linux': 'Linux',
        'X11': 'UNIX'
    };
    for(var k in operatingSystems) {
        if(navigator.appVersion.indexOf(k) !== -1) {
            return operatingSystems[k];
        }
    }
    return undefined;
};

console.log(getOS());

var os = getOS();
document.getElementById('adforwindows').style.display = os === 'Windows'
    ? 'block'
    : 'none';

DEMO

См. https://developer.mozilla.org/en-US/docs/Web/API/NavigatorID

Другие вопросы по тегам