2013-04-18 7 views
14

सीएसएस क्लिप सिंटैक्स आपको एक बड़ी छवि के आयताकार क्षेत्र को परिभाषित करने के लिए प्राप्त करता है जिसे आप दिखाना चाहते हैं। उलटा निर्दिष्ट करने का कोई तरीका है? उस छवि के आयताकार क्षेत्र को निर्दिष्ट करें जिसे आप अदृश्य बनना चाहते हैं। पेज के माध्यम से एक आयताकार छेद छिद्रण की तरह नीचे देखने के लिए क्या है?क्या सीएसएस "क्लिप" संपत्ति के विपरीत है; क्लिप क्षेत्र छुपाएं?

कारण (यदि आपके कोई अन्य विचार हैं): मैं एक सीएमएस टेम्पलेट में 3 परत छवि बनाना चाहता हूं। परत 1 (नीचे) एक पृष्ठभूमि छवि है। परत 2 परत 1 के एक भाग पर बैठता है और एक ए 4 दस्तावेज़ की एक आयताकार screengrab छवि है। परत 3 (शीर्ष पर) एक पारदर्शी पीएनजी (इसके केंद्र में और इसके किनारों पर) है जो परत 2 दस्तावेज़ के ऊपरी दाएं भाग में एक सीमा, ड्रॉप छाया, डॉक्टर प्रकार लोगो और एक पृष्ठ कर्ल प्रभाव जोड़ता है।

परत 1 और 2 सीएमएस में अलग से अपलोड किए जाएंगे और सीएसएस को प्रभाव बनाने के लिए परत 3 छवि के साथ उन्हें एक साथ जोड़ना चाहिए। समस्या पृष्ठ कर्ल प्रभाव के लिए काम करने के लिए है, परत 2 के शीर्ष दाएं कोने को मुखौटा करने की आवश्यकता है ताकि आप परत 3 से परत 1 तक सभी तरह से देख सकें। मुझे उम्मीद थी कि क्लिप प्रॉपर्टी मुझे निर्दिष्ट करने की अनुमति देगी परत 2 के ऊपरी दाएं कोने में एक छोटा वर्ग जो अदृश्य होना चाहिए।

वैकल्पिक: एक ग्राफिक्स प्रोग्राम का उपयोग एक साथ परतों 1 और 3 गठबंधन करने के लिए और परत 2 के लिए एक पारदर्शी क्षेत्र छोड़ तो सही स्थिति के साथ प्राप्त करने के लिए परत 2 के शीर्ष पर नई संयुक्त छवि बन सकता था करने के लिए है एक ही प्रभाव। हालांकि, मैं इस तरह ग्राफिक्स तैयारी से बचने की उम्मीद कर रहा था क्योंकि आप इस तरह से पूरी छवि भी बना सकते हैं।

+0

विचित्र समाधान है कि मेरे दिमाग में आता है: परत 3 में कर्ल प्रभाव ड्रा और कोने को छिपाने के लिए एक पृष्ठभूमि (परत 1 की ही पृष्ठभूमि) जोड़ने। थोड़ा सा मैला लेकिन तेज़ ... – Arkana

+0

टिप्पणियों के लिए धन्यवाद। मैं उस लिंक पर आया था लेकिन मुझे चिंता है कि कुछ ब्राउज़रों पर यह बुरी तरह टूट सकता है। मैं ग्राफिक्स काम से बचने की भी कोशिश कर रहा हूं जो 3 परतों में से किसी एक को बदलने के लिए कितना समय लगता है। मेरे पास एक और विचार था। मैं लेयर 2 को एक पीएनजी बना सकता हूं और ग्राफिक्स प्रोग्राम में मैन्युअल रूप से अपने कोने (पारदर्शी होने के लिए) काट सकता हूं। मेरा प्रभाव काम करेगा और साइट पर लेयर 1 या लेयर 3 को बदलना आसान होगा। – Dominic

उत्तर

5

सरल उत्तर: सीएसएस क्लिप इसके लिए काम नहीं करेगा।

  1. नकली 'होल' के लिए प्रयास करें एक पृष्ठभूमि छवि के रूप में Layer1 साथ layer3 बनाकर:

    मैं दो विकल्प देखेंगे। यह लेयर 3 के पारदर्शी क्षेत्रों को लेयर 1 से भर देगा। आप इस समाधान को यहां कार्रवाई में देख सकते हैं: http://cssfilter.saschaseewald.com/

  2. एचएमटीएल कैनवास तत्व और परतों को गठबंधन करने के लिए इसके समग्र कार्यों का उपयोग करें। अवलोकन: http://www.html5canvastutorials.com/advanced/html5-canvas-global-composite-operations-tutorial/

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