A. 網頁製作怎樣讓圖片滾動
這個軟體還真沒用過 直接加段代碼不行嗎?用 marqueemarquee 參數: 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:前後、上下的空行。 滾動字幕在FrontPage的組件里有,但是FrontPage這個軟體只能支持單行文字,一出現多行文字它就無能為力了,而且它只能支持一行滾動!(如果出現只能滾動一行的情況,解決辦法是把這段代碼嵌入到JavaScript的document.write裡面,請看下面例d的詳細說明)Dreamweaver也只能用編寫HTML代碼的方法。所以強烈建議用記事本打開網頁源代碼來編輯。 建立第一個滾動字幕。代碼: <marquee scrollAmount=2 width=300靚麗風景線</marquee
B. 如何在靜態網頁中製作背景中的一幅圖片隨流輪的滾動而上下滾動
把style里的屬性設置一下,那個屬性叫什麼我忘了,你用查查看
C. 網頁製作圖片滾動
<marqueedirection=upheight=75onMouseOut=this.start()onMouseOver=this.stop()scrollamount=1scrolldelay=100width="180"id=MARQUEE1>滾動內容</marquee>
Direction參數可設置:updownleftright(控制滾動方向)
Scrolldelay=100(100就是速度,值越大滾動越快……)
onMouseOut=this.start()........滑鼠移出狀態滾動
onMouseOver=this.stop().........滑鼠經過時停止滾動
基本語法
<marquee>...</marquee>
移動屬性的設置,這種移動不僅僅局限於文字,也可以應用於圖片,表格等等
方向
<direction=#>#=left,right,up,down<marqueedirection=left>從右向左移!</marquee>
方式
<bihavior=#>#=scroll,slide,alternate<marqueebehavior=scroll>一圈一圈繞著走!</marquee>
<marqueebehavior=slide>只走一次就歇了!</marquee>
<marqueebehavior=alternate>來回走</marquee>
循環
<loop=#>#=次數;若未指定則循環不止(infinite)<marqueeloop=3width=50%behavior=scroll>只走3趟</marquee><P>
<marqueeloop=3width=50%behavior=slide>只走3趟</marquee>
<marqueeloop=3width=50%behavior=alternate>只走3趟!</marquee>
速度
<scrollamount=#><marqueescrollamount=20>啦啦啦,我走得好快喲!</marquee>
延時
<scrolldelay=#><marqueescrolldelay=500scrollamount=100>啦啦啦,我走一步,停一停!</marquee>
外觀(Layout)設置
對齊方式(Align)
<align=#>#=top,middle,bottom<fontsize=6>
<marqueealign=#width=400>啦啦啦,我會移動耶!</marquee>
</font>
底色
<bgcolor=#>#=rrggbb16進制數碼,或者是下列預定義色彩:
Black,Olive,Teal,Red,Blue,Maroon,Navy,Gray,Lime,
Fuchsia,White,Green,Purple,Silver,Yellow,Aqua<marqueebgcolor=aaaaee>顏色!</marquee>
面積
<height=#width=#><marqueeheight=40width=50%bgcolor=aaeeaa>面積!</marquee>
空白
(Margins)<hspace=#vspace=#>
<marqueehspace=20vspace=20width=150bgcolor=ffaaaaalign=middle>面積!</marquee>
D. 如何在HTML中實現圖片的滾動效果
素材的准備。為了更好的表現網站的風格和特色,具備一些更富表現力和吸引力的圖片是必不可少的。同理,小編也准備了一些與網頁主題密切相關的圖片,用於做為實現圖片滾動效果的素材。
打開Dreamweaver8,新建一網頁文件,並保存為名為「index.html"文件。
切換至代碼編輯界面,輸入如下代碼:
<body><div id="photo-list"> <ul id="scroll">
<li><a href="#"><img src="images/1.jpg" width="100px" height="100px" alt=""/></a></li>
<li><a href="#"><img src="images/2.jpg" width="100px" height="100px" alt=""/></a></li>
<li><a href="#"><img src="images/3.jpg" width="100px" height="100px" alt=""/></a></li>
<li><a href="#"><img src="images/4.jpg" width="100px" height="100px" alt=""/></a></li>
<li><a href="#"><img src="images/5.jpg" width="100px" height="100px" alt=""/></a></li>
<li><a href="#"><img src="images/6.jpg" width="100px" height="100px" alt=""/></a></li> </ul> </div></body>
新建一CSS樣式表文件,並將該文件保存到與「index.html」相同的目錄下,文件名稱為「MyStyle.css"。
在新建的樣式表文件"MyStyle.css」文件中輸入如下代碼:
* { padding:0; margin:0;} /*設置所有對像的內邊距為0*/
body { text-align:center;} /*設置頁面居中對齊*/
#photo-list {
/* 6張圖片的寬度(包含寬度、padding、border、圖片間的留白)
計算:6*(100+2*2+1*2+9) - 9
之所以減去9是第6張圖片的右邊留白 */
width:681px;
/* 圖片的寬度(包含高度、padding、border)
計算:100+2*2+1*2 */
height:106px;
margin:50px auto;
overflow:hidden; /*溢出部份將被隱藏*/
border:1px dashed #ccc;
}
#photo-list ul { list-style:none;}
#photo-list li { float:left; padding-right:9px;}
#photo-list img { border:1px solid #ddd; background:#fff; padding:2px;}
在網頁文件"index.html"中添加對該樣式表的引用:
<link rel="stylesheet" type="text/css" href="MyStyle.css">
新建一個JS文件,並將該文件另存為「MoveEffect.js"。
在」MoveEffect.js「文件中輸入如下所示代碼:
var id = function(el) { return document.getElementById(el); },
c = id('photo-list');
if(c) {
var ul = id('scroll'),
lis = ul.getElementsByTagName('li'),
itemCount = lis.length,
width = lis[0].offsetWidth, //獲得每個img容器的寬度
marquee = function() {
c.scrollLeft += 2;
if(c.scrollLeft % width <= 1){ //當 c.scrollLeft 和 width 相等時,把第一個img追加到最後面
ul.appendChild(ul.getElementsByTagName('li')[0]);
c.scrollLeft = 0;
};
},
speed = 50; //數值越大越慢
ul.style.width = width*itemCount + 'px'; //載入完後設置容器長度
var timer = setInterval(marquee, speed);
c.onmouseover = function() {
clearInterval(timer);
};
c.onmouseout = function() {
timer = setInterval(marquee, speed);
};
};
然後在主頁文件"index.html」中添加對該「MoveEffect.js」文件的引用。
<script type="text/javascript" src="MoveEffect.js"></script>
打開「index.html」網頁文件,最終效果如果所示:
E. 靜態網頁里的圖片滾動代碼誰知道!!!
圖片滾動代碼 (從右向左滾動) <marquee scrollamount=1 scrolldelay=3 valign=middle behavior="scroll"> <img border="0" src=" http://要滾動的圖片地址1"> <img border="0" src=" http://要滾動的圖片地址2"> </marquee> 圖片滾動代碼 (從下往上滾動) <marquee onMouseOver="this.stop()" onMouseOut="this.start()" align=center direction=up scrollamount=1 scrolldelay=3 valign=middle behavior="scroll"> <img border="0" src=" http://要滾動的圖片地址1"> <img border="0" src=" http://要滾動的圖片地址2"> </marquee> 如果你在QQ空間用的話,可能不行,因為現在的QQ空間不給用代碼了,應用到網頁中是可以的...
F. 靜態網頁圖片滾動問題
把你上面的代碼發一下。
另外,不看代碼我猜的可能是:命名沖突了,你引用的js可能無法同時匹配2個相同的類/id名(你自己都說是復制下來的了)
G. 如何實現網頁圖片滾動播放
1、網頁圖片滾動一般都是網路上查找jq/js插件,引入到自己的html代碼里頭,或者是里頭本身寫好的例子,修改好數據源圖片,運行調試即可
2、如果是不考慮圖片首尾無縫滾動的話,你還可以使用marquee.
這個是html自帶滾動標簽,也可以實現滑鼠移入停止,移開開始滾動等等,如下:
<marquee direction="up" onmouseover="this.stop();" onmouseout="this.start();"> <img src="xxx.jpg" /> <img src="xxx.jpg" /> <img src="xxx.jpg" /> <img src="xxx.jpg" />
</marquee>
具體其他更多屬性用法,可以查找下這個標簽的用法,
提供個參考資料:http://www.jb51.net/article/724.htm
H. 網頁中的圖片滾動效果是怎麼實現的啊
設置層高,比如position:absoulute; z-index:999; top:100px; right:0px;
示例用法:
<html>
<head><title>123</title></head>
<body style="width:1024px; height:2000px;">
<p style="width:100px; height:100px; background-color:red;position:fixed; z-index:999; top:100px; right:0px;">
<img src="圖片地址" />
<p>
</body>
</html>
圖片中的P標簽里有圖片,我這里設置P區塊為寬高各100,用position:fixed定位,距離頂部100像素,右邊0像素漂浮著,z-index:999就是層高,可以理解為層高越高就可以漂浮在網頁上面。
效果如下:
不管如何滾動網頁滾動條 上下翻 左右翻都一直在屏幕距離頂部100像素,右邊0像素漂浮著。
I. 靜態網頁中相冊的左右滾動怎麼做
marquee 雖然能實現,但沒JS的好 以下是無縫滾動 <div id="demo0" style="overflow: hidden; width:685px; margin:0 auto;"> <table cellpadding="0" align="left" border="0" cellspacing="0"> <tr> <td id="demo1" valign="top" style="height: 134px"> <table cellpadding="0" cellspacing="0"> <tr> <td> <table border="0" cellpadding="20" cellspacing="20" > <tr> <td><img src="" /></td> <td><img src="" /></td> <td><img src="" /></td> <td><img src="" /></td> <td><img src="" /></td> <td><img src="" /></td> </tr> </table> </td> </tr> </table> </td> <td id="demo2" valign="top" style="height: 134px"></td> </tr> </table> </div> <!-- 滾動Javasript --> <script type="text/javascript" language="JavaScript"> //調用向左滾動函數 toleft("demo0","demo1","demo2",1,"") function $(id){return document.getElementById(id)} /** 向左滾動時調用的函數 demo1、demo2包含在demo中 speed是圖片滾動的速度 flag一個網頁內有多個時設置為不同的任意字元。 */ function toleft(demo,demo1,demo2,speed,flag){ demo=$(demo);demo1=$(demo1);demo2=$(demo2) demo2.innerHTML=demo1.innerHTML function Marquee(){ if(demo2.offsetWidth-demo.scrollLeft<=0){ demo.scrollLeft-=demo1.offsetWidth } else{ demo.scrollLeft++ } } flag=setInterval(Marquee,speed) demo.onmouseover=function(){clearInterval(flag);} demo.onmouseout=function(){flag=setInterval(Marquee,speed);} } </script>
希望採納