- Notifications
You must be signed in to change notification settings - Fork2
Empower web sites and apps design through clever CSS selectors. Check a working sample at
License
rogeriotaques/detectr.js
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
Empower web sites and apps design through clever CSS selectors.
This plugin is a very small javascript library which gives you the ability towrite clever and specific CSS rules to refine your website design for eachdifferent browser, platform, device and operating system.
It has a really small footprint and doesn't have any library dependencies such as: jQuery, Mootools, (...). So,you can use it alone, or combined with those packages.
Start by cloning this repository to your local machine, or just download thesource-code into any folder of your PC. As an open-source, the source-code isavailable in its natural format and minified.
or simply run this command in your terminal
$ npm install -S detectr.js
Import or copy thedist/detectr.js (minified) file to any directory of your websiteor app. For example:
/ (root)|-- img/|-- css/|-- js/| |-- detectr.js|-- index.htmlImport the library in your HTML files.
Since it is intended to help you create better designs by empower your controlon CSS rules according to used browsers, I strongly recommend you to importDetectr.js within the HEAD tags.
E.g:
<html > <head > ... <script type="text/javascript" src="js/detectr.js" ></script> </head> <body > ... </body></html>As simple as that. As soon as you complete the 3 steps above and refresh yoursite in any browser, you will be able to see that many specific classes nameswere added in the HTML tag of your page.
E.g:
<html > ...</html>Detectr.js may add the following classes in the HTML tag:
| Class | Remark |
|---|---|
| .edge | Microsoft Edge |
| .ie | Internet Explorer |
| .ie{version} | E.g. ie10. |
| .webkit | Browsers based on the webkit |
| .iron | Iron Web Browser |
| .chrome | Google Chrome |
| .chrome{version} | E.g. chrome23 |
| .firefox | Firefox Browser |
| .firefox{version} | E.g. firefox32 |
| .opera | Opera Browser |
| .opera{version} | E.g. opera16 |
| .konqueror | Konqueror Browser |
| .safari | Safari Browser |
| .safari{version} | E.g. safari12 |
| .gecko | Browsers based on gecko |
| .android-browser | Android native browsers |
| Class | Remark |
|---|---|
| .mac | Apple Macintosh |
| .osx{version} | E.g. osx10_10 |
| .ios{version} | E.g. ios8 |
| .windows | Microsoft Windows |
| .win2k | Microsoft Windows 2000 |
| .win2k.sp1 | Microsoft Windows 2000 SP1 |
| .xp | Microsoft Windows XP |
| .vista | Microsoft Windows Vista |
| .win7 | Microsoft Windows 7 |
| .win8 | Microsoft Windows 8 |
| .win8_1 | Microsoft Windows 8.1 |
| .win10 | Microsoft Windows 10 |
| .nt | Microsoft Windows NT |
| .nt{version} | E.g. nt6.1 |
| .webtv | Web TV |
| .freebsd | Freebsd |
| .linux | Linux |
| .android | Android |
| .bb{version} | E.g. bb10 (for Blackberry 10) |
| Class | Remark |
|---|---|
| .x32 | Platform 32 bits |
| .x64 | Platform 64 bits |
| .arm | Platform ARM |
| Class | Remark |
|---|---|
| .j2me | |
| .iphone | Apple iPhone |
| .ipad | Apple iPad |
| .ipod | Apple iPod |
| .mobile | Any mobile device |
| .blackberry | Blackberry |
| Class | Remark |
|---|---|
| .touch | Touch screen devices |
| .js | Javascript supported |
| .svg | SVG Images supported |
| .no-svg | SVG Images NOT supported |
| .retina | Devices with pixelratio > 1 |
| .no-retina | Devices with pixelration = 1 |
| .portrait | Portrait orientation |
| .landscape | Landscape orientation |
This project is based on Rafael Lima's library "css_browser_selector"(http://rafael.adm.br/css_browser_selector/) which seems to be discontinuedsince Nov 2nd, 2010.
This projec is licensed under MIT License.
Copyright (c) 2015-2019 Rogério Taques
Permission is hereby granted, free of charge, to any person obtaining a copyof this software and associated documentation files (the "Software"), to dealin the Software without restriction, including without limitation the rightsto use, copy, modify, merge, publish, distribute, sublicense, and/or sellcopies of the Software, and to permit persons to whom the Software isfurnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in allcopies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS ORIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THEAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHERLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THESOFTWARE.
About
Empower web sites and apps design through clever CSS selectors. Check a working sample at