制作浮动广告(注意:会出现闪屏效果)

<script language="javascript" type="text/javascript">
 var initTop;
 //获取广告div初始的top值 
 function getInitTop(){
  initTop = document.getElementById("floatDiv").style.pixelTop;
 }
 //设置广告的位置
 function setTop(){
  /*
  注意:文档中如果有DOCTYPE文档标签,那么document.body.scrollTop得到的值永远为0,而document.documentElement.scrollTop就能得到实际,如果没有DOCTYPE文档标签,那么结果就相反
  */
  var height = document.body.scrollTop?document.body.scrollTop:document.documentElement.scrollTop;//获取滚动条滚动的高(使用三元运算符解决了DOCTYPE文档标签产生的影响)
  document.getElementById("floatDiv").style.pixelTop = initTop+height;//设置广告的pixelTop的值(新值=广告的初始pixelTop值+滚动条滚动的高度)
 }
 window.onscroll=setTop;//浏览器滚动条滚动时调用setTop函数
 
 //隐藏广告
 function closeDiv(){
  document.getElementById("floatDiv").style.display="none";//block显示  none隐藏 
 }
</script>

<body  >
 <div id="floatDiv" style="width:80px;height:72px; position:absolute; top:100px">
     <img src="image/float.gif"/><br />
     <input type="button" value="关闭" onclick="closeDiv()"/>
    </div>

</body>

制作浮动广告(注意:会出现闪屏效果)

时间: 2024-10-04 17:28:40

制作浮动广告(注意:会出现闪屏效果)的相关文章

使用fixed制作浮动广告(注意:解决闪屏问题,但适用于高版本浏览器,低版本的浏览器不适用)

<script language="javascript" type="text/javascript"> //隐藏广告 function closeDiv(){ document.getElementById("floatDiv").style.display="none"; } </script> <body> <!--position:fixed能够使得广告div实现滚动效果,但

制作浮动广告,实现浮动高中在屏幕中来回走动

<script language="javascript" type="text/javascript"> var x=1;//1表示向右移动,0表示向左移动 var y=1;//1表示向下移动,0表示向上移动 function showDiv(){  var adv = document.getElementById("floatDiv");  if(x==1){   adv.style.pixelLeft = adv.style.

html 类似雷达扫描效果 及 闪屏效果

//雷达扫描效果 1 <em id="Radar" class="RadarFast"></em> 2 3 css: 4 .RadarFast{ 5 position: absolute; 6 z-index: 10; 7 bottom: 140px; 8 left: 50%; 9 margin-left: -3px; 10 } 11 .RadarFast:after{ 12 content: ''; 13 position: absolut

闪屏效果

1.Activity文件 public class SlapshActivity extends Activity {    RelativeLayout Rlroot; @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_slapsh);      

js制作浮动广告

-----------------------------------------------------------------------------------------------------------------css @charset "gb2312";/* CSS Document */ body{ margin:0; margin-top:3px; padding:0; font-size:12px; line-height:20px; color:#333;}.f

闪屏的3中延迟跳转方式

1. 定义 闪屏往往是打开应用看到的第一个界面,它出现后短暂的停留几秒再跳转其他页面.再次打开后台应用.有时也会出现闪屏. 闪屏界面一般持续3000ms,背景是一张图片,或者广告. 目的:(1)提高用户体验:(2)给APP留出初始化数据的时间. 案例迁移:电话的等待时间段内播放音乐,跟闪屏效果差不多. 2. 代码写法. (1)开启子线程: 用Thread.sleep(参数)完成延迟跳转的效果 (2)Handler发生延迟消息:new Handler().sendEmptyMessageDelay

直播疑难杂症排查(7)— 黑屏、花屏、闪屏问题

本文是 <直播疑难杂症排查>系列的第七篇文章,我们来重点看看直播中常见的各种黑屏.花屏.闪屏问题. 首先我们要明白,黑屏.花屏.闪屏等问题,可能是推流端的问题,也可能是播放器的问题,遇到这些现象,我们要第一时间用别的播放器(如 VLC,ffplay)试试,如果都出现同样的问题,那么多半是流本身的问题了,反之,则很可能是播放器的问题. 1.  播放黑屏 现象:画面是黑的,没有图像,但是有声音. 1.1 主播端摄像头权限问题 无论 Android 还是 iOS,App 使用摄像头都是需要申请授权的

JavaScript浮动广告代码,容纯DIV/CSS对联漂浮广告代码,兼容性非常好的js右下角与漂浮广告代码

基于JavaScript代码实现随机漂浮图片广告,javascript图片广告 在网上有很多这样的代码,不过未必符合W3C标准,因为在头部加上<!DOCTYPE html>类似标签之后,漂浮效果就会失效,下面分享一个符合标准的漂浮代码,使需要的朋友免去大量改造代码的繁琐. 代码一: 代码如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name

Android App 启动页(Splash)黑/白闪屏现象产生原因与解决办法(转)

转载: Android App 启动页(Splash)黑/白闪屏现象产生原因与解决办法   首先感谢博主分享,本文作为学习记录 惊鸿一瞥 微信的启动页,相信大家都不陌生. 不知道大家有没有发现一个现象,微信每次启动的时候,是直接进入这个启动页面. 我的意思是,很多应用,往往会先白屏停顿一下后再进入启动页面(Splash).为了印证这一点,我把手机上所有的App都点了一遍.选几个例子 如下图: 微信:  斗鱼:  斗鱼和微信是直接进入了,他们的Splash页面. 知乎:  B站:  知乎和B站要先