从接触JS在现在才短短的三个月,不过感觉兴趣就是最好的师傅,这句话是不变的经典.
之前写JS完全是使用流程编程方法,就是一个脚本从头跑到尾,达到目的就够了.
不过在学习了.NET之后,C#语法让我走向了程序的设计的更高一层,终于让我明白了程序的复用性,和可二次开发性的重要,于是在这里要感谢2个同志,一个是一直支持我学习程序设计的张天鸣,还有一位就是超级牛人,一直以来虽然教我不是很多,却逼着我向更高境界前进的--王闻宇.这次将JS控件化是他对我提出的要求,在不懈努力之后,终于结合C#控件开发技巧,将JS控件化了,这一点,对只会写JS脚本的朋友来说,是帮助你向前迈进一大步的方法.
言归正传,所谓Javascript面向对象编程,其实就是将JS控件化,实现自定义函数,并且让该函数拥有自己的方法,对象,名称,属性等等,和正常的JS命令同等使用,再说的简单一点,就是实现扩张JS命令,加入你想要的功能.
比如window.open,就是在window对象拥有open属性,然后调用这个属性的方法,实现打开一个新窗口,这是一个简单的JS内建命令,而我就是要做到自己定义这个内建命令,去扩展JS的功能.
今天先给出我写的一些控件化的JS,以后再详细做解释,相信会JS的朋友应该一看就懂的.
简单解释一下:
首先建立一个函数名称,然后在这个名称里面再建立一个数组,然后向这个数组添加你想要的属性,最后定义这个函数的内建方法,于是以后你只需要new一个这个函数名,然后就可以使用这个函数的方法.
全部例子通过IE,FIREFOX.
实例一:网页两边的缓冲速度广告
程序代码
<!--
//
// 带缓冲页面耳朵广告 //
//第 6 行更改速度 第 52 行开始加入自定义内容 //
// 2006.02.09 V1.00 By Clear for PPLive.com //
//
var delta=0.15;//调整跟随速度，数值越大速度越慢（默认值:0.15）
var collection;
function floaters(){
this.items = [];
this.addItem = function(id,x,y,width,height,content){
document.write("<div id="+id+" style=\"z-index: 10; position: absolute; width:"+width+"px; height:"+height+"px;left:"+(typeof(x)=="string"?eval(x):x)+"px; top:"+(typeof(y)=="string"?eval(y):y)+"px\">"+content+"</div>");
var newItem = {};
newItem.object = document.getElementById(id);
newItem.x = x;
newItem.y = y;
this.items[this.items.length] = newItem;
}
this.play = function(act){
collection = this.items
if(act!=1){
setInterval("play()",10);
}else{
myClose()
}
}
}
function play(){
for(var i=0;i<collection.length;i++){
var followObj = collection[i].object;
var followObj_x = (typeof(collection[i].x)=="string"?eval(collection[i].x):collection[i].x);
var followObj_y = (typeof(collection[i].y)=="string"?eval(collection[i].y):collection[i].y);
if(followObj.offsetLeft!=(document.documentElement.scrollLeft+followObj_x)){
var dx=(document.documentElement.scrollLeft+followObj_x-followObj.offsetLeft)*delta;
dx=(dx>0?1:-1)*Math.ceil(Math.abs(dx));
followObj.style.left=followObj.offsetLeft+dx+"px";
}
if(followObj.offsetTop!=(document.documentElement.scrollTop+followObj_y)){
var dy=(document.documentElement.scrollTop+followObj_y-followObj.offsetTop)*delta;
dy=(dy>0?1:-1)*Math.ceil(Math.abs(dy));
followObj.style.top=followObj.offsetTop+dy+"px";
}
followObj.style.display = "";
}
}
function myClose(){
for(var i=0;i<collection.length;i++){
var followObj = collection[i].object;
followObj.style.display = "none"
}
collection=""
}
var theFloaters = new floaters();
theFloaters.addItem("followDiv1","document.documentElement.clientWidth-80",0,80,60,"<a href=\"javascript:theFloaters.play(1);\">关闭</a><iframe frameborder=\"0\" width=\"80\" height=\"600\" scrolling=\"no\" src=\"from.html\"></iframe>")
theFloaters.addItem("followDiv2",0,0,80,60,"<iframe frameborder=\"0\" width=\"80\" height=\"600\" scrolling=\"no\" src=\"from.html\"></iframe>")
//使用方法：
//要定义几个广告就复制下面组件几个，ID不可重复：
//theFloaters.addItem(id,x,y,width,height,content)
//id 定义耳朵ID号，不可重复
//x 定义广告在浏览器的左右
// 假如：当耳朵在浏览器左边时x=0
// 假如：要定义耳朵在右边x=document.documentElement.clientWidth-广告宽度
//y 定义广告在浏览器的上下
// 假如：当耳朵在浏览器上边时y=0
// 假如：要定义耳朵在下边y=document.documentElement.clientHeight-广告高度
//width 定义广告宽度
//height 定义广告高度
//content 定义广告内容
// 可以镶嵌任何HTML代码
//关闭耳朵广告使用theFloaters.play(1)
theFloaters.play();
//-->
实例二:大幅一次性图片
程序代码
<!--
//
// 大幅一次性图片 //
//（请将JS嵌入<body>下面，即页面最顶层） //
// 第 40 行开始加入自定义内容 //
//2006.02.09 V1.00 By Clear for PPLive.com //
//
function imgBigmap(boolFull,strImg,strURL,intTime,adURL,intWidth,intHeight,strBak){
if(boolFull == "y"){
intWidth=document.documentElement.clientWidth
intHeight=document.documentElement.clientHeight
if(strImg == "flash"){
document.write("<object id=\"map\" classid=\"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\" codebase=\"http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0\" width=\""+intWidth+"\" height=\""+intHeight+"\">")
document.write("<param name=\"movie\" value=\""+strURL+"\" />")
document.write("<param name=\"quality\" value=\"high\" />")
document.write("<embed src=\""+strURL+"\" quality=\"high\" pluginspage=\"http://www.macromedia.com/go/getflashplayer\" type=\"application/x-shockwave-flash\" width=\""+intWidth+"\" height=\""+intHeight+"\"></embed>")
document.write("</object>")
}else{
document.write("<img id=\"map\" οnclick=\"window.open('"+adURL+"')\" src=\""+strURL+"\" width=\""+intWidth+"\" height=\""+intHeight+"\" alt=\""+strBak+"\" border=\"0\" />")
}
}else{
if(strImg == "flash"){
document.write("<div id=\"map\" style=\"width:"+intWidth+"px; height:"+intHeight+"; margin-left:auto; margin-right:auto\">")
document.write("<object classid=\"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\" codebase=\"http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0\" width=\""+intWidth+"\" height=\""+intHeight+"\">")
document.write("<param name=\"movie\" value=\""+strURL+"\" />")
document.write("<param name=\"quality\" value=\"high\" />")
document.write("<embed src=\""+strURL+"\" quality=\"high\" pluginspage=\"http://www.macromedia.com/go/getflashplayer\" type=\"application/x-shockwave-flash\" width=\""+intWidth+"\" height=\""+intHeight+"\"></embed>")
document.write("</object>")
document.write("</div>")
}else{
document.write("<div id=\"map\" style=\"width:"+intWidth+"px; height:"+intHeight+"; margin-left:auto; margin-right:auto\">")
document.write("<img src=\""+strURL+"\" οnclick=\"window.open('"+adURL+"')\" width=\""+intWidth+"\" height=\""+intHeight+"\" alt=\""+strBak+"\" border=\"0\" />")
document.write("</div>")
}
}
setTimeout("imgClose()",intTime)
}
function imgClose(){
document.getElementById("map").style.display = "none"
}
imgBigmap("n","img","FD231.JPG",5000,"http://www.pplive.com",772,600,"图片调用出错");
//使用方法：
//imgBigmap(boolFull,strImg,strURL,intTime,adURL,intWidth,intHeight,strBak)
//
//boolFull 定义是否全屏显示
// 全屏显示:"y"(选择全屏后不用设置intWidth,intHeight)
// 不全屏:"n"
//strImg 定义广告类型
// 定义为Flash动画时："flash"
// 定义为图片时："img"
//strURL 定义文件路径:
// 绝对路径"http://www.pplive.com/img.jpg"
// 相对路径"dd_38.swf"
//intTime 定义广告显示时间，单位：毫秒
//adURL 设置为图片时定义广告指向链接"http://www.pplive.com"
//intWidth 定义广告宽度
//intHeight 定义广告高度
//strBak 当定义广告类型为图片时，图片调用出错处理
// 加入调用出错提示："图片调用出错"
//-->
实例三:大幅一次性图片
程序代码
<!--
//
// 闪烁图片 //
//第 7，8，9 行更改总体设置 第 65 行开始加入自定义内容 //
//将JS嵌入到显示的固定位置 //
//2006.02.10 V1.00 By Clear for PPLive.com //
//
var intSTime = 4000;//定义图片轮换时间
var intSWidth = 240;//定义图片宽度，单位：像素
var intSHeight = 180;//定义图片高度，单位：像素
var collectSAd;
var adNum = 0
function slectImg(){
this.items = [];
this.addItem = function(adURL,strURL,strBak,intChMode,intTarget){
var newItem = {};
newItem.adURL = adURL;
newItem.strURL = strURL;
newItem.strBak = strBak;
newItem.intChMode = intChMode;
newItem.intTarget = intTarget;
this.items[this.items.length] = newItem;
}
this.play = function(){
collectSAd = this.items
strHtml()
nextAd()
}
}
function setTransition(){
if (document.all){
if(collectSAd[adNum].intChMode == ""){
bannerADrotator.filters.revealTrans.Transition=Math.floor(Math.random()*23);
}else{
bannerADrotator.filters.revealTrans.Transition=collectSAd[adNum].intChMode;
}
bannerADrotator.filters.revealTrans.apply();
}
}
function playTransition(){
if (document.all)
bannerADrotator.filters.revealTrans.play()
}
function nextAd(){
adNum<collectSAd.length-1?adNum++:adNum=0;
setTransition();
document.images.bannerADrotator.src=collectSAd[adNum].adURL;
playTransition();
document.images.bannerADrotator.alt=collectSAd[adNum].strBak;
theTimer=setTimeout("nextAd()", intSTime);
}
function jump2url(){
jumpUrl=collectSAd[adNum].strURL;
if (jumpUrl != ''){
if(collectSAd[adNum].intTarget != "")window.open(jumpUrl,collectSAd[adNum].intTarget);
else location.href=jumpUrl;
}
}
function displayStatusMsg() {
status=collectSAd[adNum].strURL;
document.returnValue = true;
}
function strHtml(){
document.write("<a οnmοuseοver=\"displayStatusMsg();return document.returnValue\" href=\"javascript:jump2url()\"><img src=\"javascript:nextAd()\" name=\"bannerADrotator\" width=\""+intSWidth+"\" height=\""+intSHeight+"\" border=\"0\" style=\"filter: revealTrans(duration=2,transition=20)\"></a>")
}
var theSlectImg = new slectImg();
theSlectImg.addItem("ad/gaofei.jpg","http://www.plive.com","图片1","","")
theSlectImg.addItem("ad/chaonv.jpg","http://www.163.com","图片2","","")
theSlectImg.addItem("ad/ige2.jpg","http://www.cnrui.cn","图片3","","")
theSlectImg.play()
//使用方法：
//首先修改7，8，9行总体设置
//然后重复调用控件：
//theSlectImg.addItem(adURL,strURL,strBak,intChMode,intTarget)
//adURL 定义图片路径
//strURL 定义图片链接
//strBak 定义图片出错时的备用提示
//intChMode 定义图片更换方式，范围为0-23,(详细效果查询CSS指南)，为空时显示随机效果
//intTarget 定义广告弹出方式，为空时在本页显示，可选参数"_blank","_self","_top","_parent"
//-->
实例四:无逢滚动
程序代码
<!--
//
// 无逢滚动 //
//第 8，9，10，11 行更改总体设置 //
//第 87 行开始加入自定义内容 //
//将JS嵌入到显示的固定位置 //
// 2006.02.10 V1.00 By Clear for PPLive.com //
//
var speed = 10; //定义滚动速度，数字越大速度越慢
var intAWidth = 200;//定义滚动区域宽度，单位：像素
var intAHeight = 30;//定义滚动区域高度，单位：像素
var direction = "left";//定义滚动方向，上："top"|下："down"|左："left"|右："right"
var collectScroll;
var tab;
var tab1;
var tab2;
var MyMar;
function autoScroll(){
this.items = [];
this.addItem = function(adURL,strURL,strBak,intTarget){
var newItem = {};
newItem.adURL = adURL;
newItem.strURL = strURL;
newItem.strBak = strBak;
newItem.intTarget = intTarget;
this.items[this.items.length] = newItem;
}
this.play = function(){
collectScroll = this.items
scrollHtml()
tab=document.getElementById("demo");
tab1=document.getElementById("demo1");
tab2=document.getElementById("demo2");
tab2.innerHTML=tab1.innerHTML;
MyMar=setInterval(Marquee,speed);
}
}
function scrollHtml(){
var imgHtml = ""
for(var i=0;i<collectScroll.length;i++){
var a = collectScroll[i]
imgHtml += "<a href=\""+a.strURL+"\" target=\""+a.intTarget+"\"><img src=\""+a.adURL+"\" alt=\""+a.strBak+"\" border=\"0\" /></a>"
}
var b,c,d
if(direction == "left" || direction == "right"){
b = "<div id=\"indemo\" style=\"float: left;width: 800%\">"
c = " style=\"float: left\""
d = "</div>"
}else{
b = ""
c = ""
d = ""
}
document.writeln("<div id=\"demo\" οnmοuseοver=\"clearInterval(MyMar)\" οnmοuseοut=\"MyMar=setInterval(Marquee,speed)\" style=\"overflow:hidden; width:"+intAWidth+"px;height:"+intAHeight+"px\">")
document.writeln(b+"<div id=\"demo1\""+c+">")
document.writeln(imgHtml)
document.writeln("</div><div id=\"demo2\""+c+">"+d+"</div></div>")
}
function Marquee(){
if(direction == "top"){
if(tab2.offsetTop-tab.scrollTop<=0){
tab.scrollTop-=tab1.offsetHeight
}else{
tab.scrollTop++
}
}else if(direction == "down"){
if(tab1.offsetTop-tab.scrollTop>=0)
tab.scrollTop+=tab2.offsetHeight
else{
tab.scrollTop--
}
}else if(direction == "left"){
if(tab2.offsetWidth-tab.scrollLeft<=0)
tab.scrollLeft-=tab1.offsetWidth
else{
tab.scrollLeft++;
}
}else if(direction == "right"){
if(tab.scrollLeft<=0)
tab.scrollLeft+=tab2.offsetWidth
else{
tab.scrollLeft--
}
}
}
var theAutoScroll= new autoScroll();
theAutoScroll.addItem("http://www.cnrui.cn/other/link/Clear_logo.gif","http://www.plive.com","图片1","_blank")
theAutoScroll.addItem("http://www.cnrui.cn/other/link/Clear_logo.gif","http://www.163.com","图片2","_blank")
theAutoScroll.addItem("http://www.cnrui.cn/other/link/Clear_logo.gif","http://www.cnrui.cn","图片3","_blank")
theAutoScroll.addItem("http://www.cnrui.cn/other/link/Clear_logo.gif","http://www.cnrui.cn","图片4","_blank")
theAutoScroll.addItem("http://www.cnrui.cn/other/link/Clear_logo.gif","http://www.cnrui.cn","图片5","_blank")
theAutoScroll.play()
//使用方法：
//首先修改8，9，10，11行总体设置
//然后重复调用控件：
//theAutoScroll.addItem(adURL,strURL,strBak,intTarget)
//adURL 定义图片路径
//strURL 定义图片链接
//strBak 定义图片出错时的备用提示
//intTarget 定义广告弹出方式，可选参数"_blank","_self","_top","_parent"
//-->
之前写JS完全是使用流程编程方法,就是一个脚本从头跑到尾,达到目的就够了.
不过在学习了.NET之后,C#语法让我走向了程序的设计的更高一层,终于让我明白了程序的复用性,和可二次开发性的重要,于是在这里要感谢2个同志,一个是一直支持我学习程序设计的张天鸣,还有一位就是超级牛人,一直以来虽然教我不是很多,却逼着我向更高境界前进的--王闻宇.这次将JS控件化是他对我提出的要求,在不懈努力之后,终于结合C#控件开发技巧,将JS控件化了,这一点,对只会写JS脚本的朋友来说,是帮助你向前迈进一大步的方法.
言归正传,所谓Javascript面向对象编程,其实就是将JS控件化,实现自定义函数,并且让该函数拥有自己的方法,对象,名称,属性等等,和正常的JS命令同等使用,再说的简单一点,就是实现扩张JS命令,加入你想要的功能.
比如window.open,就是在window对象拥有open属性,然后调用这个属性的方法,实现打开一个新窗口,这是一个简单的JS内建命令,而我就是要做到自己定义这个内建命令,去扩展JS的功能.
今天先给出我写的一些控件化的JS,以后再详细做解释,相信会JS的朋友应该一看就懂的.
简单解释一下:
首先建立一个函数名称,然后在这个名称里面再建立一个数组,然后向这个数组添加你想要的属性,最后定义这个函数的内建方法,于是以后你只需要new一个这个函数名,然后就可以使用这个函数的方法.
全部例子通过IE,FIREFOX.
实例一:网页两边的缓冲速度广告
程序代码
<!--
//
// 带缓冲页面耳朵广告 //
//第 6 行更改速度 第 52 行开始加入自定义内容 //
// 2006.02.09 V1.00 By Clear for PPLive.com //
//
var delta=0.15;//调整跟随速度，数值越大速度越慢（默认值:0.15）
var collection;
function floaters(){
this.items = [];
this.addItem = function(id,x,y,width,height,content){
document.write("<div id="+id+" style=\"z-index: 10; position: absolute; width:"+width+"px; height:"+height+"px;left:"+(typeof(x)=="string"?eval(x):x)+"px; top:"+(typeof(y)=="string"?eval(y):y)+"px\">"+content+"</div>");
var newItem = {};
newItem.object = document.getElementById(id);
newItem.x = x;
newItem.y = y;
this.items[this.items.length] = newItem;
}
this.play = function(act){
collection = this.items
if(act!=1){
setInterval("play()",10);
}else{
myClose()
}
}
}
function play(){
for(var i=0;i<collection.length;i++){
var followObj = collection[i].object;
var followObj_x = (typeof(collection[i].x)=="string"?eval(collection[i].x):collection[i].x);
var followObj_y = (typeof(collection[i].y)=="string"?eval(collection[i].y):collection[i].y);
if(followObj.offsetLeft!=(document.documentElement.scrollLeft+followObj_x)){
var dx=(document.documentElement.scrollLeft+followObj_x-followObj.offsetLeft)*delta;
dx=(dx>0?1:-1)*Math.ceil(Math.abs(dx));
followObj.style.left=followObj.offsetLeft+dx+"px";
}
if(followObj.offsetTop!=(document.documentElement.scrollTop+followObj_y)){
var dy=(document.documentElement.scrollTop+followObj_y-followObj.offsetTop)*delta;
dy=(dy>0?1:-1)*Math.ceil(Math.abs(dy));
followObj.style.top=followObj.offsetTop+dy+"px";
}
followObj.style.display = "";
}
}
function myClose(){
for(var i=0;i<collection.length;i++){
var followObj = collection[i].object;
followObj.style.display = "none"
}
collection=""
}
var theFloaters = new floaters();
theFloaters.addItem("followDiv1","document.documentElement.clientWidth-80",0,80,60,"<a href=\"javascript:theFloaters.play(1);\">关闭</a><iframe frameborder=\"0\" width=\"80\" height=\"600\" scrolling=\"no\" src=\"from.html\"></iframe>")
theFloaters.addItem("followDiv2",0,0,80,60,"<iframe frameborder=\"0\" width=\"80\" height=\"600\" scrolling=\"no\" src=\"from.html\"></iframe>")
//使用方法：
//要定义几个广告就复制下面组件几个，ID不可重复：
//theFloaters.addItem(id,x,y,width,height,content)
//id 定义耳朵ID号，不可重复
//x 定义广告在浏览器的左右
// 假如：当耳朵在浏览器左边时x=0
// 假如：要定义耳朵在右边x=document.documentElement.clientWidth-广告宽度
//y 定义广告在浏览器的上下
// 假如：当耳朵在浏览器上边时y=0
// 假如：要定义耳朵在下边y=document.documentElement.clientHeight-广告高度
//width 定义广告宽度
//height 定义广告高度
//content 定义广告内容
// 可以镶嵌任何HTML代码
//关闭耳朵广告使用theFloaters.play(1)
theFloaters.play();
//-->
实例二:大幅一次性图片
程序代码
<!--
//
// 大幅一次性图片 //
//（请将JS嵌入<body>下面，即页面最顶层） //
// 第 40 行开始加入自定义内容 //
//2006.02.09 V1.00 By Clear for PPLive.com //
//
function imgBigmap(boolFull,strImg,strURL,intTime,adURL,intWidth,intHeight,strBak){
if(boolFull == "y"){
intWidth=document.documentElement.clientWidth
intHeight=document.documentElement.clientHeight
if(strImg == "flash"){
document.write("<object id=\"map\" classid=\"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\" codebase=\"http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0\" width=\""+intWidth+"\" height=\""+intHeight+"\">")
document.write("<param name=\"movie\" value=\""+strURL+"\" />")
document.write("<param name=\"quality\" value=\"high\" />")
document.write("<embed src=\""+strURL+"\" quality=\"high\" pluginspage=\"http://www.macromedia.com/go/getflashplayer\" type=\"application/x-shockwave-flash\" width=\""+intWidth+"\" height=\""+intHeight+"\"></embed>")
document.write("</object>")
}else{
document.write("<img id=\"map\" οnclick=\"window.open('"+adURL+"')\" src=\""+strURL+"\" width=\""+intWidth+"\" height=\""+intHeight+"\" alt=\""+strBak+"\" border=\"0\" />")
}
}else{
if(strImg == "flash"){
document.write("<div id=\"map\" style=\"width:"+intWidth+"px; height:"+intHeight+"; margin-left:auto; margin-right:auto\">")
document.write("<object classid=\"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\" codebase=\"http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0\" width=\""+intWidth+"\" height=\""+intHeight+"\">")
document.write("<param name=\"movie\" value=\""+strURL+"\" />")
document.write("<param name=\"quality\" value=\"high\" />")
document.write("<embed src=\""+strURL+"\" quality=\"high\" pluginspage=\"http://www.macromedia.com/go/getflashplayer\" type=\"application/x-shockwave-flash\" width=\""+intWidth+"\" height=\""+intHeight+"\"></embed>")
document.write("</object>")
document.write("</div>")
}else{
document.write("<div id=\"map\" style=\"width:"+intWidth+"px; height:"+intHeight+"; margin-left:auto; margin-right:auto\">")
document.write("<img src=\""+strURL+"\" οnclick=\"window.open('"+adURL+"')\" width=\""+intWidth+"\" height=\""+intHeight+"\" alt=\""+strBak+"\" border=\"0\" />")
document.write("</div>")
}
}
setTimeout("imgClose()",intTime)
}
function imgClose(){
document.getElementById("map").style.display = "none"
}
imgBigmap("n","img","FD231.JPG",5000,"http://www.pplive.com",772,600,"图片调用出错");
//使用方法：
//imgBigmap(boolFull,strImg,strURL,intTime,adURL,intWidth,intHeight,strBak)
//
//boolFull 定义是否全屏显示
// 全屏显示:"y"(选择全屏后不用设置intWidth,intHeight)
// 不全屏:"n"
//strImg 定义广告类型
// 定义为Flash动画时："flash"
// 定义为图片时："img"
//strURL 定义文件路径:
// 绝对路径"http://www.pplive.com/img.jpg"
// 相对路径"dd_38.swf"
//intTime 定义广告显示时间，单位：毫秒
//adURL 设置为图片时定义广告指向链接"http://www.pplive.com"
//intWidth 定义广告宽度
//intHeight 定义广告高度
//strBak 当定义广告类型为图片时，图片调用出错处理
// 加入调用出错提示："图片调用出错"
//-->
实例三:大幅一次性图片
程序代码
<!--
//
// 闪烁图片 //
//第 7，8，9 行更改总体设置 第 65 行开始加入自定义内容 //
//将JS嵌入到显示的固定位置 //
//2006.02.10 V1.00 By Clear for PPLive.com //
//
var intSTime = 4000;//定义图片轮换时间
var intSWidth = 240;//定义图片宽度，单位：像素
var intSHeight = 180;//定义图片高度，单位：像素
var collectSAd;
var adNum = 0
function slectImg(){
this.items = [];
this.addItem = function(adURL,strURL,strBak,intChMode,intTarget){
var newItem = {};
newItem.adURL = adURL;
newItem.strURL = strURL;
newItem.strBak = strBak;
newItem.intChMode = intChMode;
newItem.intTarget = intTarget;
this.items[this.items.length] = newItem;
}
this.play = function(){
collectSAd = this.items
strHtml()
nextAd()
}
}
function setTransition(){
if (document.all){
if(collectSAd[adNum].intChMode == ""){
bannerADrotator.filters.revealTrans.Transition=Math.floor(Math.random()*23);
}else{
bannerADrotator.filters.revealTrans.Transition=collectSAd[adNum].intChMode;
}
bannerADrotator.filters.revealTrans.apply();
}
}
function playTransition(){
if (document.all)
bannerADrotator.filters.revealTrans.play()
}
function nextAd(){
adNum<collectSAd.length-1?adNum++:adNum=0;
setTransition();
document.images.bannerADrotator.src=collectSAd[adNum].adURL;
playTransition();
document.images.bannerADrotator.alt=collectSAd[adNum].strBak;
theTimer=setTimeout("nextAd()", intSTime);
}
function jump2url(){
jumpUrl=collectSAd[adNum].strURL;
if (jumpUrl != ''){
if(collectSAd[adNum].intTarget != "")window.open(jumpUrl,collectSAd[adNum].intTarget);
else location.href=jumpUrl;
}
}
function displayStatusMsg() {
status=collectSAd[adNum].strURL;
document.returnValue = true;
}
function strHtml(){
document.write("<a οnmοuseοver=\"displayStatusMsg();return document.returnValue\" href=\"javascript:jump2url()\"><img src=\"javascript:nextAd()\" name=\"bannerADrotator\" width=\""+intSWidth+"\" height=\""+intSHeight+"\" border=\"0\" style=\"filter: revealTrans(duration=2,transition=20)\"></a>")
}
var theSlectImg = new slectImg();
theSlectImg.addItem("ad/gaofei.jpg","http://www.plive.com","图片1","","")
theSlectImg.addItem("ad/chaonv.jpg","http://www.163.com","图片2","","")
theSlectImg.addItem("ad/ige2.jpg","http://www.cnrui.cn","图片3","","")
theSlectImg.play()
//使用方法：
//首先修改7，8，9行总体设置
//然后重复调用控件：
//theSlectImg.addItem(adURL,strURL,strBak,intChMode,intTarget)
//adURL 定义图片路径
//strURL 定义图片链接
//strBak 定义图片出错时的备用提示
//intChMode 定义图片更换方式，范围为0-23,(详细效果查询CSS指南)，为空时显示随机效果
//intTarget 定义广告弹出方式，为空时在本页显示，可选参数"_blank","_self","_top","_parent"
//-->
实例四:无逢滚动
程序代码
<!--
//
// 无逢滚动 //
//第 8，9，10，11 行更改总体设置 //
//第 87 行开始加入自定义内容 //
//将JS嵌入到显示的固定位置 //
// 2006.02.10 V1.00 By Clear for PPLive.com //
//
var speed = 10; //定义滚动速度，数字越大速度越慢
var intAWidth = 200;//定义滚动区域宽度，单位：像素
var intAHeight = 30;//定义滚动区域高度，单位：像素
var direction = "left";//定义滚动方向，上："top"|下："down"|左："left"|右："right"
var collectScroll;
var tab;
var tab1;
var tab2;
var MyMar;
function autoScroll(){
this.items = [];
this.addItem = function(adURL,strURL,strBak,intTarget){
var newItem = {};
newItem.adURL = adURL;
newItem.strURL = strURL;
newItem.strBak = strBak;
newItem.intTarget = intTarget;
this.items[this.items.length] = newItem;
}
this.play = function(){
collectScroll = this.items
scrollHtml()
tab=document.getElementById("demo");
tab1=document.getElementById("demo1");
tab2=document.getElementById("demo2");
tab2.innerHTML=tab1.innerHTML;
MyMar=setInterval(Marquee,speed);
}
}
function scrollHtml(){
var imgHtml = ""
for(var i=0;i<collectScroll.length;i++){
var a = collectScroll[i]
imgHtml += "<a href=\""+a.strURL+"\" target=\""+a.intTarget+"\"><img src=\""+a.adURL+"\" alt=\""+a.strBak+"\" border=\"0\" /></a>"
}
var b,c,d
if(direction == "left" || direction == "right"){
b = "<div id=\"indemo\" style=\"float: left;width: 800%\">"
c = " style=\"float: left\""
d = "</div>"
}else{
b = ""
c = ""
d = ""
}
document.writeln("<div id=\"demo\" οnmοuseοver=\"clearInterval(MyMar)\" οnmοuseοut=\"MyMar=setInterval(Marquee,speed)\" style=\"overflow:hidden; width:"+intAWidth+"px;height:"+intAHeight+"px\">")
document.writeln(b+"<div id=\"demo1\""+c+">")
document.writeln(imgHtml)
document.writeln("</div><div id=\"demo2\""+c+">"+d+"</div></div>")
}
function Marquee(){
if(direction == "top"){
if(tab2.offsetTop-tab.scrollTop<=0){
tab.scrollTop-=tab1.offsetHeight
}else{
tab.scrollTop++
}
}else if(direction == "down"){
if(tab1.offsetTop-tab.scrollTop>=0)
tab.scrollTop+=tab2.offsetHeight
else{
tab.scrollTop--
}
}else if(direction == "left"){
if(tab2.offsetWidth-tab.scrollLeft<=0)
tab.scrollLeft-=tab1.offsetWidth
else{
tab.scrollLeft++;
}
}else if(direction == "right"){
if(tab.scrollLeft<=0)
tab.scrollLeft+=tab2.offsetWidth
else{
tab.scrollLeft--
}
}
}
var theAutoScroll= new autoScroll();
theAutoScroll.addItem("http://www.cnrui.cn/other/link/Clear_logo.gif","http://www.plive.com","图片1","_blank")
theAutoScroll.addItem("http://www.cnrui.cn/other/link/Clear_logo.gif","http://www.163.com","图片2","_blank")
theAutoScroll.addItem("http://www.cnrui.cn/other/link/Clear_logo.gif","http://www.cnrui.cn","图片3","_blank")
theAutoScroll.addItem("http://www.cnrui.cn/other/link/Clear_logo.gif","http://www.cnrui.cn","图片4","_blank")
theAutoScroll.addItem("http://www.cnrui.cn/other/link/Clear_logo.gif","http://www.cnrui.cn","图片5","_blank")
theAutoScroll.play()
//使用方法：
//首先修改8，9，10，11行总体设置
//然后重复调用控件：
//theAutoScroll.addItem(adURL,strURL,strBak,intTarget)
//adURL 定义图片路径
//strURL 定义图片链接
//strBak 定义图片出错时的备用提示
//intTarget 定义广告弹出方式，可选参数"_blank","_self","_top","_parent"
//-->
746
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
