隠しオーバーフローに不透明を適用する

CSSの隠れたオーバーフローに不透明度を適用する方法はありますか？私はoverflow: hiddenプロパティを使わなければならないdivがありますが、私は隠された要素に不透明度を適用したかったのです。ここで隠しオーバーフローに不透明を適用する

は私が達成しようとしているものの基本的な例です。

.slick-list:after { 
    content: ''; 
    display: block; 
    background: red; 
    opacity: 0.5; 
}

滑らかなプラグインは、メインコンテナからスライダーを隠すための責任があるクラス.slick-listというクラスを使用しています。デザイン要件の一部として、私は不透明なプロパティを使って隠れたスライドを表示する必要があります。それは可能ですか？私は::after要素にopacityプロパティを適用するとうまくいくと思っていましたが、明らかに効果がないと思いました。

Check my jsFiddle

出典

2016-05-13 brunodd

あなたがこのテストした：{[ARIA-隠さ= "真"] .slickスライドを不透明度：0.5; } –

隠されているものは見えないので、不透明度を適用すると隠されたままになります。何かがあれば、彼らは隠されているだけでなく透明になるので、もっと目に見えなくなります。それは解決策ではありません。フィドルでは、あなたが達成しようとしていることを、それほど明確にしていません。 –

@MrListerごめんなさい。このバージョンを確認してください：http://jsfiddle.net/5eceg5yd/77/それは水平スクロールですべての要素を示します。これは私がやろうとしていることですが、横スクロールはありません。 – brunodd

を適用する必要があり、不透明度を持つことはできません。基本的にボディにフル幅divを追加し、そのdiv内のカルーセルを追加することは本当にうまくいった。

.container { 
    padding: 0; 
    overflow: hidden; 
} 

.slick-list { 
    overflow: visible; 
}

Solution

出典

2016-05-13 10:10:24 brunodd

あなたは隠された要素にopacityを使用することはできませんいいえ、彼らはoverflowはあなたが望むものを達成するために、visibleに設定する必要がありますので、目に見えることはできません。

出典

2016-05-13 09:34:08

ええ、私はすでにこれをやった。しかし残念ながら、それは水平スクロールを表示します。 http://jsfiddle.net/5eceg5yd/77/ – brunodd

その水平スライダは、出力エリアの幅を超えているため、JS Fiddleにあります –

隠されたオブジェクトは、それが表示されていないとして、あなたはoverflowvisibleにまたは任意の快適なオプションを設定し、私はこのための回避策を見つけた不透明

出典

2016-05-13 09:59:17

隠しオーバーフローに不透明を適用する

答えて

関連する問題