导航:首页 > 图片大全 > dw如何实现图片随页面滑动

dw如何实现图片随页面滑动

发布时间:2023-08-21 09:51:54

㈠ 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:前后、上下的空行。

㈡ 在Dreamweaver中,怎么实现图片可以随便移动

在网页中插入一个apdiv,将图片插入到apdiv中。
切换到拆分视图,选中body标签,调出行为面板。
给body标签添加拖动ap元素行为,设置好参数后就可以实现效果
实例代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "地址/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="地址/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>123</title>
<style type="text/css">
<!--
#apDiv1 {
position:absolute;
left:338px;
top:27px;
width:168px;
height:123px;
z-index:1;
}
-->
</style>
<script type="text/javascript">
<!--
function MM_scanStyles(obj, prop) { //v9.0
var inlineStyle = null; var ccProp = prop; var dash = ccProp.indexOf("-");
while (dash != -1){ccProp = ccProp.substring(0, dash) + ccProp.substring(dash+1,dash+2).toUpperCase() + ccProp.substring(dash+2); dash = ccProp.indexOf("-");}
inlineStyle = eval("obj.style." + ccProp);
if(inlineStyle) return inlineStyle;
var ss = document.styleSheets;
for (var x = 0; x < ss.length; x++) { var rules = ss[x].cssRules;
for (var y = 0; y < rules.length; y++) { var z = rules[y].style;
if(z[prop] && (rules[y].selectorText == '*[ID"' + obj.id + '"]' || rules[y].selectorText == '#' + obj.id)) {
return z[prop];
} } } return "";
}
function MM_getProp(obj, prop) { //v8.0
if (!obj) return ("");
if (prop == "L") return obj.offsetLeft;
else if (prop == "T") return obj.offsetTop;
else if (prop == "W") return obj.offsetWidth;
else if (prop == "H") return obj.offsetHeight;
else {
if (typeof(window.getComputedStyle) == "undefined") {
if (typeof(obj.currentStyle) == "undefined"){
if (prop == "P") return MM_scanStyles(obj,"position");
else if (prop == "Z") return MM_scanStyles(obj,"z-index");
else if (prop == "V") return MM_scanStyles(obj,"visibility");
} else {
if (prop == "P") return obj.currentStyle.position;
else if (prop == "Z") return obj.currentStyle.zIndex;
else if (prop == "V") return obj.currentStyle.visibility;
}
} else {
if (prop == "P") return window.getComputedStyle(obj,null).getPropertyValue("position");
else if (prop == "Z") return window.getComputedStyle(obj,null).getPropertyValue("z-index");
else if (prop == "V") return window.getComputedStyle(obj,null).getPropertyValue("visibility");
}
}
}
function MM_dragLayer(objId,x,hL,hT,hW,hH,toFront,dropBack,cU,cD,cL,cR,targL,targT,tol,dropJS,et,dragJS) { //v9.01
//Copyright 2005-2006 Adobe Macromedia Software LLC and its licensors. All rights reserved.
var i,j,aLayer,retVal,curDrag=null,curLeft,curTop,IE=document.all;
var NS=(!IE&&document.getElementById); if (!IE && !NS) return false;
retVal = true; if(IE && event) event.returnValue = true;
if (MM_dragLayer.arguments.length > 1) {
curDrag = document.getElementById(objId); if (!curDrag) return false;
if (!document.allLayers) { document.allLayers = new Array();
with (document){ if (NS) { var spns = getElementsByTagName("span"); var all = getElementsByTagName("div");
for (i=0;i<spns.length;i++) if (MM_getProp(spns[i],'P')) allLayers[allLayers.length]=spns[i];}
for (i=0;i<all.length;i++) {
if (MM_getProp(all[i],'P')) allLayers[allLayers.length]=all[i];
}
} }
curDrag.MM_dragOk=true; curDrag.MM_targL=targL; curDrag.MM_targT=targT;
curDrag.MM_tol=Math.pow(tol,2); curDrag.MM_hLeft=hL; curDrag.MM_hTop=hT;
curDrag.MM_hWidth=hW; curDrag.MM_hHeight=hH; curDrag.MM_toFront=toFront;
curDrag.MM_dropBack=dropBack; curDrag.MM_dropJS=dropJS;
curDrag.MM_everyTime=et; curDrag.MM_dragJS=dragJS;
curDrag.MM_oldZ = MM_getProp(curDrag,'Z');
curLeft = MM_getProp(curDrag,'L');
if (String(curLeft)=="NaN") curLeft=0; curDrag.MM_startL = curLeft;
curTop = MM_getProp(curDrag,'T');
if (String(curTop)=="NaN") curTop=0; curDrag.MM_startT = curTop;
curDrag.MM_bL=(cL<0)?null:curLeft-cL; curDrag.MM_bT=(cU<0)?null:curTop-cU;
curDrag.MM_bR=(cR<0)?null:curLeft+cR; curDrag.MM_bB=(cD<0)?null:curTop+cD;
curDrag.MM_LEFTRIGHT=0; curDrag.MM_UPDOWN=0; curDrag.MM_SNAPPED=false; //use in your JS!
document.onmousedown = MM_dragLayer; document.onmouseup = MM_dragLayer;
if (NS) document.captureEvents(Event.MOUSEDOWN|Event.MOUSEUP);
} else {

㈢ DW里如何实现这种图片滚动的效果

这个效果需要运用到javascript才可以进行实现这种图片的滚动。而html里面的marquee标签只能进行左右滚动,并且进行设置相应的滚动方式,这个标签相对来说用的就比较简单了。
例如:<marquee scrollAmount=2 width=300>欢迎来到魔人牛牛新浪博客!</marquee>
这里面可以有相应的参数:
marquee 参数:
BGColor:滚动文本框的背景颜色。
Direction:滚动方向设置,可选择Left(从右到左)、Rightup(从下到上)和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怎么做图片滚动栏

<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设计网页中,像这种让图片在一个方框内自己滚动的效果怎么做

图片轮播。
需要用到js,大致就是设置定时器,然后把图片横向拼接在一起,只显示方框内的,方框外的用hidden隐藏,然后每过一段时间进行向左平移一个图片的距离,走完全部之后在进行无限循环

阅读全文

与dw如何实现图片随页面滑动相关的资料

热点内容
性感美女流氓动态图片 浏览:553
男生房间设计图片 浏览:322
word复制图表变图片线段缺失 浏览:348
伤感女生的图片大全大图 浏览:419
美女与野兽鹿中箭变美女的图片 浏览:400
海马车价格及图片大全 浏览:629
超帅的男生图片学霸 浏览:738
100件衣服图片 浏览:629
窒息动漫图片 浏览:842
时风拖拉机404图片价格 浏览:161
天然绿松石图片及价格 浏览:690
qq头像中学男生图片 浏览:411
cdr图片怎么做透视 浏览:6
word图片加密 浏览:275
有字的图片关于男生 浏览:992
逆行背影图片男生 浏览:34
翡翠饰品价格及图片 浏览:66
可爱红狐图片 浏览:937
ps怎么看图片颜色不一样 浏览:715
简单很胖的图片 浏览:819