|
|
最近寫(xiě)了一個(gè)圖片瀏覽器，是為phpCMS文件管理器設(shè)計(jì)的，但后來(lái)看到了Lightbox，所以就改了一下，可以給一般的網(wǎng)頁(yè)使用。
演示及說(shuō)明地址: http://longbill.cn/down/sample/blueshow/index.htm
使用方法:
1.下載 blueshow.js 文件，放到服務(wù)器上 你也可以直接使用這個(gè): http://www.jb51.NET/downtools/blueshow.js
2.在你要用此程序的網(wǎng)頁(yè)中寫(xiě)上這句(在和之間):
<script src='http://yoursite/blueshow.js'></script>
http://yoursite/blueshow.js 為你放置程序的地址
3.程序可以使用參數(shù) 比如 blueshow.js?lock=1&autorun=1
//說(shuō)明:
//取值范圍為0和1
//lock:表示顯示圖片時(shí)是否鎖定原網(wǎng)頁(yè)
//autorun: 是否自動(dòng)初始化(如果你的網(wǎng)頁(yè)含有一些比較慢的統(tǒng)計(jì)代碼強(qiáng)烈建議將此值設(shè)置為0)
//如果autorun=0那么請(qǐng)?jiān)诰W(wǎng)頁(yè)的最后(統(tǒng)計(jì)代碼之前)加上
<script>BlueShow();</script>
4.符合條件的圖片包括:
a.
<a href='fdsfa.jpg'>鏈接</a>
(指向圖片的鏈接，包括gif,jpg,png,jpeg,bmp,等，具體見(jiàn)blueshow.js。 如果圖片是動(dòng)態(tài)生成的，比如 img.php?id=3 那么在后面加上 "&.gif" 即可)
b.
<img class='blueshow' src='xxx.gif' />
(class名中含有 "blueshow" 字符的img,如果img本來(lái)有class屬性,那么再原來(lái)的class名后加空格再加"blueshow"即可)
復(fù)制代碼 代碼如下:
<html>
<head>
<title>Blue Show v1.0 使用說(shuō)明 -- By Longbill</title>
<style>
a { text-decoration:none; color:#ff3333; }
.red { color:#ff3333}
body {text-align:center;background-image:url(http://longbill.cn/down/sample/blueshow/images/gezi.gif)}
div {text-align:left;padding:8px;border:1px solid #4499ee;margin:5px;width:700px;
font-size:12px;background-color:#d6e9fc;color:#333333;}
img {margin:5px;}
h1{color:#ff8c05;font-size:16px;display:block;margin:2px;padding:0px;}
</style>
</head>
<body>
<div style="font-size:24px;color:#3333ee;font-weight:bold;text-align:center;">Blue Show v1.0 <a style='font-size:12px;color:#ff8c05;font-weight:normal;text-decoration:none;' target=_blank>By Longbill</a></div>
<div>
<h1>使用方法: </h1>
1.下載 blueshow.js 文件，放到服務(wù)器上 (<a target=_blank>點(diǎn)擊這里下載</a>) 你也可以直接使用這個(gè): <span class=red>http://longbill.cn/down/blog/blueshow.js</span><br/>
2.在你要用此程序的網(wǎng)頁(yè)中寫(xiě)上這句(在<body>和</body>之間):<br/>
<span class=red><script language=Javascript src='http://yoursite/blueshow.js'></script></span> http://yoursite/blueshow.js 為你放置程序的地址<br/>
3.程序可以使用參數(shù) 比如 blueshow.js?lock=1&autorun=1<br/>
//說(shuō)明:<br/>
//取值范圍為0和1<br/>
//lock:表示顯示圖片時(shí)是否鎖定原網(wǎng)頁(yè)<br/>
//autorun: 是否自動(dòng)初始化(如果你的網(wǎng)頁(yè)含有一些比較慢的統(tǒng)計(jì)代碼強(qiáng)烈建議將此值設(shè)置為0)<br/>
//如果autorun=0那么請(qǐng)?jiān)诰W(wǎng)頁(yè)的最后(統(tǒng)計(jì)代碼之前)加上 <span class=red><script language=Javascript>BlueShow();</script></span> 詳情見(jiàn)本網(wǎng)頁(yè)源代碼<br/>
4.符合條件的圖片包括:<br/>
a.<span class=red><a href=xxxxx.jpg>鏈接</a></span>(指向圖片的鏈接，包括gif,jpg,png,jpeg,bmp,等，具體見(jiàn)blueshow.js。 如果圖片是動(dòng)態(tài)生成的，比如 img.php?id=3 那么在后面加上 "&.gif" 即可)<br/>
b.<span class=red><img class="blueshow" src=圖片地址 /></span> (class名中含有 "blueshow" 字符的img,如果img本來(lái)有class屬性,那么再原來(lái)的class名后加空格再加"blueshow"即可)<br/>
<br/>
<a style='font-size:16px;color:#ff8c05' href='http://longbill.cn/blog/index.php?id=54' target=_blank>到這里討論</a>
</div>
<div>
鏈接樣例:<br/>
<a >寶兒</a>
<a >寶兒</a>
<a >PLMM</a>
<a >美女</a>
<a >會(huì)動(dòng)的人</a>
</div>
<div>
圖片樣例:<br/>
<img class="blueshow" src='http://www.google.com/logos/earthday05.gif' border=0 style='width:200px;' alt='Google' />
<img class="blueshow" src='http://www.google.com/logos/da_vinci.gif' border=0 style='width:200px;' alt='Google!!!!' />
<img class="blueshow" src='http://www.google.com/logos/van_gogh.gif' border=0 style='width:200px;' alt='Gooooooogle!!!!!' />
</div>
<script src='http://longbill.cn/down/blog/blueshow.js?lock=1&autorun=0'></script>
<script>
document.write = function () { return false;} //不讓統(tǒng)計(jì)代碼顯示東西
BlueShow();
</script>
JavaScript技術(shù)：發(fā)布BlueShow v1.0 圖片瀏覽器(類(lèi)似lightbox)blueshow.js 打包下載，轉(zhuǎn)載需保留來(lái)源！
鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。
