buttonsを重ねた画像があります。buttons は半透明であり、ラベルを半透明にしたくないため、各ボタンにスパンをオーバーレイしました (不透明度 100%) 。spans がすべてのクリックを傍受しないようにするためpointer-events: none;に、s で css プロパティを使用しましたspan。
マークアップの構造は次のとおりです (Jade):
div.slide
div.controls.buttons
button.move.forward
button.move.back
button.info
div.controls.icons
span.move.forward.icon.ion-chevron-right
span.move.back.icon.ion-chevron-left
span.info.icon.ion-information
.icon.ion-*ionicon アイコン フォントのスタイルです。
レンダリングすると次のようになります。
問題は、私は を持っているため、またはをpointer-events:none;使用できないことです。を使用せずにクリックイベントを下の要素に伝播する方法はありますか?:hover:active.icons spanpointer-events: none
各ボタンにリスナーを配置し、javascript を使用してクリック イベントをトリガーする必要がありますか? それとももっといい方法がありますか？