文字成批滾動(dòng)在指定區(qū)域內(nèi)_文本鏈接特效

成批文字在指定區(qū)域平滑滾動(dòng)，無縫循環(huán)，這應(yīng)該是個(gè)很不錯(cuò)的特效，這樣的滾動(dòng)使結(jié)構(gòu)更清淅，更適合用戶的瀏覽閱讀，使用時(shí)請(qǐng)根據(jù)你的網(wǎng)頁布局修改一下，以滿足你的使用。

<!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" mrc="text/html; charset=gb2312" />
<title>文字成批滾動(dòng)-hl5o.cn </title>
<style type="text/css">

</style>
<script language="javascript">
var $ = function (d){
    typeof d == "string" &&(d = document.getElementById(d)); 
    return $.fn.call(d);
};
$.fn = function (){//附加2個(gè)方法
	this.$ADD = function (fn){CLS.add(this,fn)};
	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  = out;
	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++){//計(jì)算該復(fù)制多少節(jié)點(diǎn)，保證無縫滾動(dòng)，沒必要的就不復(fù)制
	    var __li = document.createElement(_li.tagName);
		__li.innerHTML = this.lis[i].innerHTML;
		this.box.appendChild(__li);
		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()",10);
  },
  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("nli_con","marquee",1,2);//加載完后運(yùn)行代碼，
});
</script>
</head>
<body>
 <div id="nli_con">
 <dl>
   <dt><a href='/' target='_blank'><strong>1. 文字成批滾動(dòng)？</strong></a></dt>
   <dd>這是一個(gè)很不錯(cuò)的效果，文字在指定區(qū)域內(nèi)成批滾動(dòng)...</dd>
 </dl>
 
 <dl>
   <dt><a href='/' target='_blank'><strong>2.你知道模板無憂嗎？ </strong></a></dt>
   <dd>模板無憂 hl5o.cn 提供精品源代碼下載，是一個(gè)是學(xué)習(xí)型為主的源代碼資源站。</dd>
 </dl>
 
 <dl>
   <dt><a href='/' target='_blank'><strong>3. 網(wǎng)頁特效是什么？</strong></a></dt>
   <dd> 網(wǎng)頁特效是一種使用CSS結(jié)合JavaScript技術(shù)而編寫的具有操作和視覺感都很不錯(cuò)的技術(shù)，hl5o.cn/jscss/ 為您提供特效樣本...</dd>
 </dl>
 
 <dl>
   <dt><a href='/' target='_blank'><strong>4. 為什么要建立網(wǎng)站標(biāo)準(zhǔn)？</strong></a></dt>
   <dd>　 我們大部分人都有深刻體驗(yàn)，每當(dāng)主流瀏覽器版本的升級(jí)，我們剛建立的網(wǎng)站就可能變得過時(shí)，我們就需要升級(jí)或者重新建造一遍網(wǎng)站。</dd>
 </dl>
 
 <dl>
   <dt><a href='/' target='_blank'><strong>5. 企業(yè)網(wǎng)站建設(shè)須注意的10大問題</strong></a></dt>
   <dd> 企業(yè)網(wǎng)站已經(jīng)成為一個(gè)企業(yè)互聯(lián)網(wǎng)戰(zhàn)略的基礎(chǔ)，有人說:"10年以后，互聯(lián)網(wǎng)業(yè)將消失。"...</dd>
 </dl>
 
 <dl>
   <dt><a href='/' target='_blank'><strong>6. 2009牛年，我們應(yīng)該怎樣發(fā)展網(wǎng)站？</strong></a></dt>
   <dd>　　選擇定位，根據(jù)你的能力，工作量接受范圍度等，制定一個(gè)框架性的簡單的方案。最好能發(fā)揮自己的專長，自己是否有空余的大量時(shí)間...</dd>
 </dl>
</div>
</body>
</html>

所屬頻道：文本鏈接特效/更新時(shí)間：2012-12-07

[收藏][報(bào)錯(cuò)][返回列表]

相關(guān)文本鏈接特效：

文本鏈接特效Rss訂閱特效代碼搜索

文本鏈接特效推薦

猜你也喜歡看這些

相關(guān)鏈接：
復(fù)制本頁鏈接| 搜索文字成批滾動(dòng)在指定區(qū)域內(nèi)
特效說明：
文本鏈接模板-文字成批滾動(dòng)在指定區(qū)域內(nèi)。

日韩天天综合网_野战两个奶头被亲到高潮_亚洲日韩欧美精品综合_av女人天堂污污污_视频一区**字幕无弹窗_国产亚洲欧美小视频_国内性爱精品在线免费视频_国产一级电影在线播放_日韩欧美内地福利_亚洲一二三不卡片区

文字成批滾動(dòng)在指定區(qū)域內(nèi)_文本鏈接特效

文本鏈接特效Rss訂閱特效代碼搜索

文本鏈接特效推薦

猜你也喜歡看這些