ASP.NET實(shí)現(xiàn)自適應(yīng)圖片大小的彈出窗口

2010-08-28 10:49:27來源:西部e網(wǎng)作者:

在最近的項(xiàng)目中,遇到一個(gè)問題,要實(shí)現(xiàn)這樣的效果:

點(diǎn)pic_small.Aspx頁面的縮略圖后彈出pic_all.aspx頁面,pic_all.aspx頁面的大小要根據(jù)圖片大小自動(dòng)調(diào)整,而且要有圖片的說明信息,還可以點(diǎn)上一幅和下一幅等進(jìn)行翻頁。
實(shí)現(xiàn)過程如下:

pic_small.Aspx頁面縮略圖處的代碼為:

以下代碼即可實(shí)現(xiàn)點(diǎn)縮略圖后彈出頁面pic_all.aspx顯示圖片信息,下面要實(shí)現(xiàn)的是pic_all.aspx頁面根據(jù)圖片的大小自動(dòng)調(diào)整。
把以下代碼放在pic_all.aspx頁面的< Head >< /Head >之間:

這里的PicUrl是頁面pic_all.aspx中用來顯示原圖大小的,我用的是html控件,無論你用什么方法,反正就是要從數(shù)據(jù)庫中讀出圖片的名稱或是路徑了。

obj.offsetWidth 得到的就是顯示出來的原圖的寬了,obj.offsetWidth 127表示窗口在圖片的寬度基礎(chǔ)上再大127像素,因?yàn)橐粢恍┛臻g用來實(shí)現(xiàn)圖片的說明信息。

這樣就可以實(shí)現(xiàn)彈出來的窗口既可以根據(jù)圖片大小自動(dòng)調(diào)整,而且又可以隨意編輯彈出來的頁面,因?yàn)閺棾鰜淼捻撁媸且粋(gè)指定頁面,無論要編輯什么,都可以和平時(shí)處理頁面一樣處理了。

關(guān)鍵詞:ASP.NET

贊助商鏈接: