彈跳視窗iframe的運用
要簡單的使用手機形式的iframe彈出視窗
一般要使用的話,都需要寫很多語法,在這邊可以使用
fancybox這個jQuery的外掛
使用時,記得加入class="iframe",加入之後,要在在畫面上設定如下
一開始使用的時候,發現怎麼按都不會出現彈跳視窗,但是在畫面上寫死的時候,就會work
後來想到應該是順序的問題(HTML上寫死的畫面已經載入,動態生成算是後來才追加的),因此如同作多國語系的時候一樣,
在畫面生成之後加入即可動作。
而如果在ifrmae的畫面中要刷新後方的父頁面(例如在子視窗編輯評論,編輯完成後回到父視窗)
可以加入以下兩行
關閉該子視窗
PS. 如果沒有加入parent而直接使用window.location = "OOOO.html";的話,會變成刷新子視窗
一般要使用的話,都需要寫很多語法,在這邊可以使用
fancybox這個jQuery的外掛
使用時,記得加入class="iframe",加入之後,要在在畫面上設定如下
$('.iframe').fancybox({ width: '100%', height: '70%', titlePosition: 'outside'});注意的是,如果畫面是動態生成的,記得在動態畫面生成之後,立刻加入這行。
一開始使用的時候,發現怎麼按都不會出現彈跳視窗,但是在畫面上寫死的時候,就會work
後來想到應該是順序的問題(HTML上寫死的畫面已經載入,動態生成算是後來才追加的),因此如同作多國語系的時候一樣,
在畫面生成之後加入即可動作。
而如果在ifrmae的畫面中要刷新後方的父頁面(例如在子視窗編輯評論,編輯完成後回到父視窗)
可以加入以下兩行
關閉該子視窗
parent.jQuery.fancybox.close();(填入原本父視窗的網址) 即可做到關閉子視窗同時刷新父視窗
window.parent.location = "evaluation.html";
PS. 如果沒有加入parent而直接使用window.location = "OOOO.html";的話,會變成刷新子視窗
留言
張貼留言