javascript結合jquery使圖片適應窗口大小

今天做“公共通知管理”的功能時,想實現一個效果就是點擊通知標題,彈出一個窗口對該通知的內容進行預覽,進而方便管理。因爲通知一般比較簡單所以限定了彈出窗口的大小,但是這種情況下一些有較大圖片的通知頁面會被掙得變形,因此需要對較大的圖片進行控制使其適應窗口的大小。

考慮採用js實現,因爲js的功底不是很紮實,好多都是對照的網上的方法實現的,做個記錄,方便以後查找。

首先是彈出窗口的部分

使用的window.open()函數,這個函數有n多的參數,一時記不住,每次都是用的時候網上查,整理一下方便以後使用:

  alwaysLowered yes/no 指定窗口隱藏在所有窗口之下。

  alwaysRaised yes/no 指定窗口浮在所有窗口之上。

  dependent yes/no 指定打開的窗口爲父窗口的一個子窗口。並隨父窗口的關閉而關閉。

  directions yes/no 指定Navigator 2和3的目錄欄是否在新窗口中可見。

  height pixel value 設定新窗口的像素高度。

  hotkeys yes/no 在沒有菜單欄的新窗口設置安全退出熱鍵。

  innerHeight pixel value 設置新窗口中文檔的像素高度。

  innerWidth pixel value 設置新窗口中文檔的像素寬度。

  location yes/ no 指明地址欄在新窗口中是否可見。

  menubar yes /no 指明菜單欄在新窗口中是否可見。

  outerHeight pixel value 設定窗口(包括裝飾邊框)的像素高度。

  outerWidth pixel value 設定窗口(包括裝飾邊框)的像素寬度。

  resizable yes /no 指明新窗口是否可以調整。

  screenX pixel value 設定新窗口離屏幕邊界的像素長度。

  screenY pixel value 設定新窗口離屏幕上邊界的像素長度。

  scrollbars yes /no 指明滾動欄在新窗口中是否可見。

  status yes /no 指明狀態欄在新窗口中是否可見。

  titlebar yes /no 指明菜單題目欄在新窗口是否可見。

  toolbar yes /no 指明工具欄在新窗口中是否可見。

  Width pixel value 設定窗口的像素寬度。

  z-look yes /no 在文檔中包含各個 <pplet>標籤的數組。

  fullscreen yes / no 打開的窗體是否進行全屏顯示

  left pixel value 設定新窗口距屏幕左方的距離

  top pixel value 設定新窗口距屏幕上方的距離

然後是在新窗口彈出時控制一下里邊的圖片大小,使用瞭如下代碼:


複製代碼
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章