ist es ein gangbarer Weg für die Bild erkennen Unterstützung Feature: Daten base64

Question

etwas entlang der Linien der Verwendung: ist

background:url(data:image/gif;base64,R0lGODlhIwAhALMAAAAAADQ0NENDQ25ubouLi6ioqLa2ttPT0/Dw8P///wAAAAAAAAAAAAAAAAAAAAAAACwAAAAAIwAhAAAIpQABCBxIsCCAAAYTKlw4cECCAQwjMnSY4KHEiwQpVrSIUaLGjRw7Kvy4EYEAkSNBljyJ0iDJiiZbulQJk6XMhjQTxLyJk+ZOngBe6rTJU+jPojmTKqXZc6nTpAKFPp0qsMDUqyoHWsWKleBWrk8LfgV5AKjYnGXNakWrdi3NtG3HbjTQtmrOAnUByK2It+7eBH3j5iSQVy5cv3PzegWsuCDExmYDAgA7) no-repeat center center;} 

ist in Ordnung, aber ich möchte in der Lage zu liefern Graceful Degradation (die CSS Behauptung durch Javascript) wenn base64 nicht verfügbar ist.

offensichtlich, IE vor V8 fehlt diese Funktionalität, so dass ich mit dem Browser gehen konnte - aber ich würde es vorziehen, Feature-Erkennung, wenn möglich.

irgendwelche Ideen darüber, wie es geht dabei?

Answer 1

Dies könnte das sein, was Sie suchen: http://weston.ruter.net/2009/05/07/detecting-support-for-data-uris/

ich an einem Drehbuch gearbeitet, die in IE6 + eine teilweise Unterstützung der DataURI Schema ergänzt: http://phenxdesign.net/projects/phenx-web/iedatauri/example.php und der Code ist hier: http://code.google.com/p/phenx-web/source/browse/trunk/iedatauri/

IE5 + a unterstützt zu Art von Daten URI, es ist aber nicht immer möglich, es zu benutzen: http://www.betalon.com/blog/html_css/data-uri-in-css-crossbrowser.htm

Answer 2

die oben mit Hilfe der Mootools Browser.Features Objekt zu verlängern (wenn jemand es nützlich findet, modernizr nicht unterstützt)

http://www.jsfiddle.net/dimitar/5JT45/13/show/ oder https://gist.github.com/821370

(function() { 
    Browser.Features.base64 = null; 
    var callback = function() { 
     Browser.Features.base64 = this.width == 1 && this.height == 1;   
     // alert(Browser.Features.base64); // true || false 
    }; 

    var img = new Image(), img = document.id(img) || new Element("img"); 
    img.onload = img.onerror = img.onabort = callback; 
    // 1x1 px gif to test with 
    img.src = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw=="; 

})(); 

Answer 3

Finden dieses Plugin für Modernizr auf ihrem Wiki https://github.com/Modernizr/Modernizr/issues/14:

Modernizr.addTest('datauri',function(){ 
    var data = new Image(); 
    data.onload = data.onerror = function(){ 
    return (this.width == 1 && this.height == 1); 
    } 
    data.src = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw=="; 
})