当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 发布BlueShow v1.0 图片浏览器(类似lightbox)blueshow.js 打包下载

Javascript
javascript秒数倒计时自动跳转代码
js动态生成按钮并动态生成8位随机数
JS旋转图片阵类
javascript md5加密代码
window.onload的页面加载技巧
javascript显示隐藏层比较不错的方法分析
javascript优先加载笔记代码
JavaScript for in锚点的动态创建
初学JavaScript第二章
javascript类型File的Input按钮功能研究
JavaScript下申明对象的几种方法小结
一个jquery的弹出层的插件
IE与firefox之jquery用法区别
判断JavaScript对象是否可用的最正确方法分析
javascript布局查看器效果代码
js模拟画笔效果
无废话JavaScript教程(全集)
执行iframe中的javascript方法
解决function函数内的循环变量
jQuery弹出层插件简化版代码

Javascript 中的 发布BlueShow v1.0 图片浏览器(类似lightbox)blueshow.js 打包下载


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-12   浏览: 394 ::
收藏到网摘: n/a

好多天没有发过日志了~
最近写了一个图片浏览器,是为PHPCMS文件管理器设计的,但后来看到了Lightbox,所以就改了一下,可以给一般的网页使用。
演示及说明地址: http://longbill.cn/down/sample/blueshow/index.htm
使用方法:
1.下载 blueshow.js 文件,放到服务器上 你也可以直接使用这个: http://www.ruanchen.com/'http://yoursite/blueshow.js'></script>
http://yoursite/blueshow.js 为你放置程序的地址
3.程序可以使用参数 比如 blueshow.js?lock=1&autorun=1
//说明:
//取值范围为0和1
//lock:表示显示图片时是否锁定原网页
//autorun: 是否自动初始化(如果你的网页含有一些比较慢的统计代码强烈建议将此值设置为0)
//如果autorun=0那么请在网页的最后(统计代码之前)加上
<script>BlueShow();</script>
4.符合条件的图片包括:
a.
<a href='fdsfa.jpg'>链接</a>
(指向图片的链接,包括gif,jpg,png,jpeg,bmp,等,具体见blueshow.js。 如果图片是动态生成的,比如 img.php?id=3 那么在后面加上 "&.gif" 即可)
b.
<img class='blueshow' src='xxx.gif' />
(class名中含有 "blueshow" 字符的img,如果img本来有class属性,那么再原来的class名后加空格再加"blueshow"即可)
复制代码 代码如下:

<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;' href='http://www.longbill.cn' target=_blank>By Longbill</a></div>
<div>
<h1>使用方法: </h1>
1.下载 blueshow.js 文件,放到服务器上 (<a href='http://longbill.cn/down/blog/blueshow.js' target=_blank>点击这里下载</a>) 你也可以直接使用这个: <span class=red>http://longbill.cn/down/blog/blueshow.js</span><br/>
2.在你要用此程序的网页中写上这句(在<body>和</body>之间):<br/>
<span class=red><script language=javascript src='http://yoursite/blueshow.js'></script></span> http://yoursite/blueshow.js 为你放置程序的地址<br/>
3.程序可以使用参数 比如 blueshow.js?lock=1&autorun=1<br/>
//说明:<br/>
//取值范围为0和1<br/>
//lock:表示显示图片时是否锁定原网页<br/>
//autorun: 是否自动初始化(如果你的网页含有一些比较慢的统计代码强烈建议将此值设置为0)<br/>
//如果autorun=0那么请在网页的最后(统计代码之前)加上 <span class=red><script language=javascript>BlueShow();</script></span> 详情见本网页源代码<br/>
4.符合条件的图片包括:<br/>
a.<span class=red><a href=xxxxx.jpg>链接</a></span>(指向图片的链接,包括gif,jpg,png,jpeg,bmp,等,具体见blueshow.js。 如果图片是动态生成的,比如 img.php?id=3 那么在后面加上 "&.gif" 即可)<br/>
b.<span class=red><img class="blueshow" src=图片地址 /></span> (class名中含有 "blueshow" 字符的img,如果img本来有class属性,那么再原来的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 href='http://longbill.cn/down/sample/blueshow/images/boa01.jpg'>宝儿</a>
<a href='http://longbill.cn/down/sample/blueshow/images/boa06.jpg' title='Boa!!!'>宝儿</a>
<a href='http://longbill.cn/down/sample/blueshow/images/demo01.jpg'>PLMM</a>
<a href='http://longbill.cn/down/sample/blueshow/images/meinv.jpg'>美女</a>
<a href='http://longbill.cn/down/sample/blueshow/images/demo02.gif'>会动的人</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;} //不让统计代码显示东西
BlueShow();
</script>