Ⅰ html怎麼用marquee無縫滾動和左右滾動
這個是屬於html的標簽，沒辦法去除無縫，要通過js來處理
Ⅱ marquee 如何讓調用的內容無縫滾動
那個要用到JAVASCRIPT。你到網上查一下。叫不間斷滾動代碼！
Ⅲ html里marquee應該怎麼改它的間歇性啊就是讓它不停的滾動。
頁面的自動滾動效果，可由javascript來實現，但是今天無意中發現了一個html標簽 - <marquee></marquee>可以實現多種滾動效果，無需js控制。
使用標記不僅可以移動文字，也可以移動圖片，表格等.
語法：<marquee>...</marquee>； 說明：在標記之間添加要進行滾動的內容。
重要屬性：
1.滾動方向direction（包括4個值：up、 down、 left和 right）
語法：<marquee direction="滾動方向">...</marquee>
2.滾動方式behavior（scroll:循環滾動，默認效果； slide:只滾動一次就停止； alternate:來回交替進行滾動）
語法：<marquee behavior="滾動方式">...</marquee>
3.滾動速度scrollamount（滾動速度是設置每次滾動時移動的長度，以像素為單位）
語法：<marquee scrollamount="5">...</marquee>
4.滾動延遲scrolldelay（設置滾動的時間間隔，單位是毫秒）
語法：<marquee scrolldelay="100">...</marquee>
5.滾動循環loop（默認值是-1，滾動會不斷的循環下去）
語法：<marquee loop="2">...</marquee>
6.滾動范圍width、height
7.滾動背景顏色bgcolor
8.空白空間hspace、vspace
代碼示例：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title>
</head>
<body>
<div>
<marquee direction="up" behavior="scroll" scrollamount="1" scrolldelay="0" loop="-1" width="1000" height="50" bgcolor="#0099FF" hspace="10" vspace="10">
指整個Marquee對齊方式; (2)behavior:設置滾動的方式: scroll:表示由一端滾動到另一端,會重復,缺陷是不能無縫滾動。 slide:表示由一段滾動到另一端,不會重復...
</marquee>
</div>
</body>
</html>
from
http://www.cnblogs.com/zzuIvy/p/marqueeTest_1.html
Ⅳ html/js 使用marquee標簽，怎麼可以做到無縫滾動
需要js的配合一下是一個非常好用的一個html代碼,可以試試
<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN"
"http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<HTMLxmlns="http://www.w3.org/1999/xhtml">
<HEAD>
<TITLE>一行多列文字循環滾動帶停頓-</TITLE>
<metaname="keywords"content="網頁特效"/>
<metaname="description"content=""/>
<METAhttp-equiv=Content-Typecontent="text/html;charset=utf-8">
<styletype="text/css">
ul{height:200px;
padding-right:0px;
padding-left:0px;
padding-bottom:0px;
margin:0px;
padding-top:0px
}
#announcement{
width:300px;
height:200px;
background:url(img/menu_bg.gif)repeat;
overflow:hidden;
}
#announcementdiv{
border:#e6e6e61pxsolid;
padding:0px10px0px10px;
overflow-y:hidden;
line-height:24px;
height:100px;
}
#announcementli{
font-size:12px;
float:left;
list-style-type:none;
margin-right:20px;
padding-left:10px;
background:url(img/arrow_right.gif)no-repeat0px50%;
white-space:nowrap
}
#announcementa{
text-decoration:none;
}
#announcementa:hover{
text-decoration:underline;
}
</style>
</HEAD>
<BODY>
<DIVid="announcement"onMouseOver="if(!anncount){clearTimeout(annst);annst=0}"onMouseOut="if(!annst)annst=setTimeout('announcementScroll()',anndelay);">
<DIVid="scrbody">
<ul>
<li>
<ahref="#"target="_blank">jQuery類似騰訊網的圖片幻燈特效（可自動播放）</a>
</li>
<li>
<ahref="#/JS"target="_blank">VB版增強型Windows任務管理器</a>
</li>
<li>
<ahref="#/JS/texiao"target="_blank">JQueryTip多風格鏈接提示框</a>
</li>
<li>
<ahref="#/JS/ad"target="_blank">VC++動態載入、調用smtp.dll發郵件示例</a>
</li>
<li>
<ahref="#/html+css"target="_blank">++連連看游戲源碼附外掛</a>
</li>
<li>
<ahref="#/"target="_blank">基於API的VBHOOK鉤子攔截程序</a>
</li>
<li>
<ahref="#/"target="_blank">VB操作系統的一些常用小技巧集</a>
</li>
<li>
<ahref="#/js"target="_blank">xTree標準的WEB菜單樹（樹形菜單）</a>
</li>
</ul>
</DIV>
</DIV>
<scripttype="text/javascript">
function$(id)
{
returndocument.getElementById(id);
}
varanndelay=3000;
varanncount=0;
varannheight=24;
varannst=0;
functionannouncementScroll()
{
if(!annst)
{
$('scrbody').innerHTML+='<brstyle="clear:both"/>'+
$('scrbody').innerHTML;
$('scrbody').scrollTop=0;
if($('scrbody').scrollHeight>annheight*3)
{
annst=setTimeout('announcementScroll()',anndelay);
}
else
{
$('announcement').onmouseover=$('announcement').onmouseout=null;
}
return;
}
if(anncount==annheight)
{
if($('scrbody').scrollHeight-annheight<=$('scrbody').scrollTop)
{
$('scrbody').scrollTop=$('scrbody').scrollHeight/2-annheight;
}
anncount=0;
annst=setTimeout('announcementScroll()',anndelay);
}
else
{
$('scrbody').scrollTop++;
anncount++;
annst=setTimeout('announcementScroll()',10);
}
}
announcementScroll();
</script>
</BODY>
</HTML>
Ⅳ jquery marquee怎麼無縫向左滾動
無縫滾動：
<MARQUEE behavior="scroll" contenteditable="true" onstart="this.firstChild.innerHTML+=this.firstChild.innerHTML;" scrollamount="3" width="100"><SPAN unselectable="on"></SPAN></MARQUEE>
左右滾動：
<marquee direction="right" behavior="alternate"><font size=30 color="red">我會左內右滾動哦容</font></marquee>
Ⅵ DW中如何使用marquee代碼製作無縫滾動
不用js，達不到那種效果。
Ⅶ 怎麼實現marquee標簽的向上無縫滾動
<html>
<head>
<title>TODOsupplyatitle</title>
<metacharset="UTF-8">
<metaname="viewport"content="width=device-width">
</head>
<body>
<style>
#marqueep{height:30px;line-height:30px;margin:0}
</style>
<divstyle="height:30px;overflow:hidden;">
<divid='marquee'>
<p>第1段</p>
<p>第2段</p>
<p>第3段</p>
<p>第4段</p>
<p>第5段</p>
</div>
</div>
<script>
(function(){
varmarquee=document.getElementById('marquee');
varoffset=0;
varscrollheight=marquee.offsetHeight;
varfirstNode=marquee.children[0].cloneNode(true);
marquee.appendChild(firstNode);//還有這里
setInterval(function(){
if(offset==scrollheight){
offset=0;
}
marquee.style.marginTop="-"+offset+"px";
offset+=1;
},50);
})();
</script>
</body></html>
<divid="demo"style="overflow:hidden;height:168px;width:300px;">
<divid="demo1">
<!--此處放要顯示的內容-->
</div>
<divid="demo2"></div>
</div>
<scriptlanguage="javascript">
varspeed=30;
vardemo2=document.getElementByIdx_x("demo2");
vardemo1=document.getElementByIdx_x("demo1");
vardemo=document.getElementByIdx_x("demo");
demo2.innerHTML=demo1.innerHTML;
functionMarquee(){
if(demo2.offsetTop-demo.scrollTop<=0){
demo.scrollTop-=demo1.offsetHeight;
}
else{
demo.scrollTop++;
}
}
varMyMar=setInterval(Marquee,speed);
demo.onmouseover=function(){clearInterval(MyMar)};
demo.onmouseout=function(){MyMar=setInterval(Marquee,speed)};
</script>
——【仙】墨紙
Ⅷ asp中marquee 無縫滾動
<%
set rsm=server.createobject("adodb.recordset")
rsm.open "select * from [cf] order by cf desc",connb,1,1
%><script type="text/javascript">
document.write('<table align=center width=480 border=0 cellpadding=0 cellspacing=0 style=BORDER-LEFT: #cccccc 1px solid;BORDER-RIGHT: #cccccc 1px solid>');
document.write('<tr><td width=480 height=125 align=center class=border01 bgcolor=#FFFFFF>');
document.write('<div id=demo style=overflow:hidden;width:480;align=center>');
document.write('<table border=0 align=center cellpadding=0 cellspacing=0 cellspace=0 >');
document.write('<tr><td valign=top bgcolor=ffffff id=marquePic1> ');
document.write('<table width=480 border=0 cellspacing=0 cellpadding=0>');
document.write('<tr align=center> ');
document.write('<% do while not rsm.eof p=p+1%><td><%if not rsm("cf")="" then%><img src="<%=rsm("cf")%>" height="125" border="1" style="border-color:#ffffff;"><%else%><%end if%></td>');
document.write('<%if p=10 then exit do
rsm.movenext
loop%><%rsm.close%>');
document.write('</tr></table></td>');
document.write('<td id=marquePic2 valign=top></td></tr></table></div></td></tr></table>');
var speed=60
marquePic2.innerHTML=marquePic1.innerHTML
function Marquee(){
if(demo.scrollLeft>=marquePic1.scrollWidth){
demo.scrollLeft=0
}else{
demo.scrollLeft++
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>
我是我在用的!沒有問題很穩定,你改一下吧!
Ⅸ <marquee>能不能實現圖片無間斷滾動
在html中使得圖片滾動方法很多，其中marquee使用的最多，marquee圖片連續不間斷滾動，可以向上、向下、向左、向右。通過以下四段不同方向滾動的代碼，可以使得圖片向不各個方向進行滾動。這里給出向左滾動的具體的事例
在看具體代碼之前，了解一下對象的幾個的屬性：
innerHTML: 設置或獲取位於對象起始和結束標簽內的 HTML
scrollHeight: 獲取對象的滾動高度。
scrollLeft: 設置或獲取位於對象左邊界和窗口中目前可見內容的最左端之間的距離
scrollTop: 設置或獲取位於對象最頂端和窗口中可見內容的最頂端之間的距離
scrollWidth: 獲取對象的滾動寬度
offsetHeight: 獲取對象相對於版面或由父坐標 offsetParent 屬性指定的父坐標的高度
offsetLeft: 獲取對象相對於版面或由 offsetParent 屬性指定的父坐標的計算左側位置
offsetTop: 獲取對象相對於版面或由 offsetTop 屬性指定的父坐標的計算頂端位置
offsetWidth: 獲取對象相對於版面或由父坐標 offsetParent 屬性指定的父坐標的寬度
圖片向上無縫滾動
以下是具體代碼：
<style type="text/css">
<!--
#demo {
background: #FFF;
overflow:hidden;
border: 1px dashed #CCC;
height: 100px;
text-align: center;
float: left;
}
#demo img {
border: 3px solid #F2F2F2;
display: block;
}
-->
</style>
<div id="demo">
<div id="demo1">
<a href="#"><img src="/66php.gif" border="0" /></a>
<a href="#"><img src="66php.gif" border="0" /></a>
<a href="#"><img src="66php.gif" border="0" /></a>
<a href="#"><img src="66php.gif" border="0" /></a>
<a href="#"><img src="66php.gif" border="0" /></a>
</div>
<div id="demo2"></div>
</div>
<script>
<!--
var speed=10; //數字越大速度越慢
var tab=document.getElementById("demo");
var tab1=document.getElementById("demo1");
var tab2=document.getElementById("demo2");
tab2.innerHTML=tab1.innerHTML; //克隆demo1為demo2
function Marquee(){
if(tab2.offsetTop-tab.scrollTop<=0)//當滾動至demo1與demo2交界時
tab.scrollTop-=tab1.offsetHeight //demo跳到最頂端
else{
tab.scrollTop++
}
}
var MyMar=setInterval(Marquee,speed);
tab.onmouseover=function() {clearInterval(MyMar)};//滑鼠移上時清除定時器達到滾動停止的目的
tab.onmouseout=function() {MyMar=setInterval(Marquee,speed)};//滑鼠移開時重設定時器
-->
</script>
圖片向下無縫滾動
以下是具體代碼：
<style type="text/css">
<!--
#demo {
background: #FFF;
overflow:hidden;
border: 1px dashed #CCC;
height: 100px;
text-align: center;
float: left;
}
#demo img {
border: 3px solid #F2F2F2;
display: block;
}
-->
</style>
向下滾動
<div id="demo">
<div id="demo1">
<a href="#"><img src="/66php.gif" border="0" /></a>
<a href="#"><img src="66php.gif" border="0" /></a>
<a href="#"><img src="66php.gif" border="0" /></a>
<a href="#"><img src="66php.gif" border="0" /></a>
<a href="#"><img src="66php.gif" border="0" /></a>
</div>
<div id="demo2"></div>
</div>
<script>
<!--
var speed=10; //數字越大速度越慢
var tab=document.getElementById("demo");
var tab1=document.getElementById("demo1");
var tab2=document.getElementById("demo2");
tab2.innerHTML=tab1.innerHTML; //克隆demo1為demo2
tab.scrollTop=tab.scrollHeight
function Marquee(){
if(tab1.offsetTop-tab.scrollTop>=0)//當滾動至demo1與demo2交界時
tab.scrollTop+=tab2.offsetHeight //demo跳到最頂端
else{
tab.scrollTop--
}
}
var MyMar=setInterval(Marquee,speed);
tab.onmouseover=function() {clearInterval(MyMar)};//滑鼠移上時清除定時器達到滾動停止的目的
tab.onmouseout=function() {MyMar=setInterval(Marquee,speed)};//滑鼠移開時重設定時器
-->
</script>
圖片向左無縫滾動
以下是具體代碼：
<style type="text/css">
<!--
#demo {
background: #FFF;
overflow:hidden;
border: 1px dashed #CCC;
width: 500px;
}
#demo img {
border: 3px solid #F2F2F2;
}
#indemo {
float: left;
width: 800%;
}
#demo1 {
float: left;
}
#demo2 {
float: left;
}
-->
</style>
向左滾動
<div id="demo">
<div id="indemo">
<div id="demo1">
<a href="#"><img src="/66php.gif" border="0" /></a>
<a href="#"><img src="66php.gif" border="0" /></a>
<a href="#"><img src="66php.gif" border="0" /></a>
<a href="#"><img src="66php.gif" border="0" /></a>
<a href="#"><img src="66php.gif" border="0" /></a>
</div>
<div id="demo2"></div>
</div>
</div>
<script>
<!--
var speed=10; //數字越大速度越慢
var tab=document.getElementById("demo");
var tab1=document.getElementById("demo1");
var tab2=document.getElementById("demo2");
tab2.innerHTML=tab1.innerHTML;
function Marquee(){
if(tab2.offsetWidth-tab.scrollLeft<=0)
tab.scrollLeft-=tab1.offsetWidth
else{
tab.scrollLeft++;
}
}
var MyMar=setInterval(Marquee,speed);
tab.onmouseover=function() {clearInterval(MyMar)};
tab.onmouseout=function() {MyMar=setInterval(Marquee,speed)};
-->
</script>
圖片向右無縫滾動
以下是具體代碼：
<style type="text/css">
<!--
#demo {
background: #FFF;
overflow:hidden;
border: 1px dashed #CCC;
width: 500px;
}
#demo img {
border: 3px solid #F2F2F2;
}
#indemo {
float: left;
width: 800%;
}
#demo1 {
float: left;
}
#demo2 {
float: left;
}
-->
</style>
向右滾動
<div id="demo">
<div id="indemo">
<div id="demo1">
<a href="#"><img src="/66php.gif" border="0" /></a>
<a href="#"><img src="66php.gif" border="0" /></a>
<a href="#"><img src="66php.gif" border="0" /></a>
<a href="#"><img src="66php.gif" border="0" /></a>
<a href="#"><img src="66php.gif" border="0" /></a>
</div>
<div id="demo2"></div>
</div>
</div>
<script>
<!--
var speed=10; //數字越大速度越慢
var tab=document.getElementById("demo");
var tab1=document.getElementById("demo1");
var tab2=document.getElementById("demo2");
tab2.innerHTML=tab1.innerHTML;
function Marquee(){
if(tab.scrollLeft<=0)
tab.scrollLeft+=tab2.offsetWidth
else{
tab.scrollLeft--;
}
}
var MyMar=setInterval(Marquee,speed);
tab.onmouseover=function() {clearInterval(MyMar)};
tab.onmouseout=function() {MyMar=setInterval(Marquee,speed)};
-->
</script>
Ⅹ marquee 無縫循環
<DIV id=demo style="BACKGROUND: #ffffff; OVERFLOW: hidden; WIDTH: 150px; COLOR: #0000ff; HEIGHT: 200px">
<DIV id=demo1>
<div align="center">
<A href="http://myok.bokee.com/..." target=_blank><IMG src="圖片鏈接地址" border=0></A><br>
<A href="http://myok.bokee.com/..." target=_blank><IMG src="圖片鏈接地址" border=0></A><br>
<A href="http://myok.bokee.com/..." target=_blank><IMG src="圖片鏈接地址" border=0></A>
</div>
</DIV>
<DIV id=demo2></DIV>
</DIV>
<SCRIPT language="javascript">
var speed=50;
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>
DIRECTION：用於設定文本滾動的方向,可以設定的值有：LEFT,RIGHT。此屬性不是必須使用的。
例：
[MARQUEE DIRECTION="LEFT" ]文字向左邊滾動 [/MARQUEE]
[MARQUEE DIRECTION="RIGHT" ]文字向右邊滾動 [/MARQUEE]
HEIGHT：用於設定滾動字幕的高度,高度可用像素或可視頁面的百分比來表示。此屬性不是必須使用的。
例：
[MARQUEE HEIGHT="10%"] 滾動字幕的高度是可視頁面的10%[ /MARQUEE]
[MARQUEE HEIGHT="12" ]滾動字幕的高度是12像素 [/MARQUEE]
WIDTH：用於設定字幕的寬度,寬度可用像素或可視頁面的百分比來表示。此屬性不是必須使用的。
例：
[MARQUEE WIDTH="90%"] 滾動字幕的寬度是可視頁面的90% [/MARQUEE]
[MARQUEE WIDTH="200" ]滾動字幕的寬度是200像素 [/MARQUEE ]
HSPACE：用於設定滾動字幕左右的空白空間,空白空間用像素表示。此屬性不是必須使用的。
例：
[MARQUEE HSPACE="15" ]滾動字幕左右空白空間為15個像素 [/MARQUEE]
VSPACE：用於設定滾動字幕上下的空白空間,空白空間用像素表示。此屬性不是必須使用的。
例：
[MARQUEE VSPACE="2"] 滾動字幕上下的空白空間為2個像素 [/MARQUEE]
LOOP：用於設定滾動字幕的滾動次數。當LOOP的值為"INFINITE"或是"-1"時,則文字會無限制地滾動。此屬性不是必須使用的。
例：
[MARQUEE LOOP="-1" ]文字滾動無數次 [/MARQUEE]
[MARQUEE LOOP="5" ]文字滾動5次 [/MARQUEE]
SCROLLAMOUNT：用於設定每個連續滾動文本後面的間隔,該間隔用像素表示。此屬性不是必須使用的。
例：
[MARQUEE SCROLLAMOUNT="10"] 此文本後面的間隔為10個像素 [/MARQUEE]
SCROLLDELAY：用於設定兩次滾動操作之間的間隔時間,該時間以毫秒為單位。此屬性不是必須使用的。
例：
[MARQUEE SCROLLDELAY="5"] 此文本兩次滾動之間的間隔時間為5毫秒 [/MARQUEE]
ONMOUSEOUT=this.start() ：用來設置滑鼠移出該區域時