24
2016
11

网页幻灯片滚动代码,公告滚动代码

很多做网站优化的朋友网页修改静态页面,没办法实现网站幻灯片轮回效果,或是没办法实现公告轮播效果,这里为只懂css代码但是又不懂js代码的朋友提供整套幻灯片js轮播代码,和首页公告代码轮播!

<style>
#vcoo_anno{background:url("http://www.c2bseo.com/zb_users/theme/metro/style/images/gonggao.gif") no-repeat left top; height:28px; line-height:28px; overflow: hidden; border: 1px #dddddd dashed; margin-left:5px; padding-left: 30px; margin-bottom: 10px;}
</style>
 
<div id="vcoo_anno">
<div id="vcoo_announce">
<a href="http://www.c2bseo.com/zb_users/theme/metro/style/images/gonggao.gif" target="_blank"><font color="red">荣帅seo博客!点击获取公告图标</font></a><br />
</div>
</div>
 
<script>
//===============================================
// 目的:网站公告声明VC_Announce效果为:滚动一行停顿4秒,再滚动下一行
//===============================================
function ann_marquee(lh,speed,delay) { 
 //lh为行高lineheight,speed为滚动速度,delay为延迟、停顿的时间
 var p=false;
 var t;
 var o=document.getElementById("vcoo_announce");
 o.innerHTML+=o.innerHTML;
 o.style.marginTop=0;
 o.onmouseover=function(){p=true;} 
 o.onmouseout=function(){p=false;} 
 
 function start(){ 
  t=setInterval(scrolling,speed);
  if(!p) o.style.marginTop=parseInt(o.style.marginTop)-1+"px";
 } 
 
 function scrolling(){ 
  if(parseInt(o.style.marginTop)%lh!=0){ 
  o.style.marginTop=parseInt(o.style.marginTop)-1+"px";
  if(Math.abs(parseInt(o.style.marginTop))>=o.scrollHeight/2) o.style.marginTop=0;
  }else{ 
  clearInterval(t);
  setTimeout(start,delay);
  } 
 } 
 setTimeout(start,delay);
} 
ann_marquee(28,10,4000);
</script>


发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

« 上一篇: zblog如何自定义伪静态,服务器伪静态规则有哪几种方式? 下一篇 »Z-Blog模板类文件说明
关闭广告
关闭广告

分享:

支付宝

微信