HTML基础语言(二)

作者: 张俊SEO
时间:2021-01-10
浏览:43


我们先来了解一下marquee图片无缝滚动对象的几个的属性:
inner:     设置或获取位于对象起始和结束标签内的 HTML
scrollHeight:    获取对象的滚动高度。
scrollLeft:      设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
scrollTop:      设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离
scrollWidth:     获取对象的滚动宽度
offsetHeight:     获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度
offsetLeft:      获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置
offsetTop:       获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置
offsetWidth:      获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的宽度


一.图片向上无缝滚动

示例代买:


向上滚动



HTML基础语言(二)-marquee制造滚动
HTML基础语言(二)-marquee制造滚动
HTML基础语言(二)-marquee制造滚动
HTML基础语言(二)-marquee制造滚动
HTML基础语言(二)-marquee制造滚动



二.图片向下无缝滚动

示例代码:


向下滚动



HTML基础语言(二)-marquee制造滚动
HTML基础语言(二)-marquee制造滚动
HTML基础语言(二)-marquee制造滚动
HTML基础语言(二)-marquee制造滚动
HTML基础语言(二)-marquee制造滚动



三.图片向左无缝滚动

示例代码:


向左滚动




HTML基础语言(二)-marquee制造滚动
HTML基础语言(二)-marquee制造滚动
HTML基础语言(二)-marquee制造滚动
HTML基础语言(二)-marquee制造滚动
HTML基础语言(二)-marquee制造滚动
HTML基础语言(二)-marquee制造滚动




四.图片向右无缝滚动


向右滚动




HTML基础语言(二)-marquee制造滚动
HTML基础语言(二)-marquee制造滚动
HTML基础语言(二)-marquee制造滚动
HTML基础语言(二)-marquee制造滚动
HTML基础语言(二)-marquee制造滚动
HTML基础语言(二)-marquee制造滚动




图片尺寸为原始大小

滚动图片代码含义补充说明

1.scrollAmount。它表示速度,值越大速度越快。如果没有它,默认为6,建议设为1~3比较好。
2.加入onmouseover=stop() onmouseout=start()代码,鼠标指向循环文字图片时他们会停止滚动,鼠标离开时继续滚动。

3.兼容性问题:网站顶部移动文字,用marquee这个标签做的,在ie8以下版本浏览器和火狐浏览器文字显示完整 但是在ie8和ie9文字滚动时候显示不完,但是在源代码中是显示完整的,怎么搞都不行,非得用js吗 ?如图:后面还有字,但是不显示了,只显示一部分

历史上的今天:

  1. 2017:  

本文原文地址:https://zhangjunseo.com/95.html

本篇文章来源于 https://zhangjunseo.com/95.html 版权均归站长本人所有,如有侵权,请联系seowhy2018删除。
    0 人参与评论
该文章尚未收到评论 :(
提交评论禁止带推广链接、违法词及灌水,违规将封禁账号!!了解合理带链接的方法