已阅读5页,还剩2页未读, 继续免费阅读
版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领
文档简介
教你如何实现DIV的图片无缝滚动效果 在网站制作和站长进行网站维护的时候,经常会想使用滚动图片来达到某种效果,现在我们来教大家如何实现,下面由洛阳蓝点科技技术员整理发布:先了解一下对象的几个的属性:innerHTML:设置或获取位于对象起始和结束标签内的 HTMLscrollHeight: 获取对象的滚动高度。scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离scrollWidth:获取对象的滚动宽度offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置offsetWidth:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的宽度图片上无缝滚动向上滚动!-var speed=10; /数字越大速度越慢var tab=document.getElementById(demo);var tab1=document.getElementById(demo1);var tab2=document.getElementById(demo2);tab2.innerHTML=tab1.innerHTML; /克隆demo1为demo2function Marquee()if(tab2.offsetTop-tab.scrollTop图片下无缝滚动向下滚动=0)/当滚动至demo1与demo2交界时tab.scrollTop+=tab2.offsetHeight /demo跳到最顶端elsetab.scrollTop-var MyMar=setInterval(Marquee,speed);tab.onmouseover=function() clearInterval(MyMar);/鼠标移上时清除定时器达到滚动停止的目的tab.onmouseout=function() MyMar=setInterval(Marquee,speed);/鼠标移开时重设定时器-图片左无缝滚动向左滚动!-var speed=10; /数字越大速度越慢var tab=document.getElementById(demo);var tab1=document.getElementById(demo1);var tab2=document.getElementById(demo2);tab2.innerHTML=tab1.innerHTML;function Marquee()if(tab2.offsetWidth-tab.scrollLeft图片右无缝滚动向右滚动!-var speed=10; /数字越大速度越慢var tab=document.getElementById(demo);var tab1=document.getElementById(demo1);var tab2=document.getElementById(demo2);tab2.innerHTML=tab1.innerHTML;function Marquee()if(tab.scrollLeft 本篇文章来源于 蓝点科
温馨提示
- 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- 机械厂促进剂安全管控与保障体系
- 少儿法律常识启蒙教学合同
- 商住两用房买卖服务合同
- 《英语演讲》课件-Intro 新
- 2025年天台县教育局招聘事业编制教师考试真题
- 烟台市招远市考选毕业生考试真题2025
- 2025年临沂沂南县教育科学研究与发展中心招聘考试真题
- 2025年北京市卫生健康委员会直属事业单位招聘真题
- 2026江苏省淮安市市属国有企业春季校园招聘8人考试模拟试题及答案解析
- 成本管理岗位晋升指南
- 国资委安全生产十条硬措施
- 2024年云南曲靖市住建局招聘考果及拟聘公开引进高层次人才和急需紧缺人才笔试参考题库(共500题)答案详解版
- EPC项目施工图设计质量控制措施
- AMS成就动机量表问卷计分解释
- JGT526-2017 建筑电气用可弯曲金属导管
- 反渗透阻垢剂化学品安全技术说明书
- 《中药炮制技术》课程标准
- 2023年06月河北唐山市事业单位(滦南县)公开招聘570人笔试题库含答案解析
- 组织理论和设计专题培训课件
- 2023年田蕴章教师书法每日一提每日一字一行楷草三种字体示范字帖
- 中药学电子版教材
评论
0/150
提交评论