图片flash显示示方式

发布时间：2020-12-15 06:43:45 所属栏目：百科来源：网络整理

导读：图片的flash显示方式，在各版本显示正常，在ajax方式调用下也正常： !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"html xmlns="http://www.w3.org/1999/xhtml"headmeta http-e

图片的flash显示方式，在各版本显示正常，在ajax方式调用下也正常：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<title>自动轮替广告</title>
<style type="text/css">
/*advertisement*/
*{margin:0;padding:0;}
.pic_442x130,.pic_442x130 a {
	display:block;
	width:480px;
	height:110px;
	overflow:hidden;
}

.pic_numlist { position: relative; float: right;  overflow: hidden; margin-top:-14px; font: 11px/14px Verdana; }
.pic_numlist li { display: inline; margin-left: 1px; padding: 0 7px; line-height: 14px; background-color: #666; color: #fff; cursor: pointer; }
.pic_numlist .pic_current { background-color: #ffb533; color: #333; }
</style>
</head>
<body>
<div style="width:480px; height:110px;">
    <div id="adpic" class="pic_442x130">
           <a href="/jpxl/zt/qinshan/" target="_blank"><img src="/pic/banner/shanshui_1.jpg" width="480" border="0" /></a> 
        <a href="/jpxl/zt/qinshui/" target="_blank"><img src="/pic/banner/shanshui_2.jpg" width="480" border="0" /></a>
       <a href="/catytour.htm" target="_blank"><img src="/pic/banner/shanshui_3.jpg" width="480" border="0" /></a>
      
    </div>
        <ul id="adpicBtn" class="pic_numlist"></ul>
</div>
<script type="text/javascript">
var isIE=/MSIE/.test(navigator.userAgent);
function $(id){
	return document.getElementById(id);
}
//显示切换广告
window.onload=function(){
	var picContainer=$("adpic")
	var btnContainer=$("adpicBtn");
	var interval=5000;
	var step=isIE?25:5;
	//初始化图片
	var linkList=[];
	var linkListTmp=picContainer.getElementsByTagName("a");
	for (var i=0;i<linkListTmp.length;i++){
		linkListTmp[i].style.display="none";
		linkList.push(linkListTmp[i]);
	}
	var link=document.createElement("a");
	link.style.display="none";
	picContainer.appendChild(link);
	if (!linkList.length)
		return;
	function goAdFunc(i){
		return function(){
			goAd(i);
		};
	}
	if (btnContainer){
		btnContainer.innerHTML="";
		var btnList=[];
		for (var i=0;i<linkList.length;i++){
			var btnTmp=document.createElement("li");
			if (!i)
				btnTmp.className="pic_current";
			btnTmp.innerHTML=i+1;
			btnList.push(btnTmp);
			btnContainer.appendChild(btnTmp);
			btnTmp.onclick=goAdFunc(i);
		}
	}
	var clock,running=false,current=0,next=0,target=null;
	if (isIE){
		picContainer.style.position="relative";
		picContainer.style.filter="progid:DXImageTransform.Microsoft.Fade(duration=1)";
	}
	linkList[current].style.display="";
	function goAd(i){
		if (i!==null){
			if (i==next)
				return;
			else
				target=i;
		}
		clearTimeout(clock);
		if (running)
			return;
		running=true;
		current=next;
		next=(next+1)%linkList.length;
		if (target!==null)
			next=target;
		target=null;
		link.parentNode.insertBefore(linkList[current],link);
		linkList[current].style.position="relative";
		linkList[next].style.position="absolute";
		linkList[next].style.display="";
		btnList[current].className="";
		btnList[next].className="pic_current";
		function transComplete(){
			linkList[current].style.display="none";
			linkList[current].style.filter="";
			running=false;
			clock=setTimeout(function(){
				goAd(null);
			},target===null?interval:200);
		}
		if (isIE){
			picContainer.filters[0].apply();
			linkList[current].style.display="none";
			picContainer.filters[0].play();
			transComplete();
		}else{
			var alpha=100;
			var iClock=setInterval(function(){
				alpha=Math.max(alpha-step,0);
				linkList[current].style.opacity=alpha/100;
				linkList[current].style.filter="progid:DXImageTransform.Microsoft.Alpha(opacity="+alpha+")";
				if (!alpha){
					clearInterval(iClock);
					linkList[current].style.opacity=100;

					transComplete();
				}
			},20);
		}
	}
	clock=setTimeout(function(){
		goAd(null);
	},interval);
};
</script>
</body>
</html>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!