图片展示特效系列之三（网络收集）
<br><br><div>说明：</div><div>此代码特效所用作品及图片均取自风晴雪音画作品和地址链接，分享目的仅展示图片浏览效果，不针对作品本身。感谢风晴雪分享精美音画！</div><div><br></div><div><font face="宋体" size="4" color="#800080">友情提示：</font></div>鼠标光标放在每个主题名称上面时门帘自动提起，此时点击露出画面即可打开音画作品地址全图欣赏。<br><br><br><br><div style="left:-150px; width:900px; position:relative; top:190px;">
<iframe marginwidth="0" marginheight="0" src="http://cswz.hyyhzyw.com/tptx/d436/index.html" frameborder="0" width="900" scrolling="no" height="160"></iframe></div>
<br><br><br><br><br><br><br><br><br><br><br><font face="宋体" size="4"><b>代码修改、图片更换及文件上传</b></font><div><font face="宋体" size="4"><b>1、代码编辑</b></font></div><div><b><font face="宋体" size="4">（1）</font><span style="font-family: 宋体; font-size: large;">style.css文件代码修改</span></b><font face="宋体" size="4"><br></font><div><font face="宋体" size="4">本特效需修改CSS目录下style.css和根目录下index.html两个文件，</font><span style="font-family: 宋体; font-size: large;">style.css文件可用记事本打开，主要修改门帘图片的关联文件名：即</span><font face="宋体" size="4">ul#menuback li#shutter1 {<div><span style="white-space:pre"> </span>background: url(../images/1.jpg) no-repeat; </div><div>}这样一段代码。其中../images/1.jpg代码为门帘图片1（也就是效果图最左面第一个门帘图片），../images/2.jpg即代表第二个门帘图片，然后以此类推。style.css文件中总共有六段这样的代码，即6个门帘图片，这6个门帘需要用PS软件逐一去制作，当然门帘的设计可以任意发挥，但尺寸必须和源文件一样，此外如果门帘图片文件名不用1、2、3....进行命名，那么../images/1.jpg代码中的1.jpg也要相应更改为您所用的文件名。</div></font><font face="宋体" size="4"><b>（2）index.html文件代码修改</b></font></div></div><div><span style="font-family: 宋体; font-size: large;">index.html文件同样也用记事本打开，然后修改</span><font face="宋体" size="4">href="http://fqx0808.star2012home.com/2018/0904/wsbd.html"代码中的超链接地址，这段代码总共也有6段，每一段</font><span style="font-family: 宋体; font-size: large;">链接</span><font face="宋体" size="4">一个作品。修改时只要修改超链接地址即可，其他无需编辑。</font></div><div><font face="宋体" size="4"><br></font></div><div><font face="宋体" size="4"><b>2、图片更换</b></font></div><div><font face="宋体" size="4">所有的图片均应放在images文件夹里，上面说过，如果图片自己命名的话，那代码中也要做相应的修改，但如果使用源文件命名，那无需修改，只要按照尺寸要求制作图片并替换即可。</font></div><div><font face="宋体" size="4"><br></font></div><div><font face="宋体" size="4"><b>3、文件上传</b></font></div><div><font face="宋体" size="4">编辑好文件上传空间后，其目录及架构要和本地一致，否则不显示。</font></div><div><font face="宋体" size="4"><br></font></div><div><font face="宋体" size="4" color="#0000ff">源码下载：</font></div> 晴儿的音画美美哒{:2_199:}谢谢墨染老师分享{:2_188:} 这个挺好玩。。。 这也太精彩了，太高大上了，谢谢墨染分享！{:2_195:} 谢谢墨染分享。真棒！ 感谢分享了，辛苦了{:2_111:}{:2_111:}
页:
[1]