墨染锦年 发表于 2019-1-9 09:07:07

图片展示特效系列之一(网络收集)

<div align="center"><a href="http://mrjn.hyyhzyw.com/%E7%9B%B8%E5%86%8C%E7%89%B9%E6%95%88/%E5%9B%BE%E7%89%87%E6%B5%8F%E8%A7%881/index.shtml" target="_blank"><font face="微软雅黑"><font size="4">点击全屏欣赏</font></font></a></div>
<br><br><font face="宋体" size="4" color="#9932cc">友情提示:</font><br><font color="#800080">浏览方式既可以拖动图片下方滚动条,也可以点击每张图片或者滚动条左右两边倒退和前进按钮。代码压缩包下载可以点击效果图下方压缩包链接文件名,顺便说明一下,设置附件用金币购买也是象征性的,主要是想检验一下本功能是否正常</font>;P<br><br><br><br><br><br><br><br><br><br>
<div style="left:-310px; width:1200px; position:relative; top:190px;">
<iframe marginwidth="0" marginheight="0" src="http://mrjn.hyyhzyw.com/%E7%9B%B8%E5%86%8C%E7%89%B9%E6%95%88/%E5%9B%BE%E7%89%87%E6%B5%8F%E8%A7%881/index.shtml" frameborder="0" width="1200" scrolling="no" height="900"></iframe></div>
<br><br><br><br><br><br><br><br><br><br><br><br><br>

墨染锦年 发表于 2019-1-9 09:07:22

代码编辑及上传说明:

制作本特效需要进行两方面操作:一是更换图片;二是编辑代码。
1、更换图片
所有图片均放在images文件夹内,图片数量应该与代码中的图片地址数量相同,或多或少都不可以。
2、代码编辑
代码编辑很简单,只要按照下图所示编辑相应内容即可,其他无需编辑,当然对于熟悉代码的朋友而言,不妨可以尝试编辑一下其他元素,如背景颜色、图片之间的间隔距离以及滚动条图标和坐标值等,不熟悉建议不要更改,以免出错。

注:点击图片可以放大
3、文件上传
文件上传空间空间后应与本地文件结构一样,也就是说本地文件目录是什么样的,那上传到空间也要相同。如这款特效本地含有一个images图片文件夹和一个html文档,那你首先在空间作品目录下也要建个images文件夹,然后把所有的图片都上传到images文件夹里,而html文档应该与images文件夹放在同一级目录下,最后取html文档地址即可到论坛用发表音画大图的全屏代码发帖。



青石板 发表于 2019-1-9 13:51:43

又学到知识了,感谢墨染老师的精彩分享{:2_188:}

幽兰雪 发表于 2019-1-9 15:19:38

给力!正想要一种这样的代码呢!!!谢谢墨染无私分享!{:2_195:}
页: [1]
查看完整版本: 图片展示特效系列之一(网络收集)