一个很酷很炫js相册。

最新推荐文章于 2021-07-18 22:19:45 发布

原创最新推荐文章于 2021-07-18 22:19:45 发布 · 892 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#相册 #border

JavaScript 专栏收录该内容

1 篇文章

订阅专栏

本文介绍了一款使用JavaScript实现的炫酷相册效果。通过引入photo.js文件，并结合特定的HTML结构与JavaScript代码，可以轻松创建出交互式的图片展示效果。具体步骤包括引入JS文件、设置图片链接及调用展示函数。

一个很酷很炫js相册。

下载地址如下：

http://gosoa.com.cn/Article/2008-12/2008-12-10-73.html

使用方法：

首先在页面中要引入photo.js。

<script type="text/javascript" src="photo.js"></script>

再依次列出图片，注意，图片连接要调用一个js函数 onclick="return viewer.show(5)"

 
 <a href="http://www.gosoa.com.cn/pic/1 (6).jpg" onclick="return viewer.show(5)"> 
<img src="http://www.gosoa.com.cn/pic/1 (6).jpg" border="0" onclick="openPhoto('p_14')" /> 
<p>兴庆公园p> 
</a>

再需要加入下面的一段js就可以了

 
 <script type="text/javascript">
<!--
  var viewer = new PhotoViewer();
viewer.add('http://www.gosoa.com.cn/pic/1 (1).jpg');
viewer.add('http://www.gosoa.com.cn/pic/1 (2).jpg');
viewer.add('http://www.gosoa.com.cn/pic/1 (3).jpg');
viewer.add('http://www.gosoa.com.cn/pic/1 (4).jpg');
viewer.add('http://www.gosoa.com.cn/pic/1 (5).jpg');
viewer.add('http://www.gosoa.com.cn/pic/1 (6).jpg');//-->
</script>