फिक्स स्थिति: अतिप्रवाह में पूर्ण तत्व:

Question

स्क्रॉल करते समय स्क्रॉल तत्व: overflow: scroll (या ऑटो) का उपयोग करके, स्क्रीन से व्यापक छवि गैलरी का पूर्वावलोकन पूरा करना चाहता हूं। दाईं तरफ, एक छाया जो अंतिम दृश्य छवि को ओवरलैप करती है, यह इंगित करनी चाहिए कि अधिक छवियां दाईं ओर दिखाई दे रही हैं।

यहाँ एक फिडल है: http://jsfiddle.net/SBdLg/

सबसे पहले, मैंने सोचा था कि: आसान, कि छवि गैलरी एक box-shadow: inset दे। लेकिन यह छवियों के पीछे दिखाया जाएगा। अब, div पर ओवरलैपिंग के साथ position: absolute है, मैं वांछित प्रभाव तक पहुंचता हूं लेकिन box-shadow दाईं ओर स्क्रॉल करते समय भी चलता है।

आईएमएचओ, यह समस्या शीर्ष पर div की बजाय छाया वाली छवि का उपयोग करते समय भी होगी।

क्या सीएसएस द्वारा वांछित प्रभाव संभव है?

Answer 1

outer डीआईवी से shadow को ठीक से जहां आपको इसकी आवश्यकता है (यह बदसूरत बिट है) इसे प्राप्त करने में आपकी सहायता करेगा।

चेक डेमो: ताकि आप छाया की स्थिति हर बार साथ खिलवाड़ के बिना चारों ओर गैलरी स्थानांतरित कर सकते हैं रिश्तेदार:http://jsfiddle.net/SBdLg/11/