實現 彈出iframe內嵌頁面元素全屏化

2021-09-24 16:00:32 字數 791 閱讀 9191

一直也沒分享有用的東西給大家,今天剛好做乙個例子,整理了一下,順便發給大家。希望多大家有幫助。

彈出iframe內嵌頁面元素到父頁面並全屏化

iframe和彈窗這些詞對於js高手來說都是耳熟能詳的東西,作為乙個新人來說,還在學習階段的我就在工作中遇到這麼乙個奇葩的需求,要在引入的iframe頁面裡做乙個全屏化的功能.

粗略一看,這還不容易,模擬下f11的功能鍵什麼的,於是網上一搜還真有一大堆關於全屏化的案例,遂借來用之.

然後高高興興的拿乙個沒有iframe引入的頁面做了個測試頁面檢視全屏化功能效果,**如下(fullscreenpage.html):

1 

2 37 8 9 10 11

12 13 14

15

16

17 181950

還做了瀏覽器相容(firefox=mozrequestfullscreen;w3c=requestfullscreen;chrome等=webkitrequestfullscreen;ie11=msrequestfullscreen).....於是,我立馬放到專案裡,結果是什麼樣子呢?執行下面的**(parentpage.html)就知道了

2 37 8 9

10

11

12 13

iframe頁面的 內嵌框架

iframe 在實際專案中是非常常見的 作用 在當前頁面中 可以通過 iframe 來檢視另乙個頁面 操作 1.通過iframe的src 指定的頁面.html 顯示指定頁面內容 2.通過超連結 操作 iframe iframe必須設定name iframe名字 a標籤 包含iframe的頁面可以叫 ...

html實現iframe內嵌頁面跳轉的demo

記錄一下iframe內嵌頁面的跳轉方式 index.html html head title 根目錄 title script function changesrc1 function changesrc2 script head body div button id btn sub1 href 1...

如何根據iframe內嵌頁面調整iframe高寬

問題來自於工作的例項,我的乙個網域名稱a的頁面,有個iframe,它可能內嵌了另乙個網域名稱b的頁面,也可能內嵌網域名稱c的頁面,但是呢,b和c的頁面大小是不一樣的,特別是高是不一樣的高,那麼我如何設定iframe的height屬性呢?這個本質就是跨域設定的問題。b和c提供乙個jsonp介面,讓有i...