上下切换连续滚动的文字示例源码

基本信息

源码名称：上下切换连续滚动的文字示例源码

源码大小：1.60KB

文件格式：.rar

开发语言：Java

更新时间：2017-11-08

友情提示：（无需注册或充值，赞助后即可获取资源下载链接）

嘿，亲！知识可是无价之宝呢，但咱这精心整理的资料也耗费了不少心血呀。小小地破费一下，绝对物超所值哦！如有下载和支付问题，请联系我们QQ(微信同号)：813200300

本次赞助数额为： 2 元　

源码介绍

<!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>
</head>
<style>
*{padding: 0px;margin: 0px;} 
#text_marquee{
    overflow:hidden;
	height:25px;
	font-family: "微软雅黑";
	font-size: 13px;
	font-weight: bold;
	line-height: 30px;
	color: #4F6AA5;
	text-align: center;
	white-space: nowrap;
}
</style>
<body>

<script language="JavaScript" type="text/javascript"> 
var $ = function (d){
    typeof d == "string" &&(d = document.getElementById(d)); 
    return $.fn.call(d);
};
$.fn = function (){        
        this.addEvent = function (sEventType,fnHandler){
                if (this.addEventListener) {this.addEventListener(sEventType, fnHandler, false);} 
            else if (this.attachEvent) {this.attachEvent("on"   sEventType, fnHandler);} 
            else {this["on"   sEventType] = fnHandler;}
        }
        this.removeEvent = function (sEventType,fnHandler){
                if (this.removeEventListener) {this.removeEventListener(sEventType, fnHandler, false);} 
            else if (this.detachEvent) {this.detachEvent("on"   sEventType, fnHandler);} 
            else { this["on"   sEventType] = null;}
        }
        return this;
};
var Class = {create: function() {return function() { this.initialize.apply(this, arguments); }}};
var Bind = function (obj,fun,arr){return function() {return fun.apply(obj,arr);}}
var Marquee = Class.create();
Marquee.prototype = {
  initialize: function(id,name,out,speed) {
    this.name = name;
        this.box = $(id);
        this.out  = 4;//滚动间隔时间,单位秒
        this.speed = speed;
        this.d = 1;
        this.box.style.position = "relative";
        this.box.scrollTop = 0;
        var _li = this.box.firstChild;
        while(typeof(_li.tagName)=="undefined")_li = _li.nextSibling;
        this.lis = this.box.getElementsByTagName(_li.tagName);
        this.len = this.lis.length;        
        for(var i=0;i<this.lis.length;i  ){
            var __li = document.createElement(_li.tagName);
                __li.innerHTML = this.lis[i].innerHTML;
                this.box.appendChild(__li);//cloneNode
                if(this.lis[i].offsetTop>=this.box.offsetHeight)break;
        }
        this.Start();
        this.box.addEvent("mouseover",Bind(this,function(){clearTimeout(this.timeout);},[]));
        this.box.addEvent("mouseout",Bind(this,this.Start,[]));
  },
  Start:function (){
          clearTimeout(this.timeout);
          this.timeout = setTimeout(this.name ".Up()",this.out*1000)
  },
  Up:function(){
          clearInterval(this.interval);
          this.interval = setInterval(this.name ".Fun()",30);
  },
  Fun:function (){
      this.box.scrollTop =this.speed;
          if(this.lis[this.d].offsetTop <= this.box.scrollTop){
            clearInterval(this.interval);
                this.box.scrollTop = this.lis[this.d].offsetTop;
                this.Start();
                this.d  ;
          }
          if(this.d >= this.len   1){
             this.d = 1;
             this.box.scrollTop = 0;
          }
  }
};
$(window).addEvent("load",function (){
marquee = new Marquee("text_marquee","marquee",1,2);
});
</script>
<div id="text_marquee">
  <p>致力于用软件和网络技术改造汽车维修传统产业的面貌</p>
  <p>竭诚为院校教育和紧缺人才培养培训工程推波助澜</p>
  <p>始终站在汽车电控故障诊断维修技术的最前沿</p>
</div>
</body>
</html>