`
hudeyong926
  • 浏览: 2031700 次
  • 来自: 武汉
社区版块
存档分类
最新评论

随屏幕滚动的带缓冲效果的右下角广告

 
阅读更多

一个随屏幕自动滚动的右下角广告代码,这里请注意几个参数:
id 你要滚动的内容的id
r 放在左边还是右边 默认是右边
t 你要放在页面的那个位置默认是贴着底边 0是贴着顶边
f 1表示固定 不写或者0表示滚动(ie6固定无效)
是不是很实用呢,这个版本经过作者二次修正,兼容性还不错

<!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" content="text/html; charset=gbk" />
<title>随屏幕滚动的带缓冲效果的右下角广告</title>
<style>
	html,body{
		height:2000px;
	}
</style>
</head>
<body>
	<div id="aa" style="width:200px;height:200px;background:#c0c0c0;" >拖动滚动条试试哦~</div>
</body>
</html>
<script>
    function scroll(p){
    	var d = document,w = window,o = d.getElementById(p.id),ie6 = /msie 6/i.test(navigator.userAgent);
    	if(o){
    		o.style.cssText +=";position:"+(p.f&&!ie6?'fixed':'absolute')+";"+(p.r?'left':"right")+":0;"+(p.t!=undefined?'top:'+p.t+'px':'bottom:0');
    		if(!p.f||ie6){
    			-function(){
	        		var t = 500,st = d.documentElement.scrollTop||d.body.scrollTop,c;
	                c = st  - o.offsetTop + (p.t!=undefined?p.t:(w.innerHeight||d.documentElement.clientHeight)-o.offsetHeight);//如果你是html 4.01请改成d.body,这里不处理以减少代码
	            	c!=0&&(o.style.top = o.offsetTop + Math.ceil(Math.abs(c)/10)*(c<0?-1:1) + 'px',t=10);
	            	setTimeout(arguments.callee,t)
        		}()	
    		}
    	}  
    }
    scroll({
    	id:'aa'
    
    })
</script>

 

分享到:
评论

相关推荐

    js实现随屏幕滚动的带缓冲效果的右下角广告代码

    通过上述知识点的分析和总结,可以了解到在实现随屏幕滚动的带缓冲效果的右下角广告代码中,涉及到了JavaScript操作页面元素的多个方面,包括定位、运动计算、事件处理、浏览器兼容性、性能优化等,是Web开发中经常...

    图片缓冲滚动效果

    在IT行业中,图片缓冲滚动效果是一种常见的用户界面(UI)设计技术,特别是在产品展示或图像密集型应用中,能够提供流畅、高效的用户体验。这个技术主要应用于网页、移动应用或者桌面软件,通过预先加载和缓存图片,...

    j2me最新滚动菜单(带缓冲效果)

    本主题聚焦于"j2me最新滚动菜单(带缓冲效果)",这涉及到在J2ME环境中创建动态、流畅的用户界面元素,尤其是菜单的滚动机制。 滚动菜单是移动应用中常见的一种交互设计,用户可以通过上下滑动来浏览菜单项。在这个...

    javascript带缓冲效果的区域滚动条效果.rar

    Dean Edward所写的addevent库,不但可自定义浏览器中的滚动条,还可为其添加缓冲变化的效果。  element: 绑定事件的元素  type: 事件类型,鼠标事件等  handler: 处理方法  为每个事件赋予独立的ID,建立一...

    as3 滚动条控制元件移动 带缓冲效果

    由于带滚动条的动态文本框无法竖着显示文字,于是通过把文本框转换成元件,遮罩层盖在内容层上,实现拉滚动条,元件左右移动,在遮罩层的帮助下,实现竖排文字左右移动的效果,然后通过代码加入移动的缓冲效果,注意...

    delphi滚动字幕(标题滚动,上下及左右字幕滚动)

    本项目涉及了三种类型的滚动字幕实现,包括标题滚动、Label滚动以及字幕从下往上滚动。下面将详细讲解这些滚动效果的实现原理和步骤。 1. **标题滚动**: 标题滚动通常是应用程序窗口顶部的标题栏中的文字进行动态...

    jQuery全屏页面滚动效果页面上下滚动效果代码jq插件

    在网页设计中,这种效果常用于创建引人入胜的单页应用(SPA)或者产品展示页面,使得内容随着用户的滚动动作自然过渡,增加网站的视觉吸引力。 首先,jQuery是一个轻量级的JavaScript库,它简化了JavaScript的DOM...

    VC 双缓冲 滚动字幕

    在VC++编程中,双缓冲技术常用于解决GUI(图形用户界面)中因多次重绘导致的闪烁问题,尤其在滚动字幕等动态效果中显得尤为重要。闪烁是由于窗口更新时,新旧画面交替出现产生的视觉效果。双缓冲通过在内存中先完成...

    Js 自定义的滚动条拖动缓冲插件

    Dean Edward所写的addevent库,不但可自定义浏览器中的滚动条,还可为其添加缓冲变化的效果。  element: 绑定事件的元素  type: 事件类型,鼠标事件等  handler: 处理方法  为每个事件赋予独立的ID,建立一...

    两种滚动效果的对联广告代码.rar

    物理弹性滚动效果借鉴了现实世界中的物理现象,当用户通过网页的滚动条拖动页面时,对联广告不会立即停止,而是有一个平滑的减速过程,仿佛具有弹簧般的缓冲效果。这种效果通过编程技术模拟了物体在受到外力作用后的...

    JavaScript实现跟随滚动缓冲运动广告框

    当我们浏览一些网页时我们会发现页面的的边上会有广告图片,当滚动滚动条的时候这些广告图片会跟随性的随页面一起运动(这里我叫它为广告框)。一些网页的广告框是固定在浏览器上的用background:fixed;便可实现。...

    实用的jquery 折叠菜单 带缓冲效果,3种效果

    接着,我们探讨“缓冲效果”:缓冲效果是指在菜单展开或收起时,不是瞬间完成,而是有一个平滑的过渡过程,这通常通过CSS3的过渡效果或jQuery的动画函数来实现,以增加视觉吸引力和流畅性。 第一种效果:基础缓冲...

    JavaScript实现带缓冲效果的随屏滚动漂浮广告代码

    总结来说,JavaScript实现带缓冲效果的随屏滚动漂浮广告代码是通过监听页面滚动事件,结合时间函数动态调整广告元素的位置,以实现平滑过渡的视觉效果。这种方法适用于创建动态、引人注目的网页广告,同时也可用于...

    网站右击带缓冲效果弹出菜单

    "网站右击带缓冲效果弹出菜单"就是一个旨在增强用户交互体验的功能。这种功能通常使用JavaScript(JS)和层叠样式表(CSS)来实现,使得用户在鼠标右键点击网页时,弹出的菜单不会瞬间显示,而是有一个平滑的过渡...

    页面载入缓冲效果,页面缓冲特效

    在网页设计中,用户体验是至关重要的一个环节,而页面载入缓冲效果就是提升用户体验的一种巧妙方式。当用户点击链接或提交表单时,他们通常希望看到的不是枯燥无味的空白页面,而是有一个动态的、视觉上吸引人的加载...

    JS带 左右按钮 滚动图片

    6. **用户交互优化**:为了提高用户体验,可以添加缓冲效果,比如图片在切换时先隐藏,再慢慢显示出来。此外,还可以考虑图片加载状态的处理,避免用户看到未完全加载的图片。 7. **响应式设计**:考虑到不同设备的...

    屏幕文本滚动播出事例

    屏幕文本滚动播出是一种常见的软件界面效果,常用于展示滚动信息,如歌词、公告或滚动字幕。在本案例中,我们将探讨如何使用C++语言来实现这一效果,特别是在早期的编程实践中,这样的技术通常依赖于双缓冲机制来...

    JavaScript可关闭,最小化的右下角广告窗口.rar

    JavaScript可关闭,最小化的右下角广告窗口,类似于新浪博客的右下角功能,只是设计不格有所不同,打开liehuo_demo.html,就可以看到效果了,可以关闭,也可以最小化,以上操作都有缓冲效果,代码中很多链接都是外部...

Global site tag (gtag.js) - Google Analytics