实用资源简洁全屏banner焦点图广告切换代码

简洁全屏banner焦点图广告切换代码

这个图片轮播效果适合用于企业网站首页的banner广告焦点图,代码和样式很简洁,只需引入相关的CSS和js文件即可使用:

easyslide.png

head部分代码
<link href="css/css.css" rel="stylesheet" type="text/css" />
<script src="js/jquery-1.11.1.min.js" type="text/javascript"></script>
body部分代码
<div id="solid">
  <div class="solid2"></div><div class="solid1"></div><div class="solid0"></div>
    <ul>
      <li><img src="images/width_pic3.jpg" /></li>
      <li><img src="images/width_pic2.jpg" /></li>
      <li><img src="images/width_pic1.jpg" /></li>
    </ul>
  <div id="btt"><span></span><span></span><span></span></div>
</div>
<script type="text/javascript" src="js/fordboy.js"></script>

这里采用了给图片设置相似颜色背景的方法实现了图片的“全屏”效果,具体可以自行测试,效果请点击下面的预览:

预览效果 下载地址

站长Colin Gao,85后自由职业者,爱钻研,爱学习网页设计。建立本站的目的是整理学习笔记,分享学习经验,认识更多的朋友。感谢您阅读本站的文章,部分内容参考了网上的一些教程,但我会尽量根据自己的理解写更多原创的东西,本站网址如下,欢迎转载:
如果方便的话,转载请注明来自:http://www.cssaaa.com/down/100.html