漂浮广告代码

最新推荐文章于 2024-07-24 16:53:23 发布
最新推荐文章于 2024-07-24 16:53:23 发布
阅读量620 收藏
点赞数
分类专栏： 图片特效 文章标签： function server border timer html null

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">


var vmin=2;
var vmax=5;
var vr=2;
var timer1;

function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function Chip(chipname,width,height){
 this.named=chipname;
 this.vx=vmin+vmax*Math.random();
 this.vy=vmin+vmax*Math.random();
 this.w=width+20;
 this.h=height;
 this.xx=0;
 this.yy=0;
 this.timer1=null;
}

function movechip(chipname){
if (document.getElementById){
eval("chip="+chipname);
   if (window.innerWidth || window.opera){
   pageX=window.pageXOffset;
     pageW=window.innerWidth-40;
     pageY=window.pageYOffset;
     pageH=window.innerHeight-20;
    }
   else if (document.body){
   pageX=iecompattest().scrollLeft;
     pageW=iecompattest().offsetWidth-40;
     pageY=iecompattest().scrollTop;
     pageH=iecompattest().offsetHeight-20;
    }

   chip.xx=chip.xx+chip.vx;
   chip.yy=chip.yy+chip.vy;
  
   chip.vx+=vr*(Math.random()-0.5);
   chip.vy+=vr*(Math.random()-0.5);
   if(chip.vx>(vmax+vmin))  chip.vx=(vmax+vmin)*2-chip.vx;
   if(chip.vx<(-vmax-vmin)) chip.vx=(-vmax-vmin)*2-chip.vx;
   if(chip.vy>(vmax+vmin))  chip.vy=(vmax+vmin)*2-chip.vy;
   if(chip.vy<(-vmax-vmin)) chip.vy=(-vmax-vmin)*2-chip.vy;

   if(chip.xx<=pageX){
   chip.xx=pageX;
      chip.vx=vmin+vmax*Math.random();
     }
   if(chip.xx>=pageX+pageW-chip.w){
   chip.xx=pageX+pageW-chip.w;
      chip.vx=-vmin-vmax*Math.random();
     }
   if(chip.yy<=pageY)
     {chip.yy=pageY;
      chip.vy=vmin+vmax*Math.random();
     }
   if(chip.yy>=pageY+pageH-chip.h)
     {chip.yy=pageY+pageH-chip.h;
      chip.vy=-vmin-vmax*Math.random();
     }

document.getElementById(chip.named).style.left=chip.xx+"px";
document.getElementById(chip.named).style.top=chip.yy+"px";


   chip.timer1=setTimeout("movechip('"+chip.named+"')",100);
  }
}
</script>
<script type="text/javascript">

var flyimage1

function pagestart(){

 flyimage1=new Chip("flyimage1",47,68);


movechip("flyimage1");


}

if (window.addEventListener)
window.addEventListener("load", pagestart, false)
else if (window.attachEvent)
window.attachEvent("onload", pagestart)
else if (document.getElementById)
window.οnlοad=pagestart

</script>


</head>
  <body>
  <form id="form1" runat="server">

      
      
<div id="flyimage1" style="position:absolute; left: -500px; width:47; height:68;">
<a href="#"><img src="images/a7.gif" border="0"></a>
</div>

 

   

    </form>
</body>
</html>

qianlinlin
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
javascript实现的广告漂浮
11-06
javascript的特效之一，广告漂浮，拉动页面的滚动条，广告随之移动
用javaScript制作漂浮广告
ouY_huan的专栏
06-24 1310
<br /> <br /> <br /><script><br /> var x=50 , var y=50;     //浮动广告的初始位置<br /> <br /> var right=true ,  var left =true;   //right 为真，则向右运动，否则向左运动<br />                                               //left 为真，则向左运动，否则向右运动<br /> <br />var step=1;          //移
javascript实现广告浮动效果
weixin_33860722的博客
09-24 190
<html><head><script language="JavaScript">function Move(){document.getElementById("Layer1").style.left=Math.random()*1024;document.getElementById("Layer1").style.top=Math.random()*...
[原创]使用javascript制作漂浮的广告，在页面上自由飘转
Asp.net2.0开发专栏
06-13 2602
floast.js原文件：var xPos = 20;var yPos = document.body.clientHeight;var step = 1;var delay = 30; var height = 0;var Hoffset = 0;var Woffset = 0;var yon = 0;var xon = 0;var pause = true;var interval;dd.st
漂浮广告js代码
lhn1523917的专栏
01-18 907
自己刚学js试着写了个浮动广告脚本，贴出来给大家喷喷 //给对象添加事件 function addEvent(obj,type,fn){ if(obj.addEventListener){ obj.addEventListener(type,fn,false); } else{ obj['e'+type+fn]=fn; ob
float ad浮动广告代码
10-31
浮动广告代码，通常用于网页设计中，以创建一种在用户滚动页面时仍能保持在屏幕某一位置的广告效果。这种类型的广告能够持续吸引用户的注意力，提高广告的可见度。以下是对`float ad`浮动广告代码的详细解释： 首先...
三个漂浮广告代码
01-23
这些文件的详细内容需要解压后查看，以便进一步理解和使用这些漂浮广告代码。 综上所述，"三个漂浮广告代码"是指实现三种不同位置（顶部、底部和侧边）漂浮广告的HTML、CSS和JavaScript代码。这些代码可以帮助...
浮动广告代码
05-08
### 浮动广告代码解析与应用 在网页设计与网络广告领域，浮动广告因其灵活性和高可见性而受到广泛欢迎。浮动广告代码是实现这一功能的关键技术，它允许广告在用户浏览网页时跟随滚动，保持在用户的视线范围内，从而...
JavaScript - 浮动广告窗口实例
陆讯
04-26 3151
浮动广告窗口<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>浮动广
canvas裁剪图片尺寸问题
勋勋勋勋小勋勋的博客
09-12 833
个人见解，欢迎大家一起交流学习n(*≧▽≦*)n 得到原始的图片尺寸 let myImage = document.getElementById("tailoringImg"); if (typeof myImage.naturalWidth == "undefined") { // IE 6/7/8 let i =...
js实现网页漂浮广告
莫莫的家
01-29 4879
目前我们公司有个医盟天下的活动，需要将该活动展示在我们的网页上；然后就想到通过漂浮类似广告这种在页面首页； css样式：就是关于漂浮广告层的样式设定 div#roll{width:100px;height:100px; background-color:#000; color:#fff; position:absolute;} 这个div是漂浮层将要显示的具体内容 医盟天下大比拼 下
JavaScript中的广告首页漂浮特效
weixin_44075120的博客
01-12 255
JS上下自动漂浮广告，可关闭
bug世界
12-08 5480
一不懂开发的朋友，需要一个左右浮动显示的广告，网上找了一个，放在这里，希望对大家有用。 很简单，只是想能给大家节省一部分时间     // 这是关闭飘浮广告的宽度，请根据你的广告内容而定     var hbcms_ad_width = 100;     // 这是关闭飘浮广告的代码，可以换成图片，点击即可关闭     var hbcms_close_str =
前端基础面试题大全-极乐科技（一）-JS部分
weixin_34162695的博客
08-10 403
2019独角兽企业重金招聘Python工程师标准>>> ...
基于 HTML+ECharts 实现的大数据可视化平台模板（含源码）
最新发布
柯晓楠
07-24 3294
大数据的可视化对于企业决策、市场分析和业务洞察至关重要。通过直观的数据展示，团队可以快速理解复杂的数据模式，发现潜在的业务机会。本文将详细介绍如何利用 HTML 和 ECharts 实现一个功能丰富的大数据可视化平台模板。
【HTML — 构建网络】HTML 入门
07-24 1220
如果您查看许多其他站点的代码，您可能会遇到许多奇怪的标记样式，包括不带引号的属性值。在这一点上，你应该了解 HTML 是什么样子的，以及它在基本层面上是如何工作的。在 HTML 中，不需要在 void 元素标记的末尾添加 a，例如： .但是，它也是一种有效的语法，当您希望 HTML 是有效的 XML 时，您可以这样做。现在，您可以在 Web 浏览器中打开此文件，以查看呈现的代码的外观。在本练习中，您可以如前所述在计算机上本地编辑代码，也可以在下面的示例窗口中编辑代码（在本例中，可编辑示例窗口仅表示。
完整的js漂浮广告代码
05-24
以下是一个简单的JS漂浮广告代码： ```html <button class="close-btn">X var ad = document.getElementById("floating-ad"); var closeBtn = ad.querySelector(".close-btn"); // 点击关闭按钮隐藏广告...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值