- 75
- 0
- 约6.39千字
- 约 11页
- 2017-10-07 发布于河南
- 举报
网页图片无缝循环滚动html代码(Web page seamless scroll HTML code)
网页图片无缝循环滚动html代码(Web page seamless scroll HTML code)
Picture scroll code
Seamless scrolling code
First introduce its implementation ideas: a set width and the width of the container demo hidden beyond its content, put Demo1 and demo2, Demo1 is rolling content, demo2 for the direct cloning of Demo1, by changing the Demo1 scrollTop or scrollLeft to achieve the purpose of rolling, when the junction of Demo1 and demo2 to scroll when directly back to the initial position, because the Demo1 and demo2, so dont beat the moment, so as to achieve the purpose of seamless rolling.
First, learn about several properties of objects:
InnerHTML: sets or gets the HTML in the objects start and end tags
ScrollHeight: gets the scroll height of the object.
ScrollLeft: sets or gets the distance between the left border of the object and the leftmost end of the currently visible content in the window
ScrollTop: sets or gets the distance between the top of the object and the top of the visible content in the window
ScrollWidth: gets the scroll width of the object
OffsetHeight: gets the height of the parent relative to the page or the parent coordinates specified by the parent coordinate offsetParent property
OffsetLeft: gets the calculated left position of the object relative to the page or the parent coordinates specified by the offsetParent property
OffsetTop: gets the calculated top position of the object relative to the page or the parent coordinates specified by the offsetTop property
OffsetWidth: gets the width of an object relative to the page or the parent coordinate specified by the parent coordinate offsetParent property
Scroll up code:
div id=demo style=overflow:hidden; height:400; width:160; background:#214984; color:#fffffftable align=top cellpadding=0 cellspace=0 border=0trtd id=demo1 valign=topimg src= pic/1.jpg width= 156 height= 200 /brimg src= pic/2.jpg width= 160 height= 198 /brimg src= pic/3.jpg width= 155 height= 200 /brimg src= pic/4.jpg width= 157 height= 200 //td/trtr
您可能关注的文档
- 研究外形 探究内理──《乘法分配律》教学谈(The study of appearance and the exploration of internal theory -- on the teaching of multiplication distribution law).doc
- 研究性学习与中小学教师的教育研究(Research learning and the education of primary and middle school teachers).doc
- 研究生复试常见问题(新手必备)(Postgraduate retest common questions (novice essential)).doc
- 研究生学习计划(Graduate study program).doc
- 研究生复试英语自我介绍(Self introduction of postgraduate English).doc
- 研究生考试科目(Postgraduate examination subjects).doc
- 研究生这几年真的很重要---一个比较优秀的研究生的感触‘木虫’(Graduate students are really important these years -- a good graduate student's feeling, 'wood worm').doc
- 研究生考试(Graduate student entrance examination).doc
- 研究生复试面试英语口语(Graduate interview interview oral English).doc
- 研究生读研期间学费问题(Tuition during graduate school).doc
原创力文档

文档评论(0)