亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

對(duì) lightbox JS 圖片控件進(jìn)行了一下改造, 使其他支持復(fù)雜的圖片說(shuō)明

 更新時(shí)間：2010年03月20日 22:41:07   作者：  
如果要為圖片添加詳細(xì)的圖片說(shuō)明，并為圖片的說(shuō)明設(shè)置一些格式，如字體的大小、顏色等，那么使用 title 這個(gè)屬性來(lái)設(shè)置這些說(shuō)明信息是沒(méi)辦法實(shí)現(xiàn)的。
修改的 lightbox 版本是 2.04 版。
下面是使用我們?cè)谑褂?lightbox 來(lái)顯示圖片時(shí)的基本設(shè)置：
復(fù)制代碼 代碼如下:

<a href="image-url" rel="lightbox" title="image-remark">
　　content
</a>

主要是給連接加了一個(gè) rel="lightbox" 屬性
以上面的試設(shè)置好連接時(shí)， 當(dāng)點(diǎn)擊此連接，lightbox 將會(huì)顯示連接上的圖片，并使用連接的 title 屬性作為圖片的說(shuō)明，如果要為圖片添加詳細(xì)的圖片說(shuō)明，并為圖片的說(shuō)明設(shè)置一些格式，如字體的大小、顏色等，那么使用 title 這個(gè)屬性來(lái)設(shè)置這些說(shuō)明信息是沒(méi)辦法實(shí)現(xiàn)的。
由于客戶一定要此功能，所以只好去查看 lightbox 的源代碼，檢查是否可以對(duì)其進(jìn)行改造，以滿足這個(gè)需要，幸運(yùn)的是 lightbox 主要的代碼量不是很大，而且可以對(duì)其進(jìn)行一個(gè)小小的修改，就可以滿足這個(gè)需要，主要是對(duì) prototype.js 這個(gè)JS 框架不太熟悉。
以下是修改的過(guò)程 ：
打開(kāi) lightbox.js 文件，原 218 行的代碼為：
this.imageArray.push([imageLink.href, imageLink.title]);
可以看到這里是直接讀取連接對(duì)象的 title 屬性，所以我們只需要把 imageLink.title 改一下就可以了：
this.imageArray.push([imageLink.href, document.getElementById(imageLink.contentId).innerHTML]);

把 imageLink.title 改成了 document.getElementById(imageLink.contentId).innerHTML 了;
從這一句可以看出來(lái)，我們需要為連接對(duì)象設(shè)置一個(gè) contentId 屬性，這個(gè)屬性的值是某個(gè) DOM 元素的 ID 號(hào)，圖片的說(shuō)明就是此元素的內(nèi)容了。
修改完之后就可以在 HTML 這樣設(shè)置圖片說(shuō)明了：
復(fù)制代碼 代碼如下:

<a href="image-url" rel="lightbox" contentId="imgDesc" title="image">
　　<div id="imgDesc" style="display:none">description</div>
　　content
</a>

相關(guān)文章

最新評(píng)論