WorldWideScripts.net Delivering the best Add-Ons in more than 37 languages.

中文(简体), English, हिन्दी/हिंदी, Español/Castellano, العربية, Русский язык, Français, 中文 (台灣), বাংলা, Bahasa Indonesia, اردو, Português, Deutsch, Bahasa Melayu (بهاس ملايو‎), 日本語 (にほんご), فارسی, Italiano, తెలుగు, Türkçe, ગુજરાતી, Język polski/polszczyzna, Tiếng Việt, ಕನ್ನಡ, Українська мова, ไทย
JavaScript / Miscellaneous

CSS/JS Browser Determiner

— Add-On auf WorldWideScripts.net

@de1wwsAbonniere den Feed um auf dem neuesten Stand zu bleiben!

Neu! Folge uns, wie Du es möchtest!


CSS/JS Browser Determiner - CodeCanyon Item for Sale

Ads

Ad: Bluehost hosting

Es ist leicht (2kb gzip oder 3,8kb minimierte) JavaScript Browser-Detektor, der in alle Ihre Web-Projekte genutzt werden kann. Es wird erstellt, um Ihnen zu CSS oder JavaScript-Code für einen bestimmten Browser, Browser oder was in einer sehr einfachen Art und Weise zu schreiben. Detect-Layout-Engine, OS, Unterstützung für CSS-Funktionen und vieles mehr.

Es ist unerlässlich Lösung für den Aufbau von Cross-Browser-und Cross-Plattform-Web-Sites und Web-Anwendungen.

Wie funktioniert es? Sehr einfach. Es erzeugt eine Liste von Klassen mit detaillierten Informationen über Browser-Layout-Engine, OS, Gerät und hängt sie an Tag <html> dann.

Im Gegensatz zu bekannten Modernizr, ist die CSS / JS Browser Deter meist fokussiert nicht auf die Browser-Funktionen, sondern auf dem Browser und dem Gerät selbst. Aber es bestimmt auch die Unterstützung der gemeinsamen CSS Funktionen.

Browser Detection Mit CSS

 .opera.element {color:red} // All versions of Opera.ie8.element {color:red} // MSIE 8.ie7_5.element {color:red} // MSIE 7.5.ie8-.element {color:red} // MSIE 8 or less.chrome24-.element {color:red} // Chrome 24 or less (25 version is the maximum available).webkit.element {color:red} // Webkit based browsers such as Chrome, Safari, IOS, Android etc..gecko18.element {color:red} // Browsers that based on Gecko v18.macos.element {color:red} // Mac OS only.windows.element {color:red} // Any version of Windows.win7.element {color:red} // Windows 7 only.pc.element {color:red} // Any non-mobile computer including Mac OS.mobile.element {color:red} // Any mobile device.desktop.element {color:red} // Window width 980px or more.iphone.element {color:red} // iPhone.ipad.landscape.element {color:red} // iPad in landscape orientation.android.element {color:red} // Device with Android OS.android.crmo.element {color:red} // Chrome Mobile on Android OS.mobile.tablet.element {color:red} // Only mobile device with current width of the window from 768px to 979px.boxsizing.element {color:red} // Browser that supports the CSS3 box-sizing property.no-gradient.element {color:red} // Browser that does not supports CSS3 gradients.cookie.element {color:red} // Cookies enabled.no-flash.element {color:red} // Flash is not installed... and so much more! 

Browser Detection mit JavaScript

 if (browser.ie && browser.version <= 8 ) { // Code for MSIE 8 or less } if (browser.is_mobile) { // Code for mobile devices } if (browser.is_old) { // Code for old browsers such as: // MSIE 9 or less // Firefox 3.6 or less // Safari 3.0 or less // Opera 10.1 or less } if (browser.supports("border-radius")) { // Code for browsers that supports the CSS3 border-radius property } if (browser.is_desktop) { // Window width is 980px or more } 

Und viel viel mehr.

Alle CSS-Selektoren

  • Browser - chrome, safari, firefox, ie, konqueror, opera, operamobi, operamini, crmo, unknown
  • Browser-Version wie: firefox18, firefox18-, firefox18_0 (aber nicht firefox18_0- oder firefox18_0_1234 oder firefox18_0a1 )
  • Layout-Motoren: webkit, gecko, trident, presto, khtml
  • Layout-Version wie: gecko18, gecko18_0 (aber nicht gecko18- oder gecko18_0_1 oder gecko18_0a1 )
  • Mobile Geräte: iphone, ipod, ipad, blackberry, kindle
  • Betriebssysteme: windows, win8, win7, vista, xp, win2003, cros, unix, linux, ios, android, unknown_os
  • Grund CSS3 properties: opacity, gradient, borderradius, borderimage, animation, transition, transform, textshadow, boxsizing, boxshadow. Oder no-gradient, no-borderimage etc...
  • Sonstiges:
    • pc, mobile (jede nicht-mobilen Computer oder Mobilgerät)
    • desktop, tablet, phone (nach Fensterbreite)
    • landscape, portrait (Ansichtsfenster Orientierung, nach Fensterbreite und Höhe)
    • retina, touchscreen (oder no-retina, no-touchscreen )
    • cookie, flash, java (oder no-cookie, no-flash, no-java )

JavaScript API

  • browser.is_modern - Gibt true zurück, wenn es ein moderner Browser. Abhängig davon, ob Browser das CSS3 Übergangs Immobilien
  • browser.is_old - Gegenteil von browser.is_modern
  • browser.is_mobile - Gibt true zurück, wenn es ein mobiles Gerät
  • browser.is_pc - alle nicht-mobilen Computer, einschließlich Mac OS
  • browser.is_desktop - Fensterbreite 980px und mehr
  • browser.is_tablet - Fensterbreite 768px auf 979px
  • browser.is_phone - Fensterbreite 767px oder weniger
  • browser.is_retina - liefert true, wenn es Retina Display
  • browser.is_touchscreen - - Gibt true zurück, wenn es Touchscreen-Gerät
  • browser.name - den Namen des Browsers
  • browser.NAME - wie browser.ie, browser.firefox usw. Gibt true oder nicht definiert
  • browser.nameFull - gibt den vollständigen Namen des Browsers wie "Firefox", "Internet Explorer", usw.
  • browser.version - die Version des Browsers
  • browser.layout - der Name der Layout-Engine, wie "WebKit", "Gecko", "Dreizack", "presto", "khtml" oder "unbekannt"
  • browser.LAYOUT_NAME - wie browser.webkit, browser.gecko usw. Gibt true oder nicht definiert
  • browser.layoutFull - vollständige Name der Layout-Engine, wie "WebKit", "Gecko", "Trident", "Presto", "KHTML" oder "Unknown"
  • browser.layoutVersion - die Version der Layout-Engine, wie "533,1" für WebKit / 533,1 ", 18,0" für Gecko / 18,0 "18.0a1pre" für Gecko 18.0 Alpha 1 pre usw.
  • browser.os - gibt den Kurznamen des Betriebssystems, wie "Windows", "Mac OS", "Cros", "Unix", "Linux", "ios", "android" oder "unbekannt"
  • browser.osFull - gibt den vollständigen Namen des Betriebssystems, wie "Windows", "Mac OS X", "CROS", "Unix", "Linux", "iOS", "Android" oder "Unknown"
  • browser.osVersion - gibt die OS-Version String wie "7" für Windows 7, "4.2" für Android 4.2 usw.
  • browser.device - gibt den Kurznamen des mobilen Gerät, wie "iphone", "ipad", "iPod", "Blackberry" oder "entfachen"
  • browser.deviceFull - gibt den vollständigen Namen des Mobilgeräts, wie "iPhone", "iPad", "iPod", "Blackberry" oder "Kindle"
  • browser.supports.CSS_PROP - wie browser.supports.opacity, browser.supports.gradient usw. Nur vordefinierte Eigenschaften (alowed "Common CSS-Eigenschaften" Liste). Bitte beachten Sie, dass das zweite Wort muss wie textShadow, borderRadius, boxSizing usw. kapitalisiert
  • browser.mode - Erträge "Desktop", "Tablet" oder "Handy", so die aktuelle Breite des Fensters
  • browser.orientation - Browserfenster Orientierung wie "Landschaft" oder "Porträt"
  • browser.cookieEnabled - liefert true, wenn Cookies im Browser aktiviert sein
  • browser.flashEnabled - Liefert true, wenn Flash Player installiert ist und im Browser aktiviert sein
  • browser.javaEnabled - liefert true, wenn Java installiert und in Browser aktiviert
  • browser.width() - gibt die Breite des Browser-
  • browser.height() - gibt die Höhe des Browser-
  • browser.supports("css-prop") - festzustellen, ob Browser unterstützt die CSS-Eigenschaft.

Responsive Dienstprogramme

CSS / JS Browser Deter ist auch unterstützt grundlegende reagiert utilites für schnellere Handy-freundliche Entwicklung. Sie können CSS-Selektoren verwenden, um den Desktop, Tablet oder Handy-Plattform zu bestimmen. Es kann hilfreich sein, wenn Sie schnellen Support in Internet Explorer 8 (oder weniger), die nicht unterstützt wird CSS3 Media Queries müssen.

Live-Demo und vollständige Dokumentation

Changelog

Version 2.3 | 6. Februar 2014
- Kleinere Bugfixes

Version 2.2 | 15. Dezember 2013
- Fixed Blitzerkennung
- Bugfixes

Version 2.1 | 15. Oktober 2013
- Behoben: Nachweis von Opera 15 Jahren, 11 IE
- Rückschaltung auf "ie" Eigentum von "msie" in JavaScript API (so jetzt ist es browser.ie )

Version 2.0.3 | 29. Mai 2013
- Live-Ausrichtung (Landschaft, Porträt) Update für CSS

Version 2.0.2 | 24. Mai 2013
- Behoben: Erkennung von mobilen Geräten

Version 2.0.1 | 11. Mai 2013
- Opera ist mit WebKit bewegen schnell, so dass wir nun bereit dafür!
- Es wurde ein Link auf die Dokumentation (in eine neue Domäne verschoben)

Version 2.0 | 23. Januar 2013
- Gesamtüberarbeiten almoust von Grund auf
- Noch leistungsfähiger. Zusätzliche Unterstützung neuer Browser, Betriebssystem, das Layout-Motoren, Geräte und andere Funktionen
- New-Erkennungsalgorithmus
- Jetzt können Sie Version von OS und Layout-Engine sowohl mit CSS und JavaScript zu erkennen
- Aktualisiert Demos
- New-Test-Tool hinzugefügt (siehe Live-Vorschau)
- Ersetzt Firefox Namen von ".mozilla" auf ".firefox"
- Ersetzt "ie" Eigenschaft auf "msie" in JavaScript API (so jetzt ist es browser.msie )
- Ersetzt Mac OS von ".Mac" in ".macos"
- Das gleiche 4kb (minimierte)!

Version 1.0.5 | 1. Januar 2013
- Fixed Fensterbreite Erkennung

Version 1.0.4 | 28. Dezember 2012
- Added OS: win8, Win7, Vista, XP
- Added Retina-Displays Erkennung

Version 1.0.3 | 27. Dezember 2012
- Added iOS Erkennung Unterstützung
- Fixed kritische Fehler mit Safari-Browser
- Sonstige Änderungen und Fehlerbehebungen


Herunterladen
Weitere Komponenten in dieser KategorieAlle Komponenten dieses Autors
KommentareHäufige Fragen und Antworten

Eigenschaften

Erstellt 26. Dezember:
12

Stand 23. Juni:
14

kompatible Browser:
IE6, IE7, IE8, IE9, IE10, Firefox, Safari, Opera, Chrome, Files inbegriffen

Software Version:
jQuery, MooTools 1.2, MooTools 1.3, MooTools 1.4, MooTools 1.4.5, YUI 2, YUI 3, EXT JS 3, Ext JS 4, script.aculo.us 1.9, script.aculo.us 2.0, Andere

Stichworte

E-Commerce, E-Commerce, Alle Artikel, Browser Erfassungs, CSS, JavaScript, skript, Wahlschalter, useragent