菜单

欧洲杯盘口JavaScript 对联广告、漂浮广告封装类(IE,FF,Opera,Safari,Chrome)

2020年1月27日 - 编程

[Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]

//核心代码
function $(element){
    if(arguments.length>1){
        for(var
i=0,elements=[],length=arguments.length;i<length;i++)
            elements.push($(arguments[i]));
        return elements;
    }
    if(typeof element==”string”)
        return document.getElementById(element);
    else
        return element;
}
Function.prototype.bind=function(object){
    var method=this;
    return function(){
        method.apply(object,arguments);
    }
}
var Class={
    create:function(){
        return function(){
            this.initialize.apply(this,arguments);
        }
    }
}
Object.extend=function(destination,resource){
    for(var property in resource){
        destination[property]=resource[property];   
    }
    return destination;
}
//对联广告类
var float_ad=Class.create();
float_ad.prototype={
    initialize:function(id,content,top,left,width){
        document.write(‘<div id=’+id+’
style=”position:absolute;”>’+content+'</div>’);
        this.id=$(id);
        this.top=top;
        if(!!left){
            this.id.style.left=”8px”;   
        }else{
           
this.id.style.left=(document.documentElement.clientWidth-width-8)+”px”;
            window.onresize=function(){
               
this.id.style.left=(document.documentElement.clientWidth-width-8)+”px”;
            }.bind(this);
        }
        this.id.style.top=top+”px”;
       
        this.interId=setInterval(this.scroll.bind(this),20);
    },
    scroll:function(){
        this.stmnStartPoint = parseInt(this.id.style.top, 10);
        this.stmnEndPoint =document.documentElement.scrollTop+
this.top;
        if(navigator.userAgent.indexOf(“Chrome”)>0){
            this.stmnEndPoint=document.body.scrollTop+this.top;   
        }
        if ( this.stmnStartPoint != this.stmnEndPoint ) {
                this.stmnScrollAmount = Math.ceil( Math.abs(
this.stmnEndPoint – this.stmnStartPoint ) / 15 );
                this.id.style.top = parseInt(this.id.style.top, 10) + (
( this.stmnEndPoint<this.stmnStartPoint ) ? -this.stmnScrollAmount :
this.stmnScrollAmount )+”px”;
        }
    }
}
//漂浮广告类
var move_ad=Class.create();
move_ad.prototype={
    initialize:function(imgOption,initPosition,delay){
       
this.imgOptions=Object.extend({url:””,link:””,alt:””,width:120,height:120},imgOption||{});
       
this.adPosition=Object.extend({left:40,top:120},initPosition||{});
        this.delay =delay;
        this.step = 1;
        this.herizonFlag=true;
        this.verticleFlag=true;
        this.id=”ad_move_sg”;
        var vHtmlString=”<div id='”+this.id+”‘
style=’position:absolute; left:”+this.adPosition.left+”px;
top:”+this.adPosition.top+”px; width:”+this.imgOptions.width+”px;”;
        vHtmlString+=” height:”+this.imgOptions.height+”px;
z-index:10;’><a href='”+this.imgOptions.link+”‘ target=’_blank’
title='”+this.imgOptions.alt+”‘><img src='”+this.imgOptions.url+”‘
width='”+this.imgOptions.width+”‘ height='”+this.imgOptions.height+”‘
style=’border:none;’ alt='”+this.imgOptions.alt+”‘
/></a></div>”;
        document.write(vHtmlString);
        this.id=$(this.id);
       
this.intervalId=setInterval(this.scroll.bind(this),this.delay);
        this.id.onmouseover=this.stop.bind(this);
        this.id.onmouseout=this.start.bind(this);
    },
    scroll:function(){
        var L=T=0;
        var
B=document.documentElement.clientHeight-this.id.offsetHeight;
        var
R=document.documentElement.clientWidth-this.id.offsetWidth;
       
this.id.style.left=this.adPosition.left+document.documentElement.scrollLeft+”px”;
       
this.id.style.top=this.adPosition.top+document.documentElement.scrollTop+”px”;
        this.adPosition.left =this.adPosition.left +
this.step*(this.herizonFlag?1:-1);
        if (this.adPosition.left < L) { this.herizonFlag = true;
this.adPosition.left = L;}
        if (this.adPosition.left > R){ this.herizonFlag = false;
this.adPosition.left = R;}
        this.adPosition.top =this.adPosition.top +
this.step*(this.verticleFlag?1:-1);
        if(this.adPosition.top <= T){ this.verticleFlag=true;
this.adPosition.top=T;}
        if(this.adPosition.top >= B){ this.verticleFlag=false;
this.adPosition.top=B; }
    },
    stop:function(){
        clearInterval(this.intervalId);   
    },
    start:function(){
       
this.intervalId=setInterval(this.scroll.bind(this),this.delay);   
    }
}

代码如下: %@ Page Language=”C#”
AutoEventWireup=”true” CodeFile=”Default.aspx.cs” Inherits=”_Default” %
!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//E…

 

<img src=”/upload/55/array_left_normal.gif”
onmouseover=”this.src=’/upload/55/array_left_up.gif’;moveLeft();”
onmouseout=”this.src=’/upload/55/array_left_normal.gif’;stop();”>
<marquee id=”ad” direction=’left’ scrollamount=8 scrolldelay=100
width=200 height=10 bgcolor=”#666666″ style=”color: #00FF00″>
marquee|cJava|cFlash|CJ帝国|marquee </marquee> <img
src=”/upload/55/array_right_normal.gif”
onmouseover=”this.src=’/upload/55/array_right_up.gif’;moveRight();”
onmouseout=”this.src=’/upload/55/array_right_normal.gif’;stop();”>
<script> function moveLeft() { document.all.ad.direction=”left”;
document.all.ad.start(); } function moveRight() {
document.all.ad.direction=”right”; document.all.ad.start(); } function
stop() { document.all.ad.stop(); } stop(); </script>

/*
对联广告调用
第一个参数为ID,第二个参数图片,第三个参数广告距离顶部的距离,
第四个参数表示左右(true代表左,false代表右),第五个参数对联广告的宽度
*/
new float_ad(“ad_l”,”<img
src=’/System/uploads/allimg/090504/2346400.gif’ />”,50,true,64);
new float_ad(“ad_r”,”<img
src=’/System/uploads/allimg/090504/2346400.gif’ />”,50,false,64);

<%@ Page Language=”C#” AutoEventWireup=”true”
CodeFile=”Default.aspx.cs” Inherits=”_Default” %>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”
“;
<html xmlns=”;
<head runat=”server”>
<title>Untitled Page</title>
<style type=”text/css”>
#mydiv
{
height: 89px;
}
</style>
<script runat=”server”> //服务器端脚本语言 ④
protected void Page_Load(object sender, EventArgs e)
{
Button1.Attributes.Add(“onclick”, “javascript:return
confirm(‘真的准备删除吗?’)”); //单击button1时 弹出对话框
}
protected void Button1_Click2(object sender, EventArgs e)
{
Response.Write(“执行删除任务吗!!”); //单击同意是 执行 否则不执行
}
</script>
<script language=”javascript” type=”text/javascript”>
//浏览器端脚本 ②
function tupian_onclick(tupian) //服务器端需传参数
{
tupian.src=”banner_right_02.gif”
}
function tupian_onmouseover(tupian) {
tupian.src=”banner_right_02.gif”;
}
function tupian_onmouseout(tupian) {
tupian.src=”banner_right_01.gif”;
}
</script>
</head>
<body onload =”test()”> //加载脚本文件中的函数
<script language =”javascript”> ①
document.write(“<font
color=blue>你好,Javascript!</font>”);
</script> // 在网页上显示字符串
<form id=”form1″ runat=”server”> //表单
<div>
<img id=”tupian” alt=”” src=”banner_right_01.gif” //图片
onclick=”return tupian_onclick(tupian)” onmouseover=”return
tupian_onmouseover(tupian)” onmouseout=”return
tupian_onmouseout(tupian) />
–服务器javascript脚本函数调用需加参数
<div id=”mydiv” onclick=”return mydiv_onclick()”></div>
定义一个ID为mydiv
<script src =”test.js”> //调用脚本文件 ③
</script>
<asp:Button ID=”Button1″ runat=”server” Text=”弹出确定框”
onclick=”Button1_Click2″ />
<asp:ImageButton ID=”ImageButton1″ runat=”server”
ImageUrl=”~/banner_right_01.gif” onclick=”ImageButton1_Click”
onmouseover=”this.src=’banner_right_02.gif'”
onmouseout=”this.src=’banner_right_01.gif'” />
//一班情况下服务器端不响应鼠标移动事件
通过此方法可在客户端响应鼠标移动时间
</div>
</form>
</body>
</html>

代码: !DOCTYPE html PUBLIC
-//W3C//DTD XHTML 1.0 Transitional//EN
html
xmlns=…

/*
漂浮广告调用
第一个参数中的url代表漂浮广告的图片URL地址(必选项),link链接到页面网址,alt图片提示文字,width图片的宽度(可选项,默认120),heihgt图片的高度(可选项,默认120)
第二个参数中的代表漂浮广告的初始位置,由参数left和top指定
第三个参数代表浮动速度,0为静止,越小浮动速度越快
*/
new
move_ad({url:”/System/uploads/allimg/090504/2346400.gif”,link:”);

复制代码 代码如下:

效果图如下:

相关文章

标签:

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图