文章来源:蓝色理想跟随滚动条的图片#floater{        POSITION:absoJavaScript

文章来源:蓝色理想

跟随滚动条的图片

#floater {

POSITION: absolute; VISIBILITY: visible; WIDTH: 10px; Z-INDEX: 10

}

//不知道为什么要定义floater为样式表!

whichIt = whichIt.parentElement;

if (whichIt == null) { return true; }

}

whichIt.style.pixelLeft = whichIt.offsetLeft;

whichIt.style.pixelTop = whichIt.offsetTop;

currentX = (event.clientX + document.body.scrollLeft);

currentY = (event.clientY + document.body.scrollTop);

} else {

window.captureEvents(Event.MOUSEMOVE);

if(checkFocus (e.pageX,e.pageY)) {

whichIt = document.floater;

StalkerTouchedX = e.pageX-document.floater.pageX;

StalkerTouchedY = e.pageY-document.floater.pageY;

}

}

return true;

}

function moveIt(e) {

if (whichIt == null) { return false; }

if(IE) {

newX = (event.clientX + document.body.scrollLeft);

newY = (event.clientY + document.body.scrollTop);

distanceX = (newX - currentX); distanceY = (newY - currentY);

currentX = newX; currentY = newY;

whichIt.style.pixelLeft += distanceX;

whichIt.style.pixelTop += distanceY;

if(whichIt.style.pixelTop < document.body.scrollTop) whichIt.style.pixelTop = document.body.scrollTop;

if(whichIt.style.pixelLeft < document.body.scrollLeft) whichIt.style.pixelLeft = document.body.scrollLeft;

if(whichIt.style.pixelLeft > document.body.offsetWidth - document.body.scrollLeft - whichIt.style.pixelWidth - 20) whichIt.style.pixelLeft = document.body.offsetWidth - whichIt.style.pixelWidth - 20;

if(whichIt.style.pixelTop > document.body.offsetHeight + document.body.scrollTop - whichIt.style.pixelHeight - 5) whichIt.style.pixelTop = document.body.offsetHeight + document.body.scrollTop - whichIt.style.pixelHeight - 5;

event.returnValue = false;

} else {

whichIt.moveTo(e.pageX-StalkerTouchedX,e.pageY-StalkerTouchedY);

if(whichIt.left < 0+self.pageXOffset) whichIt.left = 0+self.pageXOffset;

if(whichIt.top < 0+self.pageYOffset) whichIt.top = 0+self.pageYOffset;

if( (whichIt.left + whichIt.clip.width) >= (window.innerWidth+self.pageXOffset-17)) whichIt.left = ((window.innerWidth+self.pageXOffset)-whichIt.clip.width)-17;

if( (whichIt.top + whichIt.clip.height) >= (window.innerHeight+self.pageYOffset-17)) whichIt.top = ((window.innerHeight+self.pageYOffset)-whichIt.clip.height)-17;

return false;

}

return false;

}

function dropIt() {

whichIt = null;

if(NS) window.releaseEvents (Event.MOUSEMOVE);

return true;

}

if(NS) {

window.captureEvents(Event.MOUSEUP|Event.MOUSEDOWN);

window.onmousedown = grabIt;

window.onmousemove = moveIt;

window.onmouseup = dropIt;

}

if(IE) {

document.onmousedown = grabIt;

document.onmousemove = moveIt;

document.onmouseup = dropIt;

}

if(NS || IE) action = window.setInterval("heartBeat()",1);

跟随滚动条的图片

(跟随滚动的图层名字:floater,必须使用该名称才有,跟随滚动,以及拖放属性)

本文由来源 21aspnet,由 system_mush 整理编辑,其版权均为 21aspnet 所有,文章内容系作者个人观点,不代表 Java架构师必看 对观点赞同或支持。如需转载,请注明文章来源。

java 滚动条 滚动_广告条随滚动条的移动而移动相关推荐

  1. 仿京东首页的京东快报,自动向上滚动的广告条

    向上滚动的广告条 实现原理 起初看到这个效果时,第一个想法就是向上移动动画+定时器,但当我准备写时发现,滚动时上下文字都是逐渐出来的(有点像滑动的),如果用动画的话不行,如果用滑动的话,那就是List ...

  2. 【干货#011】小程序页面滚动实现广告条隐藏

    缘起 小程序需要在手机狭小的屏幕中放入尽量多的内容,而老板想在在页面放个广告条,由于挤占了不然就不大的页面控件,对程序的功能操作又有较大的影响.如何兼顾两者的需求? 下面介绍一种默认显示页面首部广告条 ...

  3. Android之高仿京东APP首页“京东快报”自动向上滚动的广告条

    转载请标明出处: http://blog.csdn.net/hai_qing_xu_kong/article/details/51013562 本文出自:[顾林海的博客] ##前言 上次在京东APP上 ...

  4. layui表头跟随滚动条滑动_侧边栏实现随滚动条滑动固定的效果

    最近在一些博客看到侧边栏某些板块,随着滚动条的滑动,而跟着滑动或者固定的效果,感觉非常的人性化,一来可以弥补当一个页面很长,但侧边栏太短的 时候的空白,二来可以合理利用空间展示更多信息,可以大大的提高 ...

  5. 类似淘宝、京东的热点推荐垂直滚动文字广告条

    今天带来的是一个自定义的垂直滚动广告条 VerticalScrollTextView ,但是在介绍这个控件之前,我先想介绍的是我的一个远程库GWidget,这个是我一个专门用来集成各种自定义控件的库, ...

  6. css改火狐滚动条样式_纯css美化滚动条样式

    知乎的编辑器对于复制转发文章来说特别不友好(直接复制后代码乱码,字体变化,表格数据丢失),不太想过多重复编辑,只会编辑转发部分到这上面来,如感觉还不错,请跳转到:https://www.emperin ...

  7. Android 上下滚动条、轮训滚动、广告条

    本文修改自GitHub上的工程:https://github.com/sfsheng0322/MarqueeView 效果图: 说明: 基本大致与原作者的工程差不多,只是修改了下细节部分,比如原工程轮 ...

  8. 广告条随滚动条的移动而移动

    文章来源:蓝色理想 <html> <head> <title>跟随滚动条的图片</title> <meta http-equiv="Co ...

  9. Android 上下滚动的广告条

    有些应用里面会有一些上下滚动文字的广告,尤其是关于商城里面的容易出现,具体的效果相比大家也见过,先看看效果吧 这是怎么实现的呢,有人说是用TextView实现,有的说这是跑马灯效果.其实说TextVi ...

最新文章

  1. 【计算理论】计算理论总结 ( 非确定性有限自动机 NFA 转为确定性有限自动机 DFA | 示例 ) ★★
  2. 【LSH源码分析】p稳定分布LSH算法
  3. Android http 的使用
  4. Linux查看时间段文件,Linux查看特定时间段内修改过的文件
  5. 搭建struts2框架
  6. linux系统进程控制实验报告,Linux进程控制实验报告.doc
  7. 快速入门:使用 Docker 运行 SQL Server 容器映像
  8. 理科生的人生感悟-01-时间的短暂 - 父亲 - 火车上的颠沛流离
  9. ubuntu 16.04下git的安装与使用
  10. SpringBoot集成Redis分布式锁以及Redis缓存
  11. 不想被瓶颈必须了解的计算机基础
  12. java语言飞机大战代码_飞机大战JAVA代码
  13. c51单片机学习笔记二
  14. searchbar.wxss源代码
  15. 基于Dx11写一个自己的游戏引擎--1
  16. libcef-框架架构中概念介绍-进程-线程-引用计数-字符串等(一)
  17. Not enough information to list image symbols. Not enough information to list load addresses in ...
  18. 我的世界java多人不刷溺尸_我的世界:不同版本的三叉戟掉落率不一样?刷了一两百溺尸也没有!...
  19. matlab中函数imresize的使用介绍
  20. XJTU第八周大计基编程作业

热门文章

  1. (八十二)利用苹果服务器获取导航信息和绘制路径
  2. 基于时间片轮转程序分析进程调度
  3. bzoj1669 [Usaco2006 Oct]Hungry Cows饥饿的奶牛
  4. Turbo C 2.0 集成调试器的使用方法
  5. main方法一定要放在public类当中吗?
  6. “中文四六级”考试来了!《国际中文教育中文水平等级标准》发布
  7. 微软出资10亿美元研究AGI,意与谷歌竞争?
  8. Elasticsearch集群部署的相关问题记录
  9. 下列不可以判断网页是否正常打开的是_打开视频卡、无法加载原因查找
  10. php+yii手册下载,yii中文手册-yii框架中文手册教程下载pdf格式免费版-东坡下载