<div id="scrollDiv">放些文字或图片</div>
<script type="text/javascript">
var x = 50,y = 60;
var xin = true, yin = true ;
var step = 1 ;
var delay = 10 ;
var obj=document.getElementById("scrollDiv") ;
/**//*<![CDATA[*/
function closeDiv(){
document.getElementById('scrollDiv').style.display='none';
}
function rollMethod() {
var L=T=0;
var R= document.body.clientWidth-obj.offsetWidth ;
var B = document.body.clientHeight-obj.offsetHeight ;
obj.style.left = x + document.body.scrollLeft ;
obj.style.top = y + document.body.scrollTop ;
x = x + step*(xin?1:-1) ;
if (x < L) { xin = true; x = L}
if (x > R){ xin = false; x = R}
y = y + step*(yin?1:-1)
if (y < T) { yin = true; y = T }
if (y > B) { yin = false; y = B }
}
var itl= setInterval("rollMethod()", delay) ;
obj.onmouseover=function(){clearInterval(itl)} ;
obj.onmouseout=function(){itl=setInterval("rollMethod()", delay);
}
/**//*]]>*/
</script>
分享到:
相关推荐
本资源包“多种弹出漂浮层JS网页特效”集合了各种各样的弹出层实现方式,帮助开发者为网站增添更多动态和互动性。 1. **什么是弹出层** 弹出层是指在用户与网页交互时,突然出现在当前视图上的独立窗口。它可以是...
4. **JavaScript/jQuery动态计算**:当用户滚动时,可能需要动态调整漂浮层的位置。可以使用`$(window).scrollTop()`获取滚动条的垂直偏移量,然后根据这个值调整元素的`top`属性。 5. **插件使用**:jQuery社区有...
**jQuery 跟随滚动条漂浮层技术详解** 在网页设计中,有时我们需要创建一种效果,即某个元素(如广告、导航栏或提示信息)始终保持在用户视野内,即使当用户滚动页面时也是如此。这种效果被称为“跟随滚动条漂浮层...
本案例中,我们探讨的是一个“很简单的纯CSS固定漂浮层”的实现方法,无需JavaScript或其他编程语言,仅通过CSS就能达到预期效果。 首先,我们要理解CSS中的定位属性,这是实现固定漂浮层的关键。CSS中的定位主要有...
这样的效果称为“漂浮层”或者“固定定位”。在本教程中,我们将探讨如何仅使用CSS来实现这一功能,无需JavaScript的介入。这对于保持页面性能和减少代码复杂性非常有益。 首先,我们需要理解CSS中的`position`属性...
"CSS+JS图片显示漂亮的漂浮提示框效果代码"就是一个很好的例子,它利用了CSS(层叠样式表)和JavaScript来增强用户体验,特别是在处理图片展示时。下面将详细阐述这个主题中的核心知识点。 首先,CSS(Cascading ...
标题中的“CSS JS图片漂浮提示框效果”指的是在网页设计中使用CSS(层叠样式表)和JavaScript技术实现的一种交互式用户体验。这种效果通常会在用户鼠标悬停在图片上时,显示一个漂浮的提示框,提供额外的信息或者与...
javascript 漂浮广告 虽然网站上有漂浮广告很烦人,有的老板就偏爱 这个 ... 没办法 ..哎
4. **弹窗漂浮**:标签中的"JS特效-弹窗漂浮"可能意味着这个弹出层不仅局限于页面某一固定位置,还可以在整个页面上自由移动,保持与用户的鼠标位置同步,提高交互性。 从压缩包内的文件"123"来看,虽然没有提供...
网页上的漂浮文字广告是一种常见的在线营销策略,它利用JavaScript或者CSS技术在用户浏览网页时显示浮动的文字元素,以吸引用户的注意力。这种广告形式通常设计为动态效果,可以在页面上移动,滚动,甚至跟随用户的...
"CSS+JS图片显示漂亮的漂浮提示框效果"是一个实现这一目标的实例,它结合了CSS(层叠样式表)和JavaScript的技术,为用户提供了一种优雅的方式来展示信息或者提示。这个压缩包文件包含了一个完整的解决方案,用于在...
根据不同的浏览器类型,插入不同格式的HTML代码,创建一个漂浮层(在NS4中为`<layer>`,在其他浏览器中为带有`position: absolute`样式的`<div>`),并将上述定义的属性应用到这个层上。 ### 4. 实现漂浮效果的动态...
根据给定文件的信息,我们可以提炼出以下几个主要的知识点:单元格撑大、层的处理、密码显示可变、漂浮广告以及HTML与JavaScript的应用。接下来将对这些知识点进行详细的阐述。 ### 单元格撑大的实现方法 在网页...
3. **JavaScript**:JavaScript用于处理动态交互,比如检测QQ在线状态、显示隐藏聊天窗口、更换QQ号码等功能。 4. **Ajax**:可能使用Ajax技术进行异步通信,使得与服务器的交互无需刷新整个页面,提高用户体验。 5....
【漂浮鼠标显示div】是一种常见的网页交互设计技术,它涉及到HTML、CSS和JavaScript的综合应用。当用户将鼠标指针悬停在特定元素上时,一个div层会以浮动的方式出现在屏幕上的指定位置,展示相关信息。这种效果常...
JS(JavaScript)是一种广泛使用的网页脚本语言,它是构成动态网站、网页和Web应用不可或缺的部分。本文重点讨论如何利用JavaScript实现广告图片在网页上的弹性漂浮效果。所谓的弹性漂浮效果,指的是当广告图片接触...
在网页开发中,jQuery 和 JavaScript 是两种常用的前端技术,它们能帮助开发者轻松地实现各种交互效果,其中就包括屏幕蒙层效果。屏幕蒙层通常用于显示提示信息、加载动画、弹窗对话框等,它可以在页面上覆盖一层半...
综上所述,实现"可定时关闭可手动关闭的漂浮窗口"涉及前端开发的基本技能,包括HTML布局、CSS定位、JavaScript事件处理及计时器功能。通过这些技术,开发者可以创建出既实用又具有良好用户体验的漂浮窗口功能。对于...
在前端开发中,创建引人入胜的用户体验是至关重要的,而"CSS+JS图片弹出漂浮特效"就是一种实现这一目标的方式。这个小项目旨在通过结合CSS样式和JavaScript脚本,创建一个动态背景,其中包含随机颜色的气球漂浮效果...
2. **ServiceQQ.js**:这很可能是JavaScript文件,用于实现QQ客服的交互功能,包括浮动效果、客服状态的获取和展示、以及与QQ服务器的通信等。JavaScript是实现动态网页效果的关键,这里的ServiceQQ.js将处理大部分...