其實早知道這個屬性，但是一直沒有去研究過。今天正好在twitter看到這個詞，就去研究了下，正好解決了目前遇到的乙個小難題，所以分享下。嗯，其實這是個比較簡單的css3屬性。
在某個專案中，很多元素需要定位在乙個地圖層上面，這裡就要用到很多絕對定位或者相對定位的元素，但是這樣的話，這些浮在上面的div或者其它元素一般都會給個寬高，或者relative的元素可以不給寬高，這個時候，這些元素就會蓋住下面的地圖層，以至於地圖層無法操作。。。
然後正好在google map見到了類似的問題，拿來當例子來說：
google map中左上角的操作區域佔位是挺大的，如紅色框區域，然後在這個區域是無法操作地圖層的。那麼我們就可以給這個div設定 pointer-events:none，然後你就會發現下面的地圖就可以拖動和點選了。
但是悲劇的是，操作區域本身卻無法操作了，直接被無視掉了。不過不用擔心，我們可以給裡面的元素重新設定為 pointer-events:auto，當然，只給需要操作的元素區域設定。
貌似有點兒糾結，不過這樣可以保證地圖本身的可操作區域最大化。
嗯，上面只是個簡單的例子，來看下具體用法：
pointer-events: auto | none | visiblepainted | visiblefill | visiblestroke | visible | painted | fill | stroke | all | inheritpointer-events屬性有很多值，但是對於瀏覽器來說，只有auto和non兩個值可用，其它的幾個是針對svg的(本身這個屬性就來自於svg技術)。
firefox 3.6+和chrome 2.0+ 以及safari 4.0+都支援這個css3屬性，ie6/7/8/9都不支援，opera在svg中支援該屬性但是html中不支援。好吧，還是有點兒悲催～～
**：
css中pointer events屬性詳解
絕對定位元素蓋住鏈結或新增某事件handle的元素後，那麼該鏈結的預設行為 頁面跳轉 或元素事件將不會被觸發。現在firefox3.6 safari4 chrome支援乙個稱為pointer events的css屬性。使用該屬性可以決定是否能穿透絕對定位元素去觸發下面元素的某些行為。如下 複製 如下...
css3 pointer events 介紹詳解
pointer events 是什麼？顧名思義，pointer events 是乙個用於 html 指標事件的屬性。pointer events 可以禁用 html 元素的 hover focus active 等動態效果。預設值為 auto，語法 複製 如下 pointer events auto...
pointer events，乙個神奇的css屬性
pointer events，搞前端的朋友們應該聽說過這個屬性吧。每年聖誕節的時候，許多網頁上都會掛出乙個雪花飄落的特效增加一些節日氣氛。有一些是用flash實現的，也有用html js實現的。當時就很好奇為何在頁面z軸最上層增加了乙個層卻完全不會影響下面元素的任何事件響應。簡直是前端黑科技。後來看...