<!DOCTYPE>
<html>
<head>
<meta http-equiv="content-type" c charset="utf-8">
<title>Image play</title>
<style><span> body{
width</span>:<span>430px;
margin</span>:<span>20px auto;
}
p</span>.<span>now{
display</span>:<span>block;
width</span>:<span>400px;
height</span>:<span>200px;
overflow</span>:<span>hidden;
border</span>:1px solid <span>#</span><span>ccc;</span><span> }
li</span>.<span>now{
color</span>:<span>#</span><span>ccc;</span><span> }
li{
</span><span>list</span>-style:<span>none;
</span><span>float</span>:<span>left;
padding</span>:0<span> 10px;
margin</span>-bottom:<span>5px;
border</span>:1px solid <span>#</span><span>ccc;</span> background:<span>#</span><span>eee;</span><span> }
</span><span>#</span><span>fd{</span><span>list</span>-style:<span>none;
</span><span>float</span>:<span>left;
padding</span>:0<span> 10px;
border</span>:1px solid <span>#</span><span>ccc;</span> margin:0<span> auto;
background</span>:<span>#</span><span>eee;</span><span> }
img{
width</span>:<span>400px;
height</span>:<span>200px;
padding</span>:<span>1px;
</span><span>/*</span><span>padding-top:18px;</span><span>*/</span><span> }
</span></style>
</head>
<body>
<div>
<p <span>class</span>="now"><img src="./images/pic1.jpg" alt="php广告图片循环播放 幻灯片效果" ></p>
<p><img src="./images/pic2.jpg" alt="php广告图片循环播放 幻灯片效果" ></p>
<p><img src="./images/pic3.jpg" alt="php广告图片循环播放 幻灯片效果" ></p>
<p><img src="./images/pic4.jpg" alt="php广告图片循环播放 幻灯片效果" ></p><div class="aritcle_card flexRow">
<div class="artcardd flexRow">
<a class="aritcle_card_img" href="/xiazai/code/8926" title="追梦flash企业网站管理模板A系列11.0"><img
src="https://img.php.cn/upload/webcode/000/000/017/175725900377380.jpg" alt="追梦flash企业网站管理模板A系列11.0" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
<div class="aritcle_card_info flexColumn">
<a href="/xiazai/code/8926" title="追梦flash企业网站管理模板A系列11.0">追梦flash企业网站管理模板A系列11.0</a>
<p>追梦A系列（11.0版本，以下11.0均简称为A）是针对企业网站定制设计的，模板采用全新AS3.0代码编辑，拥有更快的运行和加载速度，A系列模板主要针对图片展示，拥有简洁大气展示效果，并且可以自由扩展图片分类，同时还拥有三个独立页面介绍栏目，一个新闻栏目，一个服务介绍栏目，一个幻灯片展示和flv视频播放栏目。A系列模板对一些加载效果进行了修改，包括背景的拉伸模式以及标题的展示方式等都进行了调整，同</p>
</div>
<a href="/xiazai/code/8926" title="追梦flash企业网站管理模板A系列11.0" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a>
</div>
</div>
<ul>
<li <span>class</span>="now">1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
</div>
<script>
<span>var</span> tags=$("fd").getElementsByTagName("li"); <span>//</span><span> 获取切换按钮节点</span><span>var</span> cats=$("fd").getElementsByTagName("p"); <span>//</span><span> 获取切换内容节点</span><span>var</span><span>current</span>; <span>//</span><span> 高置当前帧的变量宣容器</span><span>var</span> timer=2000; <span>//</span><span> 设置2秒循环一次</span><span>function</span><span> disAll(){
</span><span>for</span>(<span>var</span> i=0; i<tags.length; i++<span>){
tags[i]</span>.className=""<span>;
cats[i]</span>.className=""<span>;
cats[i]</span>.style.display="none"<span>;
}
}
</span><span>function</span><span> setNow(){
</span><span>for</span>(<span>var</span> i=0; i<tags.length; i++<span>){
</span><span>if</span>(tags[i].className=="now"<span>){
</span><span>current</span>=<span>i;
}
}
}
</span><span>for</span>(<span>var</span> j=0; j<tags.length; j++<span>){
tags[j]</span>.>function<span>(){
clearInterval(h);
disAll();
this</span>.className="now"<span>;
setNow();
cats[</span><span>current</span>].style.display="block"<span>;
cats[</span><span>current</span>].className="now"<span>;
}
tags[j]</span>.>function<span>(){
setNow();
h</span>=setInterval("goNext()", 3000<span>);
}
}
</span><span>function</span><span> goNext(){
setNow();
</span><span>current</span>+=1<span>;
</span><span>if</span>(<span>current</span>>=parseInt(tags.<span>length)){
</span><span>current</span>=0<span>;
disAll();
cats[</span>0].style.display="block"<span>;
tags[</span>0].className="now"<span>;
cats[</span>0].className="now"<span>;
}</span><span>else</span><span>{
disAll();
cats[</span><span>current</span>].style.display="block"<span>;
cats[</span><span>current</span>].className="now"<span>;
tags[</span><span>current</span>].className="now"<span>;
}
}
</span><span>var</span> h=setInterval("goNext()",<span> timer);
</span><span>function</span><span> $(obj){
</span><span>return</span> document.<span>getElementById(obj);
}
</span></script>
</body>
</html>
立即学习“PHP免费学习笔记（深入）”；
以上就介绍了php广告图片循环播放 幻灯片效果，包括了方面的内容，希望对PHP教程有兴趣的朋友有所帮助。
