Показать или скрыть 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';
См. https://developer.mozilla.org/en-US/docs/Web/API/NavigatorID