Browser Fallbacks

Aus Wikizone
Version vom 6. Juli 2023, 07:32 Uhr von 134.3.86.14 (Diskussion)
(Unterschied) ← Nächstältere Version | Aktuelle Version (Unterschied) | Nächstjüngere Version → (Unterschied)
Wechseln zu: Navigation, Suche

Veraltet - Siehe Browser - Hacks Immer wieder kämpft man mit Features die nicht von allen Browsern unterstützt werden. Es gibt verschiedene Wege Fallbacks für solche Dinge zu implementieren. Eine große Hilfe kann Modernizr sein. Manchmal ist es besser (aus Zeitgründen und um JavaScript Overkill zu verhindern. Einfach gleich eine kleine JS Lösung zu Implementieren.

Links[Bearbeiten]

Browserfeatures mit Modernizr testen

https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-browser-Polyfills (für viele Fälle Plugins etc. vorhanden)

Snippets[Bearbeiten]

Placeholder imitieren[Bearbeiten]

Placeholdr jQuery Plugin[Bearbeiten]

https://github.com/vote539/placeholdr

Minimized


// Placeholdr, Copyright (c) 2013 Shane Carr
// https://github.com/vote539/placeholdr
// X11 License
(function(b,c,e,d){var g=function(){var a=b(this);a[d]()||(a.addClass(c),"password"===a.attr("type")&&(a.attr("type","text"),a.data(c+"-pwd",!0)),a[d](a.attr(e)))},h=function(){var a=b(this);a.removeClass(c);a.data(c+"-pwd")&&a.attr("type","password");if(a[d]()===a.attr(e))a[d]("")},k=function(){b(this).find("["+e+"]").each(function(){b(this).data(c)&&h.call(this)})};b.fn.placeholdr=function(){if(e in document.createElement("input"))return this;b(this).find("["+e+"]").each(function(){var a=b(this);
a.data(c)||(a.data(c,!0),g.call(this),a.focus(h),a.blur(g))});b(this).find("form").each(function(){var a=b(this);a.data(c)||(a.data(c,!0),a.submit(k))});return this};b.fn[d]=b.fn.val;b.fn.val=function(a){var f=b(this);if("undefined"===b.type(a)&&f.data(c)&&f[d]()===f.attr(e))return"";(f="string"===b.type(a))&&h.call(this);var k=b.fn[d].apply(this,arguments);f&&!a&&g.call(this);return k};b(function(){b(document).placeholdr()});document.write("<style>.placeholdr{color:#AAA;}</style>")})(jQuery,"placeholdr",
"placeholder","placeholdrVal");