导航:首页 > 动漫图片 > dw图片滚动效果怎么做

dw图片滚动效果怎么做

发布时间:2022-01-09 09:27:49

❶ DW制作滚动图片

<body>
<div id="zd" style="height:400px; width:100px;overflow:hidden;" onmouseover="stoper()" onmouseout="starer()">
<div id="div1" style="height:400px; width:100px;">
<img src="001.jpg" width="100" height="100" />
<img src="002.jpg" width="100" height="100" />
<img src="003.jpg" width="100" height="100" />
<img src="004.jpg" width="100" height="100" />
</div>
<div id="div2" style="height:400px; width:100px;">
</div>
</div>
<script type="text/javascript">
div2.innerHTML=div1.innerHTML;
var t;
function js()
{
zd.scrollTop++;
if(zd.scrollTop>=div1.offsetHeight)
{
zd.scrollTop-=div1.offsetHeight;
}
}
function starer()
{
t=setInterval(js,1)
}
function stoper()
{
clearInterval(t);
}
starer();

/* t=setInterval(js,1)
document.getElementById("zd").onmouseover=function(){clearInterval(t)}
document.getElementById("zd").onmouseout=function(){t=setInterval(js,1)} 这是用JS写的另一种让鼠标经过、离开时图片停止、滚动的方法*/
</script>
</body>

如何在Dreamweaver中设置图片滚动

方法如下:
1、选中要插入滚动的文字或图片;
2、单击“插入——标签”;
3、在该对话框中选择marquee标签;
4、在代码中设置为:<marquee onmouseover=this.stop(); onmouseout=this.start(); direction=left scrollamount=1 height=14 scrolldelay=1 width=500>
滚动内容文字也可以 插入表格也可以,图片也可以。

❸ 怎样在Dw中做这种图片滚动的方法

先学学javascript在做吧

❹ Dreamweaver 怎么制作滚动图片 左右滚动的

做跑马灯和滚动字幕用的
基本语法
<marquee> ... </marquee>
移动属性的设置 ,这种移动不仅仅局限于文字,也可以应用于图片,表格等等
方向
<direction=#> #=left, right ,up ,down <marquee
direction=left>从右向左移!</marquee>
方式
<bihavior=#> #=scroll, slide, alternate <marquee
behavior=scroll>一圈一圈绕着走!</marquee>
<marquee behavior=slide>只走一次就歇了!</marquee>
<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>
<marquee loop=3 width=50% behavior=alternate>只走 3 趟!</marquee>
速度
<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=#>
<marquee hspace=20 vspace=20 width=150 bgcolor=ffaaaa
align=middle>面积!</marquee>

❺ DW中如何制作这种图片循环滚动

滚动文字
marquee 参数:
BGColor:滚动文本框的背景颜色。
Direction:滚动方向设置,可选择Left、Right、up和down。
scrolldelay:每轮滚动之间的延迟时间,越大越慢。

scrollamount:一次滚动总的时间量,数字越小滚动越慢。
Behaviour:滚动的方式设置,三种取值:Scroll(循环滚动) lide(单次滚动)、Alternate(来回滚动)。

Align:文字的对齐方式设置。可选择Middle(居中)、Bottom(居下)还是Top(居上)。
Width:滚动文本框的宽度,输入一个数值后从后面的单选框选择in Pixels(按像素)或是in Percent(按百分比)。

Height:滚动文本框的高度,输入一个数值后从后面的单选框选择in Pixels(按像素)或是in Percent(按百分比)。
loop:滚动次数。默认为infinite
hspace、vspace:前后、上下的空行。

❻ 图片循环滚动的效果怎么用dw做啊

js代码就可以实现!用dw无法做无缝滚动!

❼ 怎样用dreamweaver制作滑动切换图片效果

在DreamWeaver中实现滑动切换图片效果,可以使用 ‘鼠标经过图像’ 功能来实现,也可以用CSS控制来实现。
现在具体讲一下 CSS控制实现 图片切换效果!
首先制作一个 ID为abc 的div 宽度50px; 高度50px; 在abc里面随便打一个字 设置一个空链接。
然后定义 abc 宽度50px; 高度50px; a标签的块形式 代码如下:

<styletype="text/css">
<!--
#abca{
height:50px;
width:50px;
display:block;
}
-->
</style>


<!--注意上面才是CSS代码,下面是div-->
<div id="abc"><href="#">字体</a></div>
然后设置 div的背景图片 比如图片名为 bj.gif
CSS代码变为:

<styletype="text/css">
<!--
#abca{
background-image:url(bj.gif);
height:50px;
width:50px;
display:block;
}
-->
</style>


最后 设置鼠标经过的样式 比如 鼠标经过图片为 bjj.gif
CSS代码 变为如下:

<styletype="text/css">
<!--
#abca{
background-image:url(bj.gif);
height:50px;
width:50px;
display:block;
}
#abca:hover{
background-image:url(bjj.gif);
}
-->
</style>

❽ dw怎么做图片滚动栏

<marquee behavior="scroll" direction="left" loop="infinite" scrollamount="3"> <img src="01.jpg" width="100" height="75"> <img src="02.jpg" width="100" height="75"> <img src="03.jpg" width="100" height="75"> <img src="04.jpg" width="100" height="75"> <img src="05.jpg" width="100" height="75"> <img src="16.jpg" width="100" height="75"> </marquee> 使用说明: behavior="scroll" 滚动的方式,scroll 为一圈一圈绕着走。 scrollAmount=3 滚动的速度,数值越大,速度越快,反之则慢。 direction=left 滚动的方向 left 是由右向左 up 是向上。 onmouseover='this.stop()' 有止停功能,this.stop() 鼠标放上就停止。 onmouseout='this.start()' 有止停功能,this.start() 鼠标离开就滚动。

❾ dw中怎么做滚动图片一直向前滚

在需要的地方插入这个代码
<marquee behavior="scroll" direction="up" onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" ><img src="图片路径和名称1" /><img src="图片路径和名称2" /><img src="图片路径和名称3" /></marquee>
那个up,即使向上,你可以设置left等。

❿ dreamweaver中图片滚动

这个叫"图片无缝滚动",代码如下,你自己调试一下哦:
<div id="demo" style="overflow:hidden;height:500px;width:120px; border:1px solid #dde5bc; overflow:hidden;float:left">
<div id=demo1>
<img src="images/js01.gif" width="120" height="120">
<img src="images/js02.gif" width="120" height="120">
<img src="images/js03.gif" width="120" height="120">
<img src="images/js04.gif" width="120" height="120">
<img src="images/js05.gif" width="120" height="120">
<img src="images/js06.gif" width="120" height="120">
<img src="images/js07.gif" width="120" height="120">
<img src="images/js08.gif" width="120" height="120">
<img src="images/js09.gif" width="120" height="120">

</div>
<div id=demo2></div>
</div>
<script>
var speed=40
var demo=document.getElementById("demo");
var demo2=document.getElementById("demo2");
var demo1=document.getElementById("demo1");
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetTop-demo.scrollTop<=0)
demo.scrollTop-=demo1.offsetHeight
else{
demo.scrollTop++
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>

阅读全文

与dw图片滚动效果怎么做相关的资料

热点内容
冰透短指甲简单款式图片 浏览:899
婵动漫图片 浏览:770
半脸动漫图片大全 浏览:836
小清新背影图片小女孩 浏览:858
九月动漫图片 浏览:392
图片美图高清简单 浏览:25
女生的小葡萄图片 浏览:376
女孩背吉他动漫背影图片 浏览:861
百合图片大全大图简单漂亮 浏览:376
金杯海狮价格图片大全 浏览:603
最简单的书怎么画图片 浏览:406
稻壳word设置图片格式在哪里 浏览:670
最美刘海发型图片 浏览:439
女生短发烫卷发翻车图片 浏览:361
2019可爱小猪图片 浏览:84
白色长腿可爱图片 浏览:9
海澡卷发型图片 浏览:904
钱币盒子价格和图片 浏览:233
word中四张很大图片如何拼一起 浏览:880
和田玉绿色价格和图片 浏览:934