9月29

HighSlide图片浏览特效 For Bo-Blog

| |
21:24Blog资源  From: 本站原创
说明:
这是一个很好的图片浏览特效,与lightbox特效相比,最大的优势在于它不需要将网页加载完就能加载特效了
先看演示效果:请点击图片并可拖动

点击在新窗口中浏览此图片
1、解压得到两个文件夹,上传到blog根目录覆盖原文件(注意备份inc\ubb.php)
2、进入后台,创建一个head模块,代码如下:

<script type="text/javascript" src="highslide/highslide.js"></script>
<script type="text/javascript">
hs.registerOverlay(
       {
           thumbnailId: null,
           overlayId: 'controlbar',
           position: 'top right',
           hideOnMouseOut: true
       }
   );
  
   hs.graphicsDir = 'highslide/graphics/';
   hs.outlineType = 'rounded-white';
   window.onload = function() {
       hs.preloadImages(5);
   }
</script>
<style type="text/css">
.highslide {
   cursor: url(highslide/graphics/zoomin.cur), pointer;
   outline: none;
}
.highslide img {
   border: 1px solid #DCDCDC;
   padding: 5px;
   background-color: #FFFFFF;
}
.highslide:hover img {
   border: 1px solid #333333;
   padding: 5px;
   background-color: #FFFFFF;
}

.highslide-image {
   border: 1px solid white;
   padding: 5px;
   background-color: #FFFFFF;
}
.highslide-image-blur {
}
.highslide-caption {
   display: none;
   border: 1px solid white;
   border-top: none;
   font-family: Tahoma,Verdana, Helvetica;
   font-size: 12px;
   padding: 5px;
   background-color: white;
}
.highslide-loading {
   display: block;
   color: white;
   font-size: 12px;
   font-weight: bold;
   text-transform: uppercase;
   text-decoration: none;
   padding: 3px;
   border-top: 1px solid white;
   border-bottom: 1px solid white;
   background-color: black;
}
a.highslide-credits,
a.highslide-credits i {
   padding: 2px;
   color: silver;
   text-decoration: none;
   font-size: 12px;
}
a.highslide-credits:hover,
a.highslide-credits:hover i {
   color: white;
   background-color: gray;
}
</style>


3、如果你的模版CSS文件定义了如下的图片边框样式:
例:
.insertimage {
   border: 1px solid #E7F1D4;
   padding: 3px;
   background-color: #FFFFFF;
}


请注释或删除!!!!

转载自:叶阳博客    http://blog.nzye.com

上传附件中的highslide文件夹至根目录如传至其它目录请更改head模块和JS文件中的路径。
上面的UBB.php只适合2.0.3版本

2.1.0b3适用版本
下载文件 (已下载 209 次)


如页面未加载完毕时点击图片可能导致出现 “Internet Explorer无法打开Internet站点http://***.com/”已终至操作的提示
致使当前页出现“该页无法显示”错误。


来源:夕阳醉了's Blog
地址:http://oznn.com/post/466/
转载时须以链接形式注明作者和原始出处及本声明!
阅读(4727) | 评论(1) | 引用(0)
北辰 Homepage
2007年10月1日 00:01
不错不错,很不错。
不过,不知道2.1.0版本吗?
夕阳醉了 回复于 2007年10月1日 12:14
能  我的就是2.1.0用的  下载第2个中的UBB.PHP就能2.1.0用
分页: 1/1 第一页 1 最后页
发表评论
表情
emotemotemotemot
emotemotemotemot
emotemotemotemot
emotemotemotemot
emotemotemotemot
emotemotemotemot
打开HTML
打开UBB
打开表情
隐藏
记住我
昵称   密码   游客无需密码
网址   电邮   [注册]