badbrowser.js 是一款能够检测浏览器版本并提示升级浏览器的 js 插件。badbrowser.js 可以根据配置信息,当用户的浏览器不满足配置需求时,提示用户升级他们的浏览器。
在页面中引入 badbrowser.css 和 badbrowser.js 文件。
<link rel="stylesheet" type="text/css" href="css/badbrowser.css">
<script src="js/badbrowser.js"></script>
你可以自定义弹出的升级浏览器对话框的内容,HTML 代码如下:
<h1>你使用的浏览器已经过时!</h1>
<h3 class="badbrowser-user-browser"></h3>
<p>您可以继续浏览器本网站,但是不保证能够正确执行所有的功能。</p>
<p>你可以根据下面的链接来升级您的浏览器</p>
<p>
<a class="oldbrowser__browserLink" title="Download Google Chrome" style="background-position: 0px 0px;"
href="https://www.google.com/chrome/" target="_blank"></a>
<a class="oldbrowser__browserLink" title="Download Mozilla Firefox" style="background-position: -60px 0px;"
href="https://www.mozilla.org/ru/firefox/new/" target="_blank"></a>
<a class="oldbrowser__browserLink" title="Download Opera" style="background-position: -120px 0px;"
href="http://www.opera.com/download" target="_blank"></a>
<a class="oldbrowser__browserLink" title="Download Safari" style="background-position: -180px 0px;"
href="https://www.apple.com/safari/" target="_blank"></a>
<a class="oldbrowser__browserLink" title="Download Internet Explorer" style="background-position: -240px 0px;"
href="https://www.microsoft.com/ie/" target="_blank"></a>
</p>
<a href="javascript:;" class="badbrowser-close">关闭</a>
通过下面的 js 代码来初始化 badbrowser 插件。
badbrowser.init({
// path to your html alerts
// could be a function:
// function (ua) {
// return '/alerts/' + lang + '.html'
// },
path: '/alerts/en.html',
// if `false` then user's choice will be saved in the cookies
// and alert window will not be showen next time
ignoreChoice: false,
// Min version of browser that will be supported
supported: {
// user of chrome v.39 will see an alert winodw
chrome: 42,
firefox: 38,
msie: 9,
opera: 26,
android: 10,
safari: 6,
// if `false`, will show alert for any mobile browser
mobile: false
}
})
更多关于 badbrowser.js 浏览器检测插件的 github 地址为:https://github.com/dvhbru/badbrowser
演示地址 | 下载地址 |
专业提供WordPress主题安装、深度汉化、加速优化等各类网站建设服务,详询在线客服!