Coder Social home page Coder Social logo

del1214 / ie-blocker Goto Github PK

View Code? Open in Web Editor NEW

This project forked from panteng/ie-blocker

0.0 1.0 0.0 661 KB

一个精美的弹窗控件,帮助你通知用户他们的浏览器已经过时,并阻止用户继续访问网站

HTML 34.60% CSS 16.73% JavaScript 48.67%

ie-blocker's Introduction

IE-Blocker

再见了~IE!

IE-Blocker帮助你通知用户他们的浏览器已经过时,并阻止用户继续访问网站。

Screenshot

适用场景

如果你的网站不支持IE6-9,那么使用旧版IE的用户访问你的网站时会看到一个布局错乱、功能失效的网站。IE-Blocker正式为了避免这种尴尬而生。

使用IE-Blocker的网站不允许旧版IE用户访问网站内容,取而代之的是,用户会看到一个友好又精美的提示框,告知他们为何无法继续访问网站,并引导他们下载使用最新的浏览器。

实时预览

请使用 IE 6-9 浏览器访问下面的链接。

实时预览 - 中文版

Live Preview - English Version

安装方法

手动安装

你可以直接从**Release**页面下载最新版本的IE-Blocker。将下载好的文件解压,并将其中名为ie-blocker的文件夹放到你的项目中。

使用Bower或NPM安装

你还可以使用最喜欢的包管理器进行安装,在控制台中运行:

// With Bower
bower install ie-blocker --save

// With Npm
npm install ie-blocker --save

使用方法

<head>标签中引入 ie-blocker.cssie-blocker.zhCN.js(或ie-blocker.en.js)。使用IE特有的条件注释,以保证IE-Blocker只在旧版IE中被加载(IE的版本范围可根据需要自定义)。例如:

    <!--[if lte IE 8]>
    <link rel="stylesheet" href="ie-blocker/ie-blocker.css">
    <script src="ie-blocker/ie-blocker.zhCN.js"></script>
    <![endif]-->

配置项

  • img-path: IE-Blocker使用图片来展示浏览器图标。默认情况下,IE-Blocker会在ie-blocker.zhCN.js(或ie-blocker.en.js)所在的目录中寻找名为img的文件夹。

    如果你想把这些图片放到其他路径下,你需要在引入IE-Blocker的script元素上增加名为img-path的属性。例如:

     <!--[if lte IE 8]>
     <link rel="stylesheet" href="ie-blocker/ie-blocker.css">
     <script src="ie-blocker/ie-blocker.zhCN.js" img-path="../images/browser_icons/"></script>
     <![endif]-->
    

    注意 img-path 中指定的路径是相对于 **ie-blocker.zhCN.js(或ie-blocker.en.js)**的,而不是相对于当前HTML文件的。

    不要忘记末尾的斜杠'/'。

License

MIT

ie-blocker's People

Watchers

德巍 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.