फ़ायरफ़ॉक्स अस्पष्टता (पारस्परिकता) ग्रेडियेंट - एक छवि को बाहर निकालना

मेरे पास सामग्री के साथ सामग्री है।फ़ायरफ़ॉक्स अस्पष्टता (पारस्परिकता) ग्रेडियेंट - एक छवि को बाहर निकालना

तत्व - इसकी सामग्री के साथ - बाईं ओर पूरी तरह से अपारदर्शी होना चाहिए, दाईं तरफ पूरी तरह से पारदर्शी होना चाहिए। दाएं से बाएं तक समान रूप से वर्गीकृत।

सामग्री और पृष्ठभूमि के रूप में यह विलय कर रहा है, ठीक नहीं है, छवि को अग्रिम बनाने का कोई तरीका नहीं है।

मुझे पता है कि ग्रेडियेंट पृष्ठभूमि (-मोज़-रैखिक-ढाल) के रूप में उपयोग किया जा सकता है, लेकिन यह मेरी मदद नहीं करता है - यहां, मुझे तत्व की सामग्री को फीका करने की आवश्यकता है।

मैं आईई (अल्फा मास्क) और वेबकिट (छवि-मास्क) में ऐसा करने में सक्षम हूं, लेकिन पूरी तरह से एफएफ में फंस गया है।

यदि वहां कोई रास्ता है तो मुझे एसवीजी का उपयोग करने पर कोई फर्क नहीं पड़ता।

कृपया मदद करें?

स्रोत

2010-04-13 SamGoody

क्या नवीनतम फ़ायरफ़ॉक्स का अपना समकक्ष -वेबिट-मास्क-छवि है जिसका उपयोग CSS3 ग्रेडियेंट के साथ किया जा सकता है? –

यह पृष्ठ कैसे एफएफ 3.5+

https://developer.mozilla.org/en/applying_svg_effects_to_html_content

के लिए इस लक्ष्य को हासिल करने के लिए बताते हैं आप शायद एक फाइल में कुछ इस तरह चाहते हैं कहा जाता mask.svg:

<?xml version="1.0" standalone="no"?> 
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" 
    "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> 
<svg xmlns="http://www.w3.org/2000/svg" 
    version="1.1" 
    baseProfile="full"> 
    <mask id="m1" maskUnits="objectBoundingBox" maskContentUnits="objectBoundingBox"> 
     <linearGradient id="g" gradientUnits="objectBoundingBox" x2="1"> 
      <stop stop-color="white" offset="0"/> 
      <stop stop-color="white" stop-opacity="0" offset="1"/> 
     </linearGradient> 
     <rect x="0" y="0" width="1" height="1" fill="url(#g)"/> 
     </mask> 
</svg>

फिर अपने सीएसएस में निम्नलिखित शामिल हैं:

mask: url(/path/to/mask.svg#m1);

स्रोत

2010-07-28 13:49:26 danjwilson

क्या नवीनतम फ़ायरफ़ॉक्स का अपना समकक्ष -वेकिट-मास्क-छवि है जिसका उपयोग CSS3 ग्रेडियेंट के साथ किया जा सकता है? –

इसके लिए धन्यवाद! – eSentrik

-2

एक गंदे समाधान बाईं ओर पूरी तरह से पारदर्शी पृष्ठभूमि के साथ तत्व के शीर्ष पर एक div को अतिरंजित करना होगा और रैखिक ग्रेडियेंट का उपयोग करके दाईं ओर पूरी तरह से अपारदर्शी होगा।

मैं जानता हूँ कि यह बहुत नहीं है, लेकिन यह काम करना चाहिए;)

स्रोत

2010-04-13 21:53:17

मुझे नहीं लगता कि यह कैसे मदद करेगा। मुझे तत्व के पीछे पृष्ठभूमि देखने की ज़रूरत है, जो एक जटिल और बदलती पृष्ठभूमि है। इस तरह के परिणाम प्राप्त करने के लिए इसे किसी अन्य div के साथ कैसे कवर किया जाएगा? – SamGoody

मेरा मानना है कि एक गंदे समाधान आरजीबीए मूल्यों का लाभ उठाने के लिए हो सकता है। उन लोगों के साथ, आप एक वेब पर एक वेबकिट और मोज़ ग्रेडियेंट सेट करते हैं जो आपके द्वारा बात की जाने वाली सामग्री पर सही स्थिति है।

मुझे यकीन नहीं है कि क्या आपके पास आईई ग्रेडियेंट्स के लिए अल्फा मान हो सकते हैं। समाधान के साथ एकमात्र समस्या यह है कि इस div के पीछे ऑब्जेक्ट के लिए अंतःक्रियाशीलता

स्रोत

2011-03-18 10:30:57

वास्तव में, इस समाधान के साथ सबसे बड़ा मुद्दा यह है कि छवि पारदर्शी नहीं बनती है। यदि पृष्ठभूमि दिखाना चाहिए तो ढाल भी है, यह दिखाएगा नहीं – SamGoody

फ़ायरफ़ॉक्स अस्पष्टता (पारस्परिकता) ग्रेडियेंट - एक छवि को बाहर निकालना

उत्तर

संबंधित मुद्दे