點擊通過「疊加」

想象一下這樣的情況我有：點擊通過「疊加」

此HTML

<div class="overlay"></div> 

<div class="content"> 
    <a href="">CAN THIS BE CLICKABLE IN ANY WAY? </a> 
</div>

這個CSS

.content {position: relative; width: 100%; height: 100%; z-index:1; padding: 40px;} 
.overlay {position: fixed; width: 100%; height: 100%; z-index:2; background-color: rgba(0,0,0,.1);}

有沒有一種方法，使被後面索引的DIV覆蓋「可點擊」最好沒有JavaScript？

原因是，我想要覆蓋整個頁面的效果，但仍允許導航和使用下面的內容。

我錯過了什麼，有沒有辦法...或者這是不可能的？

預先感謝您。

FIDDLE STARTUP

SOLUTION：檢查婁請。

Addind此以通知該解決方案具有以下兼容性。

鉻 - iOS設備 - 安卓：沒錯
Safari瀏覽器： 4.0+
火狐： 3.6+
歌劇： 15.0+
IE： 9+

來源

2014-04-12 Hélio C

在完成時，這就是所謂的點擊劫持測試惡意的方式。請仔細閱讀攻擊和瀏覽器的相關措施，以便更好地瞭解爲什麼此行爲不總是安全或受信任。 – Anthony

你只需要添加pointer-events: none;至.overlay

參見http://jsfiddle.net/iamnotsam/DV49T/1/使用SVG爲IE9和IE10兼容性

對於IE 10，僅存在用於pointer-events: none部分支持，特別是元件必須是SVG。上述小提琴已經在一臺機器上驗證了讓IE9和IE10開心。感謝OP進行測試。

來源

2014-04-12 02:45:35 iamnotsam

+1這是有效的，但我們心愛的IE -10不會。任何解決舊版本的問題？先謝謝你。 –

也等一下我編輯jsfiddle與svg一起工作，很遺憾我無法測試它，因爲我沒有ie10 – iamnotsam

好的，看看是否有用。如果其他線程的建議很簡單，那麼我會感到驚訝。 – iamnotsam

這是一個我認爲會幫助你的例子。如果你想鏈接只是激活另一個元素的東西，然後使用#Something到你的鏈接。 http://www.w3schools.com/cssref/tryit.asp?filename=trycss3_target

something:target 
{}

這裏是教訓http://www.w3schools.com/cssref/css_selectors.asp

這裏是你的更新http://jsfiddle.net/DrewGoldsberry/5tGC7/1/

這個心不是對的jsfiddle工作，但你可以在W3School

來源

2014-04-12 03:03:30 DrewGoldsberry

我很欣賞你的回答和時間，但我想你並不完全明白我需要什麼。正確的行爲與問題中所解釋的一樣，標記爲正確的答案正是我所需要的。不管怎樣，謝謝你。 Best.HC –

對不起，想念閱讀的問題。 – DrewGoldsberry

點擊通過 「疊加」

回答

相關問題

點擊通過「疊加」