搜尋此網誌

2013年5月9日 星期四

[JQuery] 簡易似jquery BlockUI onOverlayClick 事件

小緋最近功能上的需求,
再一個擬pop div的視窗進行overlay click event

小弟以blockUI demo 製作一個示意圖:

以blockUI Demo 為例,但呈現方式並不像blockUI使用的是同層級的處理,
主要overlay的部份為 parent 視窗,而內容頁面為children頁面

因為父子皆為同層,所以無法直接透過 parent click event 進行處理,因為點選 children 區塊, parent click event 還是會觸發。

所以需要進行區分 overlay 與 content 相異判斷,後來找到了答案,就是 hover,以子層 hover 來決定要不要進行處理,所以最後 code 如下:

$('parent').click(function(){
    if(!$('children').is(':hover')){
        //do something
    }
})

透過這種方式,就可以清楚判定滑鼠點擊的是 overlay 還是 content,那自然可以在裡面加上移除html code 或 hidden 的處理,在使用上就可以類似 unBlockUI處理了。

沒有留言:

張貼留言