2009-11-25 12 views
5

की तर्ज पर कुछ का उपयोग कर:वहाँ सुविधा के लिए छवि के लिए समर्थन का पता लगाने के लिए एक व्यवहार्य तरीका है: डेटा बेस 64

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

ठीक है, लेकिन मैं मनोहर पतन प्रदान करने में सक्षम होना चाहता हूँ (सीएसएस अभिकथन जावास्क्रिप्ट के माध्यम से है) जब बेस 64 उपलब्ध नहीं है।

जाहिर है, वी 8 से पहले आईई इस कार्यक्षमता की कमी है इसलिए मैं ब्राउज़र द्वारा जा सकता हूं - लेकिन यदि संभव हो तो मैं इसे फीचर का पता लगाना पसंद करूंगा।

ऐसा करने के बारे में कोई विचार कैसे है?

उत्तर

6

यह हो सकता है कि आप क्या देख रहे हैं के लिए: http://weston.ruter.net/2009/05/07/detecting-support-for-data-uris/

मैं एक स्क्रिप्ट है कि IE6 में DataURI योजना का आंशिक समर्थन जोड़ता है पर काम किया +: http://phenxdesign.net/projects/phenx-web/iedatauri/example.php और कोड यहाँ है: http://code.google.com/p/phenx-web/source/browse/trunk/iedatauri/

IE5 + एक का समर्थन करता है डेटा यूआरआई की तरह भी, यह है लेकिन हमेशा नहीं संभव इसका इस्तेमाल करने की: http://www.betalon.com/blog/html_css/data-uri-in-css-crossbrowser.htm

+0

जुड़ा हुआ दृष्टिकोण के लिए +1, कि, एक साफ, काम – curtisk

+0

धन्यवाद जाँच करने के लिए रास्ता नहीं है कारोबार करता है सिर्फ महान :) –

2

mootools Browser.Features वस्तु का विस्तार करने (अगर कोई पाता है यह उपयोगी, modernizr इसका समर्थन नहीं करता)

ऊपर का उपयोग करना

http://www.jsfiddle.net/dimitar/5JT45/13/show/ या 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=="; 

})(); 
1

उनके विकि https://github.com/Modernizr/Modernizr/issues/14 पर Modernizr के लिए इस प्लगइन मिला:

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=="; 
})