导航:首页 > 万维百科 > 网页设计滚动字体

网页设计滚动字体

发布时间:2020-12-06 04:05:23

1、Dreamweaver制作网页时的图片字体滚动效果怎么编写代码?

1.<marquee onMouseOver=this.stop() onMouseOut=this.start() scrollamount="2" direction="up" behavior="scroll">把你的内容放这里</marquee>这个代码是比较简单的示例,会有空白,如果不想有空白的话还是需要JS的。

2.<MARQUEE scrollAmount=1 scrollDelay=1 direction=right width=180 height=250><IMG src="图片网址" width=180 border=0> <IMG src="图片网址" width=180 border=0> <IMG src="图片网址" width=180 border=0> <IMG src="图片网址" width=180 border=0> <IMG src="图片网址" width=180 border=0> <IMG src="图片网址" width=180 border=0>
<DIV></DIV></MARQUEE></CENTER>

数值可以变换,数值的变换可以影响图片速度的滚动!图片滚动方向也可以换!都是简单的英语单词,大家在变换的时候应该没有问题

上下滚动图片代码:

代码:<CENTER>
<MARQUEE scrollAmount=1 scrollDelay=1 direction=up width=170 height=250>
<DIV align=center><IMG src="图片网址" width=300 border=0></DIV>
<DIV align=center><IMG src="图片网址" width=300 border=0></DIV>
<DIV align=center><IMG src="图片网址" width=300 border=0></DIV>
<DIV align=center><IMG src="图片网址" width=300 border=0></DIV>
<DIV align=center><IMG src="图片网址" width=300 border=0></DIV>
<DIV align=center><IMG src="图片网址" width=300 border=0></DIV></MARQUEE></CENTER>

注:direction方向 可UP可DOWN 宽高 可以换

2、请教:如何在网页中制作滚动图片和滚动字幕?谢谢!

/**
* 文字上下滚动
* @param flag 标识是否滚动
* @param fatherMarqueeContentId 父容器
* @param firMarqueeContentId 子容器1
* @param secMarqueeContentId 子容器2
* @param timeSpan 滚动时间间隔 默认为毫秒
*/
var MarqueeObj = function(fatherMarqueeContentId,firMarqueeContentId,secMarqueeContentId,timeSpan) {
this.flag = 0;
this.fatherMarqueeContentId = fatherMarqueeContentId;
this.firMarqueeContentId = firMarqueeContentId;
this.secMarqueeContentId = secMarqueeContentId;
this.timeSpan = timeSpan || 100;

//初始化,开启循环滚动
this.init = function() {
initScrollContentHeight(this);

//定时器
setInterval(marquee,this.timeSpan);

this.bindMouseOver();
this.bindMouseOut();
}

//开始
this.start = function() {
this.flag = 0;
}

//停止
this.stop = function() {
this.flag = 1;
}

var that = this;

//滚动核心函数
var marquee = function() {
if(that.flag == 1)
{
return;
}

if(document.getElementById(that.firMarqueeContentId).offsetHeight
<= document.getElementById(that.fatherMarqueeContentId).scrollTop) {
document.getElementById(that.fatherMarqueeContentId).scrollTop
-= document.getElementById(that.firMarqueeContentId).offsetHeight;
} else {
document.getElementById(that.fatherMarqueeContentId).scrollTop ++;
}
}

this.bindMouseOver = function() {
document.getElementById(this.fatherMarqueeContentId).onmouseover
= function() {
that.stop();
}
}

this.bindMouseOut = function() {
document.getElementById(this.fatherMarqueeContentId).onmouseout
= function() {
that.start();
}
}

/**初始化可滚动内容的高度
* 将可滚动内容的高度和父容器的高度比较,如果低于它,
* 就将可滚动内容的高度置为父容器的高度
* @param obj 可滚动对象
*/
var initScrollContentHeight = function(obj){
if(document.getElementById(obj.firMarqueeContentId).scrollHeight
< document.getElementById(obj.fatherMarqueeContentId).offsetHeight){
document.getElementById(obj.firMarqueeContentId).style.height
= document.getElementById(obj.fatherMarqueeContentId).offsetHeight + "px";

document.getElementById(obj.secMarqueeContentId).style.height
= document.getElementById(obj.fatherMarqueeContentId).offsetHeight + "px";
}

}

}

3、如何制作网页滚动文字

4.3.1 设置文字滚动

HTML技术中使文字滚动的方法是使用双标签<marquee></marquee>。在HTML代码中可使其作用区文字滚动,默认为从右到左,循环滚动。在D:web目录下创建网页文件,命名为mar.htm,编写代码如代码4.15所示。 

代码4.15 文字滚动的设置:mar.htm

<html>
<head>

<title>文字滚动的设置</title>
</head>
<body>

<font size="5" color="#cc0000">

文字滚动示例(默认):<marquee>做人要厚道</marquee>
</font>

</body>
</html> 

图4.15 设置文字滚动默认形式
从图4.15可得,在未设置宽度时,<marquee></marquee>标签是独占一行的。

4.3.2 设置文字滚动的方向

<marquee></marquee>标签的direction属性用于设置内容滚动方向,属性值有left、right、up、down,分别代表向左、向右、向上、向下,例如以下代码:

<marquee direction="left">做人要厚道</marquee>
<marquee
direction="right">做人要厚道</marquee>
<marquee
direction="up">做人要厚道</marquee>
<marquee
direction="down">做人要厚道</marquee>
4.3.3
设置文字滚动的速度和形式
设置文字滚动使用<marquee></marquee>标签,其属性说明如下。

— <marquee></marquee>标签的scrollamount属性用于设置内容滚动速度。

<marquee></marquee>标签的behavior
属性用于设置内容滚动方式,默认为scroll,即循环滚动,当其值为alternate时,内容将来回循环滚动。当其值为slide时,内容滚动一次即停止,不会循环。还有一个loop属性可设置其滚动循环次数,默认为没有限制。

— <marquee></marquee>标签的scrolldelay属性用于设置内容滚动的时间间隔。

<marquee></marquee>标签的bgcolor属性用于设置内容滚动背景色(类似于body的背景色设置)。

<marquee></marquee>标签的width 属性用于设置内容滚动背景宽度。

<marquee></marquee>标签的height属性用于设置内容滚动背景高度。

修改mar.htm网页文件,编写代码如代码4.16所示。

代码4.16 文字滚动的设置:mar.htm


<html>
<head>
<title>文字滚动的设置</title>

</head>
<body>
<font size="3" color="#cc0000">

文字滚动示例(默认):<marquee>做人要厚道</marquee>
文字滚动示例(向右):<marquee
direction="right" scrolldelay="500">做人要厚道</marquee>

文字滚动示例(向下,滚动方式为slide,速度为10):<marquee scrollamount="10"
behavior="slide">做人要厚道</marquee>

文字滚动示例(默认方向,滚动方式为alternate,循环3次,速度为2):<marquee scrollamount="2"
behavior="alternate" loop="3">做人要厚道</marquee>

文字滚动示例(向上,背景色为#CCFF66,设置了背景宽度和高度):<marquee direction="up"
bgcolor="#CCFF66" width="250" height="55">做人要厚道</marquee>

</font>
</body>
</html>

在浏览器地址栏输入http://localhost/mar.htm,浏览效果如图4.16所示。 

图4.16 文字滚动的不同形式

<marquee></marquee>的众多属性能非常方便地制作滚动文字,在后面的JavaScript学习中,读者将继续深化<marquee></marquee>标签的动态行为学习。  

4、如何制作网页设计中的滚动字条

网页中的滚动字可以使用marquee标签包裹在设置一些属性.可以设置方向和速度,这个百度可以找到文档

5、网页制作中滚动字幕怎么整?

可以用javascript实现 也可以用<marquee>滚动字幕内容</marquee> <marquee>标签还有很多属性 <marquee direction="up" id="mar" width="100%" height="220" onMouseOut="mar.start()" onMouseOver="mar.stop()" scrollAmount="1" scrollDelay="50" border="0" class="text"> <marquee> 比如这段代码 就是个上下滚动的字母 而且有鼠标悬停效果 javascript 网上有很多代码 你可以自己去找

6、网页设计字体滚动代码?

文字滚动是由<marquee></marquee>控制的。marquee的参数如下:

1、方向 <direction=#> #=left, right
如:<marquee direction=left>啦啦啦,我从右向左移!</marquee>
<marquee direction=right>啦啦啦,我从左向右移!</marquee>

2、方式 <bihavior=#> #=scroll, slide, alternate
如:<marquee behavior=scroll>啦啦啦,我一圈一圈绕着走!</marquee>
<marquee behavior=slide>啦啦啦,我只走一次就歇了!</marquee>
<marquee behavior=alternate>啦啦啦,我来回走耶!</marquee>

3、循环 <loop=#> #=次数;若未指定则循环不止(infinite)
如:<marquee loop=3 width=50% behavior=scroll>啦啦啦,我只走 3 趟哟!</marquee>
<marquee loop=3 width=50% behavior=slide>啦啦啦,我只走 3 趟哟!</marquee>
<marquee loop=3 width=50% behavior=alternate>啦啦啦,我只走 3 趟哟!</marquee>

4、速度 <scrollamount=#>
如:<marquee scrollamount=20>啦啦啦,我走得好快哟!</marquee>

5、延时 <scrolldelay=#>
如: <marquee scrolldelay=500 scrollamount=100>啦啦啦,我走一步,停一停!</marquee>

6、对齐方式(Align) <align=#> #=top, middle, bottom
如:<font size=6>
<marquee align=# width=400>啦啦啦,我会移动耶!</marquee>
</font>
7、底色 <bgcolor=#>
#=rrggbb 16 进制数码,或者是下列预定义色彩:
Black, Olive, Teal, Red, Blue, Maroon, Navy, Gray, Lime,
Fuchsia, White, Green, Purple, Silver, Yellow, Aqua

如:<marquee bgcolor=aaaaee>啦啦啦,我会移动耶!</marquee>

8、面积 <height=# width=#>
如:<marquee height=40 width=50% bgcolor=aaeeaa> 啦啦啦,我会移动耶!</marquee>

9、空白(Margins)<hspace=# vspace=#>

<marquee id="scrollarea" direction="up" scrolldelay="10" scrollamount="1" width="150" height="80" onmouseover="this.stop();" onmouseout="this.start();">
------------------------------------------------------------------------------------------------------------------------------

<marquee></marquee>

以下是一个最简单的例子:

代码如下:

<marquee><font size=+3 color=red>Hello, World</font></marquee>

下面这两个事件经常用到:

onMouseOut="this.start()" :用来设置鼠标移出该区域时继续滚动

onMouseOver="this.stop()":用来设置鼠标移入该区域时停止滚动

代码如下:

<marquee >onMouseOut="this.start()" :用来设置鼠标移出该区域时继续滚动 :用来设置鼠标移入该区域时停止滚动</marquee>

这是一个完整的例子:

代码如下:

<marquee align="left" behavior="scroll" bgcolor="#FF0000" direction="up" height="300" width="200" hspace="50" vspace="20" loop="-1" scrollamount="10" scrolldelay="100" >

这是一个完整的例子

</marquee>

该标签支持的属性多达11个:

align

设定<marquee>标签内容的对齐方式

absbottom:绝对底部对齐(与g、p等字母的最下端对齐)

absmiddle:绝对中央对齐

baseline:底线对齐

bottom:底部对齐(默认)

left:左对齐

middle:中间对齐

right:右对齐

texttop:顶线对齐

top:顶部对齐

7、怎么制作网页滚动字幕

<style>
marquee{
width:500px;
height:100px;
background:gray;
color:red;
}
</style>
<marquee direction="up" scrollamount="1">
滚动文字direction="up"向上滚,down向下滚,left向左,right向右;scrollamount="1"滚动速度。
width设置宽,height高,background背景颜色,color文字颜色
</marquee>

8、制作网页如何使字体滚动

http://www.gzsums.e.cn/webclass/html/marquee.html

以上是会动的文字网站。里面有代码。

基本语法

<marquee> ... </marquee>
<marquee>啦啦啦,我会移动耶!</marquee>
啦啦啦,我会移动耶!

文字移动属性的设置

方向 <direction=#> #=left, right
<marquee direction=left>啦啦啦,我从右向左移!</marquee> <P>
<marquee direction=right>啦啦啦,我从左向右移!</marquee>
啦啦啦,我从右向左移!

啦啦啦,我从左向右移!

方式 <bihavior=#> #=scroll, slide, alternate
<marquee behavior=scroll>啦啦啦,我一圈一圈绕着走!</marquee> <P>
<marquee behavior=slide>啦啦啦,我只走一次就歇了!</marquee> <P>
<marquee behavior=alternate>啦啦啦,我来回走耶!</marquee>
啦啦啦,我一圈一圈绕着走!

啦啦啦,我只走一次就歇了!

啦啦啦,我来回走耶!

循环 <loop=#> #=次数;若未指定则循环不止(infinite)
<marquee loop=3 width=50% behavior=scroll>啦啦啦,我只走 3 趟哟!</marquee> <P>
<marquee loop=3 width=50% behavior=slide>啦啦啦,我只走 3 趟哟!</marquee> <P>
<marquee loop=3 width=50% behavior=alternate>啦啦啦,我只走 3 趟哟!</marquee>
啦啦啦,我只走 3 趟哟!

啦啦啦,我只走 3 趟哟!

啦啦啦,我只走 3 趟哟!

速度 <scrollamount=#>
<marquee scrollamount=20>啦啦啦,我走得好快哟!</marquee>
啦啦啦,我走得好快哟!

延时 <scrolldelay=#>
<marquee scrolldelay=500 scrollamount=100>啦啦啦,我走一步,停一停!</marquee>
啦啦啦,我走一步,停一停!

外观(Layout)设置

对齐方式(Align) <align=#> #=top, middle, bottom
<font size=6>
<marquee align=# width=400>啦啦啦,我会移动耶!</marquee>
</font>
对齐上沿、中间、下沿。
啦啦啦,我会移动耶!对齐上沿。

啦啦啦,我会移动耶!对齐中间。

啦啦啦,我会移动耶!对齐下沿。

底色 <bgcolor=#>
#=rrggbb 16 进制数码,或者是下列预定义色彩:
Black, Olive, Teal, Red, Blue, Maroon, Navy, Gray, Lime,
Fuchsia, White, Green, Purple, Silver, Yellow, Aqua
<marquee bgcolor=aaaaee>啦啦啦,我会移动耶!</marquee>
啦啦啦,我会移动耶!

面积 <height=# width=#>
<marquee height=40 width=50% bgcolor=aaeeaa>
啦啦啦,我会移动耶!
</marquee>
啦啦啦,我会移动耶!

空白(Margins)<hspace=# vspace=#>
********************************************<br>
嗨,
<marquee hspace=20 vspace=20 width=150 bgcolor=ffaaaa align=middle>啦啦啦,我会移动耶!</marquee>
大家好!<br>
********************************************
********************************************
嗨, 啦啦啦,我会移动耶!大家好!
********************************************

与网页设计滚动字体相关的知识