首尾相连无缝滚动特效,此特效可以实现文字,图片,从右向走首尾相连无缝滚动,图片和文字可以是直接写上的也可以是从数据库中取出的。
下面以直接添加上的图片为例,对于文字只需把图片替换就可以了:
<table cellspacing=0 cellpadding=0 width=300 align=center border=0>
<tr>
<td height=25>
<div id=demo style="OVERFLOW: hidden; WIDTH: 300px; COLOR: #ffffff; HEIGHT: 25px">
<table cellPadding=0 align=left border=0 cellspacing=0>
<tr>
<td id=demo1 width=300>
<table cellspacing=0 cellpadding=0 width=300 align=center border=0>
<tr>
<td width=300><img src=skins/default/UBB/Icons/flash.gif><img src=skins/default/UBB/Icons/music.gif><img src=skins/default/UBB/Icons/flash.gif><img src=skins/default/UBB/Icons/music.gif></td>
</tr>
</table>
</td>
<td id=demo2></td>
</tr>
</table>
</div>
</td>
</tr>
</table>
<SCRIPT>
var speed=8
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo1.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</SCRIPT>
分享到:
相关推荐
<marquee onMouseOut="this.start()" onMouseOver="this.stop()">鼠标交互示例</marquee> ``` #### 六、综合示例 下面是一个包含多个属性的 `<marquee>` 示例: ```html <marquee id="affiche" align="left" ...
<p><strike>删除线文本</strike> <s>不准确的文本</s> <del>已删除的文本</del></p> ``` #### 5. 换行与分隔线 - **换行**:`<br>`。用于强制换行。 - **水平分隔线**:`<hr>`。用于创建水平线,可设置宽度、高度、...
`<marquee behavior="scroll" direction="left" scrollamount="3">滚动的文字或图像</marquee>` - `behavior`: 控制滚动行为,可选值为`scroll`(默认,连续滚动)、`slide`(只滚动一次)和`alternate`(来回滚动...
其中一种常见的动态效果就是利用`<marquee>`标签来实现文字或图片的自动滚动。不过,在提供的代码片段中,并没有直接使用HTML标准中的`<marquee>`标签,而是通过JavaScript结合CSS来模拟了类似的效果。接下来,我们...
该课件是关于marquee的讲解: 方向:<direction=#> #=left, right,up,down <marquee direction=left>从右向左移!</marquee> 方式:<bihavior=#> #=scroll, slide, ...<marquee behavior=alternate>来回走</marquee>
在网页设计中,`<marquee>` 标签是一种非常实用的元素,用于创建滚动文本或图像。尽管它不是HTML5的一部分,并且在现代Web开发中较少使用,但在某些特定场景下,它仍然可以发挥独特的作用。下面我们将详细探讨`...
2. **滚动速度**:当父级`<marquee>`和子级`<marquee>`具有不同的速度时,嵌套的`<marquee>`可能会以较慢的滚动速度显示,因为它们必须等待父级`<marquee>`完成一次循环才能开始下一次滚动。 3. **浏览器兼容性**:...
- **图片滚动**:这意味着`<marquee>`标签或插件可以应用于图片元素,让图片也能实现滚动效果。 - **无缝滚动**:这是一个设计上的概念,强调滚动过程的平滑和连续,没有明显的中断。 - **marquee**:这是HTML中的一...
<marquee>公告内容</marquee> ``` 默认情况下,内容会从左向右滚动。为了使内容从右向左滚动,我们可以添加`direction`属性并设置其值为`right`: ```html <marquee direction="right">公告内容</marquee> ``` ...
HTML标签marquee实现滚动效果,实现文字在网页中漂移的代码。
### 文字滚动代码详解:`<marquee>` 标签及其属性 在网页设计与开发过程中,有时我们需要实现一些简单的动态效果,例如滚动的文字或图片等。这些效果可以通过使用 HTML 的 `<marquee>` 标签来轻松实现。下面将详细...
`<marquee>`标签包含在一对尖括号`<marquee>...</marquee>`之间,你可以设置它的速度(scrollamount属性),滚动方向(direction属性)以及是否循环播放(loop属性)。例如: ```html <marquee scrollamount="3" ...
<marquee><img src="图片路径"></marquee> ``` 这段代码表示创建一个包含图片的基本滚动条。其中`<img src="图片路径">`用于指定图片的路径。 2. **向右滚动**: ```html <marquee direction="right"></...
<marquee>...</marquee>普通卷动 <marquee behavior=slide>...</marquee>滑动 <marquee behavior=scroll>...</marquee>预设卷动 <marquee behavior=alternate>...</marquee>来回卷动 <marquee direction=down>.....
- `<marquee></marquee>`:基本的跑马灯效果。 - **滑动**: - `<marquee behavior="slide"></marquee>`:元素只移动一次即停止。 - **预设卷动**: - `<marquee behavior="scroll"></marquee>`:默认行为,连续...
<marquee>滚动的内容</marquee> ``` #### 三、`<marquee>`标签的属性 - **behavior**: 控制内容滚动的行为,可选值有: - `slide`: 内容只滚动一次后停止。 - `scroll`: 内容循环滚动。 - `alternate`: 内容...
<marquee>文字或图片等内容</marquee> ``` ### 移动属性设置 #### 方向 (Direction) - **属性名**:`direction` - **可选值**: - `left`:从右向左移动。 - `right`:从左向右移动。 - `up`:从下向上移动。 ...
<marquee></marquee> ``` 此标签会创建一个默认从右到左滚动的文本或图像。 - **滑动**: ```html <marquee behavior="slide"></marquee> ``` 滑动模式下,元素会从一边移动到另一边然后停止。 - **预设卷动*...
* 预设卷动:<marquee behavior="alternate">...</marquee> * 向下卷动:<marquee direction="down">...</marquee> * 向上卷动:<marquee direction="up">...</marquee> * 向右卷动:<marquee direction="right">......