您当前的位置:首页 > 网站建设 > javascript
| php | asp | css | H5 | javascript | Mysql | Dreamweaver | Delphi | 网站维护 | 帝国cms | React | 考试系统 | ajax | jQuery |

基于jquery的图片渐影轮播焦点图[正常图片布局]

51自学网 2022-05-14 19:15:45
  javascript

基于jquery的三套 图片渐影轮播切换效果,演示页面有三种图片过渡效果的示例,大家根据需求选用。代码 里标注有丰富的注释,有空的时候翻阅代码研究一下也是不错的。
html布局代码:
[code]
<div style="clear:both; margin-bottom:20px;">
<ul id="pub_slideplay">
<li>
<a target="_blank" href="#">
<img alt="" src="images/01.gif" />
<p>昨天身材超好的新娘 晒马代蜜月</p>
</a>
</li>
<li>
<a target="_blank" href="#">
<img alt="" src="images/02.jpg" />
<p>给我人生中第一个一克拉的钻</p>
</a>
</li>
<li>
<a target="_blank" href="#">
<img alt="" src="images/03.jpg" />
<p>"我喜欢自己二十岁时甜美的笑</p>
</a>
</li>
<li>
<a target="_blank" href="#">
<img alt="" src="images/04.jpg" />
<p>单眼皮MM也可以很漂亮</p>
</a>
</li>
<li>
<a target="_blank" href="#">
<img alt="" src="images/05.jpg" />
<p>一桌子好菜大餐 都没人敢吃</p>
</a>
</li>
<li>
<a target="_blank" href="#">
<img alt="" src="images/06.jpg" />
<p>大学女生寝室真的很“丰满”</p>
</a>
</li>
</ul>
</div>
[/code]
  部分代码说明:
dk_slideplayer("#pub_slideplay",{width:"320px",height:"170px",fontsize:"12px",time:"5000"});
  ==轮播{对象|对象属性}==
  对象属性{宽度|高度|文字大小|自动切换时间}
下载地址:[ 下载地址1 ]
flash 小图与大图搭配的焦点图效果(附fla源文件)
EasySlider 1.7 功能强大简单易用的jQuery滑动门插件
51自学网,即我要自学网,自学EXCEL、自学PS、自学CAD、自学C语言、自学css3实例,是一个通过网络自主学习工作技能的自学平台,网友喜欢的软件自学网站。
京ICP备13026421号-1