1. 程式人生 > >object遮擋dialog標籤的解決辦法

object遮擋dialog標籤的解決辦法

在我做dialog彈框的時候遇到了一個問題:前端使用的是BJUI框架,在navtab裡面載入了一個object標籤的控制元件。後來因為業務要求,我要在object上面彈出一個dialog。這時出現了一個問題:object標籤遮擋了我要彈出的dialog。調查研究後,我查到iframe標籤可以遮擋object標籤。具體做法是:

  • 用一個div包住object,並新增iframe
    <div>
    <object></object>
    </div>
    <iframe>
    </iframe>
  • 對div和iframe分別新增定位屬性
    <div style="position:absolute;z-index:1;">

    <object></object>
    </div>
    <iframe style="position:absolute;z-index:2;">
    </iframe>
  • 對iframe新增位置屬性,比如top,left,width,height,要保證和彈出的dialog的大小和位置一致
  • 設定iframe的display為none,當dialog彈出的時候設定為block,關閉的時候設定為none