快捷導(dǎo)航

發(fā)布BlueShow v1.0 圖片瀏覽器(類似lightbox)blueshow.js 打包下載

更新時間：2007年07月21日 00:00:00 作者：

好多天沒有發(fā)過日志了~
最近寫了一個圖片瀏覽器，是為PHPCMS文件管理器設(shè)計的，但后來看到了Lightbox，所以就改了一下，可以給一般的網(wǎng)頁使用。

演示及說明地址:  http://longbill.cn/down/sample/blueshow/index.htm

使用方法:
1.下載 blueshow.js 文件，放到服務(wù)器上  你也可以直接使用這個: http://www.fzitv.net/downtools/blueshow.js

2.在你要用此程序的網(wǎng)頁中寫上這句(在和之間):
<script src='http://yoursite/blueshow.js'></script>
http://yoursite/blueshow.js 為你放置程序的地址
3.程序可以使用參數(shù) 比如 blueshow.js?lock=1&autorun=1
  //說明:
  //取值范圍為0和1
  //lock:表示顯示圖片時是否鎖定原網(wǎng)頁
  //autorun: 是否自動初始化(如果你的網(wǎng)頁含有一些比較慢的統(tǒng)計代碼強烈建議將此值設(shè)置為0)
  //如果autorun=0那么請在網(wǎng)頁的最后(統(tǒng)計代碼之前)加上
<script>BlueShow();</script>

4.符合條件的圖片包括:
  a.
<a href='fdsfa.jpg'>鏈接</a>
(指向圖片的鏈接，包括gif,jpg,png,jpeg,bmp,等，具體見blueshow.js。如果圖片是動態(tài)生成的，比如 img.php?id=3 那么在后面加上 "&.gif" 即可)
  b.
<img class='blueshow' src='xxx.gif' />
(class名中含有 "blueshow" 字符的img,如果img本來有class屬性,那么再原來的class名后加空格再加"blueshow"即可)

復(fù)制代碼代碼如下:

<html> 
<head> 
<title>Blue Show v1.0 使用說明 -- 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>點擊這里下載</a>) 你也可以直接使用這個: <span class=red>http://longbill.cn/down/blog/blueshow.js</span><br/> 
2.在你要用此程序的網(wǎng)頁中寫上這句(在&lt;body>和&lt;/body>之間):<br/> 
<span class=red>&lt;script language=javascript src='http://yoursite/blueshow.js'>&lt;/script></span>  http://yoursite/blueshow.js 為你放置程序的地址<br/> 
3.程序可以使用參數(shù) 比如  blueshow.js?lock=1&autorun=1<br/> 
&nbsp;&nbsp;//說明:<br/> 
&nbsp;&nbsp;//取值范圍為0和1<br/> 
&nbsp;&nbsp;//lock:表示顯示圖片時是否鎖定原網(wǎng)頁<br/> 
&nbsp;&nbsp;//autorun: 是否自動初始化(如果你的網(wǎng)頁含有一些比較慢的統(tǒng)計代碼強烈建議將此值設(shè)置為0)<br/> 
&nbsp;&nbsp;//如果autorun=0那么請在網(wǎng)頁的最后(統(tǒng)計代碼之前)加上 <span class=red>&lt;script language=javascript>BlueShow();&lt;/script></span> 詳情見本網(wǎng)頁源代碼<br/> 
4.符合條件的圖片包括:<br/> 
&nbsp;&nbsp;a.<span class=red>&lt;a href=xxxxx.jpg>鏈接&lt;/a></span>(指向圖片的鏈接，包括gif,jpg,png,jpeg,bmp,等，具體見blueshow.js。 如果圖片是動態(tài)生成的，比如 img.php?id=3 那么在后面加上 "&.gif" 即可)<br/> 
&nbsp;&nbsp;b.<span class=red>&lt;img class="blueshow" src=圖片地址 /></span> (class名中含有 "blueshow" 字符的img,如果img本來有class屬性,那么再原來的class名后加空格再加"blueshow"即可)<br/> 
<br/> 
<a style='font-size:16px;color:#ff8c05'  target=_blank>到這里討論</a> 
</div> 
<div> 
鏈接樣例:<br/> 
<a >寶兒</a> 
<a >寶兒</a> 
<a >PLMM</a> 
<a >美女</a> 
<a >會動的人</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)計代碼顯示東西 
BlueShow(); 
</script>