- 浏览: 16610 次
- 性别:
- 来自: 北京
-
文章分类
最新评论
javascript实现走马灯效果[无缝连接、循环滚动、无空白maquee]
以下代码在IE6、Firefox+Win2k环境下测试通过
一、向上的无缝循环滚动
程序代码: [ 复制代码到剪贴板 ]
<!-- 指向链接图片的URL -->
<base href="http://www.it365cn.com">
<div align="center" id="demo" style="overflow:hidden;height:200px;width:95px;border-width:1px 1px 1px 1px;border-style:dotted dotted dotted dotted;">
<div id="demo1">
<!-- 定义内容-->
<img src="images/logo_1.gif">
<img src="images/logo/flashempire.gif">
<img src="images/logo.gif">
<img src="images/logo/5dmedia.gif">
<img src="images/logo/macromedia.gif">
<img src="images/logo/sucaiw.gif">
<img src="images/logo/blueieda.gif">
<img src="images/logo/htmlcn.gif">
<img src="images/logo/fwcn.gif">
</div>
<div id="demo2"></div>
</div>
<script language="javascript" type="text/javascript">
<!--
var demo = document.getElementById("demo");
var demo1 = document.getElementById("demo1");
var demo2 = document.getElementById("demo2");
var speed=10; //滚动速度值,值越大速度越慢
demo2.innerHTML = demo1.innerHTML //克隆demo2为demo1
function Marquee(){
if(demo2.offsetTop-demo.scrollTop<=0) //当滚动至demo1与demo2交界时
demo.scrollTop-=demo1.offsetHeight //demo跳到最顶端
else{
demo.scrollTop++
}
}
var MyMar = setInterval(Marquee,speed); //设置定时器
demo.onmouseover = function(){clearInterval(MyMar)} //鼠标经过时清除定时器达到滚动停止的目的
demo.onmouseout = function(){MyMar = setInterval(Marquee,speed)} //鼠标移开时重设定时器
-->
</script>
二、向下的无缝循环滚动
程序代码: [ 复制代码到剪贴板 ]
<!-- 指向链接图片的URL -->
<base href="http://www.it365cn.com">
<div align="center" id="demo" style="overflow:hidden;height:200px;width:95px;border-width:1px 1px 1px 1px;border-style:dotted dotted dotted dotted;">
<div id="demo1">
<!-- 定义内容-->
<img src="images/logo_1.gif">
<img src="images/logo/flashempire.gif">
<img src="images/logo.gif">
<img src="images/logo/5dmedia.gif">
<img src="images/logo/macromedia.gif">
<img src="images/logo/sucaiw.gif">
<img src="images/logo/blueieda.gif">
<img src="images/logo/htmlcn.gif">
<img src="images/logo/fwcn.gif">
</div>
<div id="demo2"></div>
</div>
<script language="javascript" type="text/javascript">
<!--
var demo = document.getElementById("demo");
var demo1 = document.getElementById("demo1");
var demo2 = document.getElementById("demo2");
var speed=10; //数值越大滚动速度越慢
demo2.innerHTML = demo1.innerHTML;
demo.scrollTop = demo.scrollHeight;
function Marquee(){
if(demo1.offsetTop-demo.scrollTop>=0)
demo.scrollTop+=demo2.offsetHeight
else{
demo.scrollTop--
}
}
var MyMar = setInterval(Marquee,speed);
demo.onmouseover = function(){clearInterval(MyMar)}
demo.onmouseout = function(){MyMar = setInterval(Marquee,speed)}
-->
</script>
三、向左的无缝循环滚动
程序代码: [ 复制代码到剪贴板 ]
<!-- 指向链接图片的URL -->
<base href="http://www.it365cn.com">
<div align="center" id="demo" style="overflow:hidden;height:33px;width:500px;border-width:1px 1px 1px 1px;border-style:dotted dotted dotted dotted;">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td id="demo1"><img src="images/logo_1.gif"><img src="images/logo/flashempire.gif"><img src="images/logo.gif"><img src="images/logo/5dmedia.gif"><img src="images/logo/macromedia.gif"><img src="images/logo/sucaiw.gif"><img src="images/logo/blueieda.gif"><img src="images/logo/htmlcn.gif" border="0"></td>
<td id="demo2"> </td>
</tr>
</table>
</div>
<script language="javascript" type="text/javascript">
<!--
var demo = document.getElementById("demo");
var demo1 = document.getElementById("demo1");
var demo2 = document.getElementById("demo2");
var speed=10; //数值越大滚动速度越慢
demo2.innerHTML = demo1.innerHTML
function Marquee(){
if(demo2.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo1.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar = setInterval(Marquee,speed);
demo.onmouseover = function(){clearInterval(MyMar)}
demo.onmouseout = function(){MyMar = setInterval(Marquee,speed)}
-->
</script>
四、向右的无缝循环滚动
程序代码: [ 复制代码到剪贴板 ]
<!-- 指向链接图片的URL -->
<base href="http://www.it365cn.com">
<div align="center" id="demo" style="overflow:hidden;height:33px;width:500px;border-width:1px 1px 1px 1px;border-style:dotted dotted dotted dotted;">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td id="demo1"><img src="images/logo_1.gif"><img src="images/logo/flashempire.gif"><img src="images/logo.gif"><img src="images/logo/5dmedia.gif"><img src="images/logo/macromedia.gif"><img src="images/logo/sucaiw.gif"><img src="images/logo/blueieda.gif"><img src="images/logo/htmlcn.gif" border="0"></td>
<td id="demo2"> </td>
</tr>
</table>
</div>
<script language="javascript" type="text/javascript">
<!--
var demo = document.getElementById("demo");
var demo1 = document.getElementById("demo1");
var demo2 = document.getElementById("demo2");
var speed=10; //数值越大滚动速度越慢
demo2.innerHTML = demo1.innerHTML;
demo.scrollLeft = demo.scrollWidth;
function Marquee(){
if(demo.scrollLeft<=0)
demo.scrollLeft+=demo2.offsetWidth
else{
demo.scrollLeft--
}
}
var MyMar = setInterval(Marquee,speed)
demo.onmouseover = function(){clearInterval(MyMar)}
demo.onmouseout = function(){MyMar = setInterval(Marquee,speed)}
-->
</script>
来源:http://thomaslee007.javaeye.com/blog/204708
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
上下綜合實例
<a href="#" onmouseover="addspeed=10" onmouseout="addspeed=dafault_addspeed" >^^^^^^^^^^^^^^^^^^^^^^^^</a>
<div id=demo style="overflow:hidden;height:421px;width:190px;">
<div id="demo1">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="421" align="center">
<table width="95%" border="0" cellspacing="7" cellpadding="0">
<tr>
<td align="center"><a href="main.php?action=introduce_view&id=1"><img src="http://qz/upload/2008/12/20081216101239_small.jpg" width="180" height="73" border="0" /></a></td>
</tr>
<tr>
<td align="center"><a href="main.php?action=introduce_view&id=2"><img src="http://qz/upload/2008/12/20081216101251_small.jpg" width="180" height="73" border="0" /></a></td>
</tr>
<tr>
<td align="center"><a href="main.php?action=introduce_view&id=1"><img src="http://qz/upload/2008/12/20081216101239_small.jpg" width="180" height="73" border="0" /></a></td>
</tr>
<tr>
<td align="center"><a href="main.php?action=introduce_view&id=2"><img src="http://qz/upload/2008/12/20081216101251_small.jpg" width="180" height="73" border="0" /></a></td>
</tr>
</table></td>
</tr>
</table>
</div>
<div id="demo2"></div>
</div>
<a href="#" onmouseover="clearInterval(MyMar);MyMar=setInterval(rightAddSpeed,speed)" onmouseout="clearInterval(MyMar);MyMar=setInterval(Marquee,speed)" >ⅤⅤⅤⅤⅤⅤⅤⅤⅤⅤⅤⅤ</a>
<script>
var speed=1 ;
var addspeed=1;
var dafault_addspeed=1;
var demo = document.getElementById("demo");
var demo1 = document.getElementById("demo1");
var demo2 = document.getElementById("demo2");
demo2.innerHTML=demo1.innerHTML ;
function Marquee(){
if(demo2.offsetHeight-demo.scrollTop<=0)
demo.scrollTop-=demo1.offsetHeight;
else{
demo.scrollTop=demo.scrollTop+addspeed;
}
}
function rightAddSpeed(){
if(demo1.offsetTop-demo.scrollTop>=0)
demo.scrollTop+=demo2.offsetHeight
else{
demo.scrollTop-=10;
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>
=================================================
+++++++++++++++左右綜合实例++++++++++++++
<table width="1002" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="153" valign="top" background="images/pro_centerbg2.jpg"><table width="1002" height="140" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="106" align="center" valign="top"><img src="images/jiantou_left.jpg" width="60" height="88" onmouseover="addspeed=10" onmouseout="addspeed=dafault_addspeed"/></td>
<td width="790" valign="top">
<!----------------------------小圖展示區------------------------------------>
<div id=demo style="overflow:hidden;height:100px;width:790px;">
<table>
<tr>
<td id="demo1" valign="top">
<table width="790" height="140" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="131" align="center" valign="top" >
<DIV class="example" style="width:130px; ">
<!--[if lte IE 6.5]><v:rect filled="f"><v:fill size="0pt,0pt"></v:fill><![endif]-->
<DIV class="bd" style="width:110px; height:74px;">
<img src="images/protest1.jpg" width="110" height="74" /></DIV>
<!--[if lte IE 6.5]></v:rect><![endif]-->
</DIV>
</td>
<td width="131" align="center" valign="top" >
<DIV class="example" style="width:130px; ">
<!--[if lte IE 6.5]><v:rect filled="f"><v:fill size="0pt,0pt"></v:fill><![endif]-->
<DIV class="bd" style="width:110px; height:74px;">
<img src="images/protest2.jpg" width="110" height="74" /></DIV>
<!--[if lte IE 6.5]></v:rect><![endif]-->
</DIV>
</td>
<td width="131" align="center" valign="top">
<DIV class="example" style="width:130px; ">
<!--[if lte IE 6.5]><v:rect filled="f"><v:fill size="0pt,0pt"></v:fill><![endif]-->
<DIV class="bd" style="width:110px; height:74px;">
<img src="images/protest3.jpg" width="110" height="74" /></DIV>
<!--[if lte IE 6.5]></v:rect><![endif]-->
</DIV>
</td>
<td width="131" align="center" valign="top">
<DIV class="example" style="width:130px; ">
<!--[if lte IE 6.5]><v:rect filled="f"><v:fill size="0pt,0pt"></v:fill><![endif]-->
<DIV class="bd" style="width:110px; height:74px;">
<img src="images/protest4.jpg" width="110" height="74" /></DIV>
<!--[if lte IE 6.5]></v:rect><![endif]-->
</DIV>
</td>
<td width="131" align="center" valign="top">
<DIV class="example" style="width:130px; ">
<!--[if lte IE 6.5]><v:rect filled="f"><v:fill size="0pt,0pt"></v:fill><![endif]-->
<DIV class="bd" style="width:110px; height:74px;">
<img src="images/protest5.jpg" width="110" height="74" /></DIV>
<!--[if lte IE 6.5]></v:rect><![endif]-->
</DIV>
</td>
<td width="135" align="center" valign="top">
<DIV class="example" style="width:130px; ">
<!--[if lte IE 6.5]><v:rect filled="f"><v:fill size="0pt,0pt"></v:fill><![endif]-->
<DIV class="bd" style="width:110px; height:74px;">
<img src="images/protest6.jpg" width="110" height="74" /></DIV>
<!--[if lte IE 6.5]></v:rect><![endif]-->
</DIV>
</td>
<td width="135" align="center" valign="top">
<DIV class="example" style="width:130px; ">
<!--[if lte IE 6.5]><v:rect filled="f"><v:fill size="0pt,0pt"></v:fill><![endif]-->
<DIV class="bd" style="width:110px; height:74px;">
<img src="images/protest6.jpg" width="110" height="74" /></DIV>
<!--[if lte IE 6.5]></v:rect><![endif]-->
</DIV>
</td>
</tr>
</table>
</td>
<td valign="top" id="demo2"></td>
</tr>
</table>
</div>
<!----------------------------小圖展示區end------------------------------------>
</td>
<td width="106" align="center" valign="top"><img src="images/jiantou_right.jpg" width="60" height="88" onmouseover="clearInterval(MyMar);MyMar=setInterval(rightAddSpeed,speed)" onmouseout="clearInterval(MyMar);MyMar=setInterval(Marquee,speed)"/></td>
</tr>
</table></td>
</tr>
</table>
<script>
var speed=1
var addspeed=1;
var dafault_addspeed=1;
var demo = document.getElementById("demo");
var demo1 = document.getElementById("demo1");
var demo2 = document.getElementById("demo2");
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo1.offsetWidth
else{
demo.scrollLeft=demo.scrollLeft+addspeed
}
}
function rightAddSpeed(){
if(demo2.offsetWidth-demo.scrollLeft>0)
demo.scrollLeft+=demo1.offsetWidth
else{
demo.scrollLeft=demo.scrollLeft-10
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>
一、向上的无缝循环滚动
程序代码: [ 复制代码到剪贴板 ]
<!-- 指向链接图片的URL -->
<base href="http://www.it365cn.com">
<div align="center" id="demo" style="overflow:hidden;height:200px;width:95px;border-width:1px 1px 1px 1px;border-style:dotted dotted dotted dotted;">
<div id="demo1">
<!-- 定义内容-->
<img src="images/logo_1.gif">
<img src="images/logo/flashempire.gif">
<img src="images/logo.gif">
<img src="images/logo/5dmedia.gif">
<img src="images/logo/macromedia.gif">
<img src="images/logo/sucaiw.gif">
<img src="images/logo/blueieda.gif">
<img src="images/logo/htmlcn.gif">
<img src="images/logo/fwcn.gif">
</div>
<div id="demo2"></div>
</div>
<script language="javascript" type="text/javascript">
<!--
var demo = document.getElementById("demo");
var demo1 = document.getElementById("demo1");
var demo2 = document.getElementById("demo2");
var speed=10; //滚动速度值,值越大速度越慢
demo2.innerHTML = demo1.innerHTML //克隆demo2为demo1
function Marquee(){
if(demo2.offsetTop-demo.scrollTop<=0) //当滚动至demo1与demo2交界时
demo.scrollTop-=demo1.offsetHeight //demo跳到最顶端
else{
demo.scrollTop++
}
}
var MyMar = setInterval(Marquee,speed); //设置定时器
demo.onmouseover = function(){clearInterval(MyMar)} //鼠标经过时清除定时器达到滚动停止的目的
demo.onmouseout = function(){MyMar = setInterval(Marquee,speed)} //鼠标移开时重设定时器
-->
</script>
二、向下的无缝循环滚动
程序代码: [ 复制代码到剪贴板 ]
<!-- 指向链接图片的URL -->
<base href="http://www.it365cn.com">
<div align="center" id="demo" style="overflow:hidden;height:200px;width:95px;border-width:1px 1px 1px 1px;border-style:dotted dotted dotted dotted;">
<div id="demo1">
<!-- 定义内容-->
<img src="images/logo_1.gif">
<img src="images/logo/flashempire.gif">
<img src="images/logo.gif">
<img src="images/logo/5dmedia.gif">
<img src="images/logo/macromedia.gif">
<img src="images/logo/sucaiw.gif">
<img src="images/logo/blueieda.gif">
<img src="images/logo/htmlcn.gif">
<img src="images/logo/fwcn.gif">
</div>
<div id="demo2"></div>
</div>
<script language="javascript" type="text/javascript">
<!--
var demo = document.getElementById("demo");
var demo1 = document.getElementById("demo1");
var demo2 = document.getElementById("demo2");
var speed=10; //数值越大滚动速度越慢
demo2.innerHTML = demo1.innerHTML;
demo.scrollTop = demo.scrollHeight;
function Marquee(){
if(demo1.offsetTop-demo.scrollTop>=0)
demo.scrollTop+=demo2.offsetHeight
else{
demo.scrollTop--
}
}
var MyMar = setInterval(Marquee,speed);
demo.onmouseover = function(){clearInterval(MyMar)}
demo.onmouseout = function(){MyMar = setInterval(Marquee,speed)}
-->
</script>
三、向左的无缝循环滚动
程序代码: [ 复制代码到剪贴板 ]
<!-- 指向链接图片的URL -->
<base href="http://www.it365cn.com">
<div align="center" id="demo" style="overflow:hidden;height:33px;width:500px;border-width:1px 1px 1px 1px;border-style:dotted dotted dotted dotted;">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td id="demo1"><img src="images/logo_1.gif"><img src="images/logo/flashempire.gif"><img src="images/logo.gif"><img src="images/logo/5dmedia.gif"><img src="images/logo/macromedia.gif"><img src="images/logo/sucaiw.gif"><img src="images/logo/blueieda.gif"><img src="images/logo/htmlcn.gif" border="0"></td>
<td id="demo2"> </td>
</tr>
</table>
</div>
<script language="javascript" type="text/javascript">
<!--
var demo = document.getElementById("demo");
var demo1 = document.getElementById("demo1");
var demo2 = document.getElementById("demo2");
var speed=10; //数值越大滚动速度越慢
demo2.innerHTML = demo1.innerHTML
function Marquee(){
if(demo2.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo1.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar = setInterval(Marquee,speed);
demo.onmouseover = function(){clearInterval(MyMar)}
demo.onmouseout = function(){MyMar = setInterval(Marquee,speed)}
-->
</script>
四、向右的无缝循环滚动
程序代码: [ 复制代码到剪贴板 ]
<!-- 指向链接图片的URL -->
<base href="http://www.it365cn.com">
<div align="center" id="demo" style="overflow:hidden;height:33px;width:500px;border-width:1px 1px 1px 1px;border-style:dotted dotted dotted dotted;">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td id="demo1"><img src="images/logo_1.gif"><img src="images/logo/flashempire.gif"><img src="images/logo.gif"><img src="images/logo/5dmedia.gif"><img src="images/logo/macromedia.gif"><img src="images/logo/sucaiw.gif"><img src="images/logo/blueieda.gif"><img src="images/logo/htmlcn.gif" border="0"></td>
<td id="demo2"> </td>
</tr>
</table>
</div>
<script language="javascript" type="text/javascript">
<!--
var demo = document.getElementById("demo");
var demo1 = document.getElementById("demo1");
var demo2 = document.getElementById("demo2");
var speed=10; //数值越大滚动速度越慢
demo2.innerHTML = demo1.innerHTML;
demo.scrollLeft = demo.scrollWidth;
function Marquee(){
if(demo.scrollLeft<=0)
demo.scrollLeft+=demo2.offsetWidth
else{
demo.scrollLeft--
}
}
var MyMar = setInterval(Marquee,speed)
demo.onmouseover = function(){clearInterval(MyMar)}
demo.onmouseout = function(){MyMar = setInterval(Marquee,speed)}
-->
</script>
来源:http://thomaslee007.javaeye.com/blog/204708
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
上下綜合實例
<a href="#" onmouseover="addspeed=10" onmouseout="addspeed=dafault_addspeed" >^^^^^^^^^^^^^^^^^^^^^^^^</a>
<div id=demo style="overflow:hidden;height:421px;width:190px;">
<div id="demo1">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="421" align="center">
<table width="95%" border="0" cellspacing="7" cellpadding="0">
<tr>
<td align="center"><a href="main.php?action=introduce_view&id=1"><img src="http://qz/upload/2008/12/20081216101239_small.jpg" width="180" height="73" border="0" /></a></td>
</tr>
<tr>
<td align="center"><a href="main.php?action=introduce_view&id=2"><img src="http://qz/upload/2008/12/20081216101251_small.jpg" width="180" height="73" border="0" /></a></td>
</tr>
<tr>
<td align="center"><a href="main.php?action=introduce_view&id=1"><img src="http://qz/upload/2008/12/20081216101239_small.jpg" width="180" height="73" border="0" /></a></td>
</tr>
<tr>
<td align="center"><a href="main.php?action=introduce_view&id=2"><img src="http://qz/upload/2008/12/20081216101251_small.jpg" width="180" height="73" border="0" /></a></td>
</tr>
</table></td>
</tr>
</table>
</div>
<div id="demo2"></div>
</div>
<a href="#" onmouseover="clearInterval(MyMar);MyMar=setInterval(rightAddSpeed,speed)" onmouseout="clearInterval(MyMar);MyMar=setInterval(Marquee,speed)" >ⅤⅤⅤⅤⅤⅤⅤⅤⅤⅤⅤⅤ</a>
<script>
var speed=1 ;
var addspeed=1;
var dafault_addspeed=1;
var demo = document.getElementById("demo");
var demo1 = document.getElementById("demo1");
var demo2 = document.getElementById("demo2");
demo2.innerHTML=demo1.innerHTML ;
function Marquee(){
if(demo2.offsetHeight-demo.scrollTop<=0)
demo.scrollTop-=demo1.offsetHeight;
else{
demo.scrollTop=demo.scrollTop+addspeed;
}
}
function rightAddSpeed(){
if(demo1.offsetTop-demo.scrollTop>=0)
demo.scrollTop+=demo2.offsetHeight
else{
demo.scrollTop-=10;
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>
=================================================
+++++++++++++++左右綜合实例++++++++++++++
<table width="1002" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="153" valign="top" background="images/pro_centerbg2.jpg"><table width="1002" height="140" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="106" align="center" valign="top"><img src="images/jiantou_left.jpg" width="60" height="88" onmouseover="addspeed=10" onmouseout="addspeed=dafault_addspeed"/></td>
<td width="790" valign="top">
<!----------------------------小圖展示區------------------------------------>
<div id=demo style="overflow:hidden;height:100px;width:790px;">
<table>
<tr>
<td id="demo1" valign="top">
<table width="790" height="140" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="131" align="center" valign="top" >
<DIV class="example" style="width:130px; ">
<!--[if lte IE 6.5]><v:rect filled="f"><v:fill size="0pt,0pt"></v:fill><![endif]-->
<DIV class="bd" style="width:110px; height:74px;">
<img src="images/protest1.jpg" width="110" height="74" /></DIV>
<!--[if lte IE 6.5]></v:rect><![endif]-->
</DIV>
</td>
<td width="131" align="center" valign="top" >
<DIV class="example" style="width:130px; ">
<!--[if lte IE 6.5]><v:rect filled="f"><v:fill size="0pt,0pt"></v:fill><![endif]-->
<DIV class="bd" style="width:110px; height:74px;">
<img src="images/protest2.jpg" width="110" height="74" /></DIV>
<!--[if lte IE 6.5]></v:rect><![endif]-->
</DIV>
</td>
<td width="131" align="center" valign="top">
<DIV class="example" style="width:130px; ">
<!--[if lte IE 6.5]><v:rect filled="f"><v:fill size="0pt,0pt"></v:fill><![endif]-->
<DIV class="bd" style="width:110px; height:74px;">
<img src="images/protest3.jpg" width="110" height="74" /></DIV>
<!--[if lte IE 6.5]></v:rect><![endif]-->
</DIV>
</td>
<td width="131" align="center" valign="top">
<DIV class="example" style="width:130px; ">
<!--[if lte IE 6.5]><v:rect filled="f"><v:fill size="0pt,0pt"></v:fill><![endif]-->
<DIV class="bd" style="width:110px; height:74px;">
<img src="images/protest4.jpg" width="110" height="74" /></DIV>
<!--[if lte IE 6.5]></v:rect><![endif]-->
</DIV>
</td>
<td width="131" align="center" valign="top">
<DIV class="example" style="width:130px; ">
<!--[if lte IE 6.5]><v:rect filled="f"><v:fill size="0pt,0pt"></v:fill><![endif]-->
<DIV class="bd" style="width:110px; height:74px;">
<img src="images/protest5.jpg" width="110" height="74" /></DIV>
<!--[if lte IE 6.5]></v:rect><![endif]-->
</DIV>
</td>
<td width="135" align="center" valign="top">
<DIV class="example" style="width:130px; ">
<!--[if lte IE 6.5]><v:rect filled="f"><v:fill size="0pt,0pt"></v:fill><![endif]-->
<DIV class="bd" style="width:110px; height:74px;">
<img src="images/protest6.jpg" width="110" height="74" /></DIV>
<!--[if lte IE 6.5]></v:rect><![endif]-->
</DIV>
</td>
<td width="135" align="center" valign="top">
<DIV class="example" style="width:130px; ">
<!--[if lte IE 6.5]><v:rect filled="f"><v:fill size="0pt,0pt"></v:fill><![endif]-->
<DIV class="bd" style="width:110px; height:74px;">
<img src="images/protest6.jpg" width="110" height="74" /></DIV>
<!--[if lte IE 6.5]></v:rect><![endif]-->
</DIV>
</td>
</tr>
</table>
</td>
<td valign="top" id="demo2"></td>
</tr>
</table>
</div>
<!----------------------------小圖展示區end------------------------------------>
</td>
<td width="106" align="center" valign="top"><img src="images/jiantou_right.jpg" width="60" height="88" onmouseover="clearInterval(MyMar);MyMar=setInterval(rightAddSpeed,speed)" onmouseout="clearInterval(MyMar);MyMar=setInterval(Marquee,speed)"/></td>
</tr>
</table></td>
</tr>
</table>
<script>
var speed=1
var addspeed=1;
var dafault_addspeed=1;
var demo = document.getElementById("demo");
var demo1 = document.getElementById("demo1");
var demo2 = document.getElementById("demo2");
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo1.offsetWidth
else{
demo.scrollLeft=demo.scrollLeft+addspeed
}
}
function rightAddSpeed(){
if(demo2.offsetWidth-demo.scrollLeft>0)
demo.scrollLeft+=demo1.offsetWidth
else{
demo.scrollLeft=demo.scrollLeft-10
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>
相关推荐
5. 判断当滚动条到达指定内容宽度时,将内容追加到元素的末尾,实现循环滚动。 6. 通过setInterval函数设置scroll函数定时执行,以达到连续滚动的效果。 在实际项目中,推荐使用第二种方法,因为其可定制性更高,...
通过研究源码,可以了解如何使用编程语言(如JavaScript、Python等)结合数据可视化库来创建复杂的可视化界面,以及如何实现数据的动态加载和交互功能。 5. 可演示特性:此DEMO源码是可演示的,意味着它可以作为一...
ECharts是一个基于JavaScript的数据可视化库,它充分利用了HTML5的Canvas或SVG进行图表渲染。ECharts提供了丰富的图表类型,包括折线图、柱状图、饼图、散点图、K线图等,能够满足各种数据分析和展示需求。此外,...
特征 这是vue专有的选取框组件,其特征是无限的上下旋转木马,将首尾相连。 用法 安装 npm i @ vue_modules / vue - marquee - straight 基本的 ...import TheMarquee from "@vue_modules/vue-marquee-straight" ;...
级联H桥SVG无功补偿系统在不平衡电网中的三层控制策略:电压电流双闭环PI控制、相间与相内电压均衡管理,级联H桥SVG无功补偿系统在不平衡电网中的三层控制策略:电压电流双闭环PI控制、相间与相内电压均衡管理,不平衡电网下的svg无功补偿,级联H桥svg无功补偿statcom,采用三层控制策略。 (1)第一层采用电压电流双闭环pi控制,电压电流正负序分离,电压外环通过产生基波正序有功电流三相所有H桥模块直流侧平均电压恒定,电流内环采用前馈解耦控制; (2)第二层相间电压均衡控制,注入零序电压,控制通过注入零序电压维持相间电压平衡; (3)第三层相内电压均衡控制,使其所有子模块吸收的有功功率与其损耗补,从而保证所有H桥子模块直流侧电压值等于给定值。 有参考资料。 639,核心关键词: 1. 不平衡电网下的SVG无功补偿 2. 级联H桥SVG无功补偿STATCOM 3. 三层控制策略 4. 电压电流双闭环PI控制 5. 电压电流正负序分离 6. 直流侧平均电压恒定 7. 前馈解耦控制 8. 相间电压均衡控制 9. 零序电压注入 10. 相内电压均衡控制 以上十个关键词用分号分隔的格式为:不
GTX 1080 PCB图纸,内含图纸查看软件
内容概要:本文档详细介绍了利用 DeepSeek 进行文本润色和问答交互时提高效果的方法和技巧,涵盖了从明确需求、提供适当上下文到尝试开放式问题以及多轮对话的十个要点。每一部分内容都提供了具体的示范案例,如指定回答格式、分步骤提问等具体实例,旨在指导用户更好地理解和运用 DeepSeek 提升工作效率和交流质量。同时文中还强调了根据不同应用场景调整提示词语气和风格的重要性和方法。 适用人群:适用于希望通过优化提问技巧以获得高质量反馈的企业员工、科研人员以及一般公众。 使用场景及目标:本文针对所有期望提高 DeepSeek 使用效率的人群,帮助他们在日常工作中快速获取精准的答案或信息,特别是在撰写报告、研究材料准备和技术咨询等方面。此外还鼓励用户通过不断尝试不同形式的问题表述来进行有效沟通。 其他说明:该文档不仅关注实际操作指引,同样重视用户思维模式转变——由简单索取答案向引导 AI 辅助创造性解决问题的方向发展。
基于FPGA与W5500实现的TCP网络通信测试平台开发——Zynq扩展口Verilog编程实践,基于FPGA与W5500芯片的TCP网络通信测试及多路Socket实现基于zynq开发平台和Vivado 2019软件的扩展开发,基于FPGA和W5500的TCP网络通信 测试平台 zynq扩展口开发 软件平台 vivado2019.2,纯Verilog可移植 测试环境 压力测试 cmd命令下ping电脑ip,同时采用上位机进行10ms发包回环测试,不丢包(内部数据回环,需要时间处理) 目前实现单socket功能,多路可支持 ,基于FPGA; W5500; TCP网络通信; Zynq扩展口开发; 纯Verilog可移植; 测试平台; 压力测试; 10ms发包回环测试; 单socket功能; 多路支持。,基于FPGA与W5500的Zynq扩展口TCP通信测试:可移植Verilog实现的高效网络通信
Labview液压比例阀伺服阀试验台多功能程序:PLC通讯、液压动画模拟、手动控制与调试、传感器标定、报警及记录、自动实验、数据处理与查询存储,报表生成与打印一体化解决方案。,Labview液压比例阀伺服阀试验台多功能程序:PLC通讯、液压动画模拟、手动控制与调试、传感器标定、报警管理及实验自动化,labview液压比例阀伺服阀试验台程序:功能包括,同PLC通讯程序,液压动画,手动控制及调试,传感器标定,报警设置及报警记录,自动实验,数据处理曲线处理,数据库存储及查询,报表自动生成及打印,扫码枪扫码及信号录入等~ ,核心关键词:PLC通讯; 液压动画; 手动控制及调试; 传感器标定; 报警设置及记录; 自动实验; 数据处理及曲线处理; 数据库存储及查询; 报表生成及打印; 扫码枪扫码。,Labview驱动的智能液压阀测试系统:多功能控制与数据处理
华为、腾讯、万科员工职业发展体系建设与实践.pptx
1.版本:matlab2014/2019a/2024a 2.附赠案例数据可直接运行matlab程序。 3.代码特点:参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象:计算机,电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。
电网不对称故障下VSG峰值电流限制的柔性控制策略:实现电流平衡与功率容量的优化利用,电网不对称故障下VSG峰值电流限制的柔性控制策略:兼顾平衡电流与功率控制切换的动态管理,电网不对称故障下VSG峰值电流限制的柔性不平衡控制(文章完全复现)。 提出一种在不平衡运行条件下具有峰值电流限制的可变不平衡电流控制方法,可灵活地满足不同操作需求,包括电流平衡、有功或无功恒定运行(即电流控制、有功控制或无功控制之间的相互切),注入电流保持在安全值内,以更好的利用VSG功率容量。 关键词:VSG、平衡电流控制、有功功率控制、无功功率控制。 ,VSG; 峰值电流限制; 柔性不平衡控制; 电流平衡控制; 有功功率控制; 无功功率控制。,VSG柔性控制:在电网不对称故障下的峰值电流限制与平衡管理
1、文件内容:libpinyin-tools-0.9.93-4.el7.rpm以及相关依赖 2、文件形式:tar.gz压缩包 3、安装指令: #Step1、解压 tar -zxvf /mnt/data/output/libpinyin-tools-0.9.93-4.el7.tar.gz #Step2、进入解压后的目录,执行安装 sudo rpm -ivh *.rpm 4、更多资源/技术支持:公众号禅静编程坊
数据集是一个以经典动漫《龙珠》为主题的多维度数据集,广泛应用于数据分析、机器学习和图像识别等领域。该数据集由多个来源整合而成,涵盖了角色信息、战斗力、剧情片段、台词以及角色图像等多个方面。数据集的核心内容包括: 角色信息:包含《龙珠》系列中的主要角色及其属性,如名称、种族、所属系列(如《龙珠》《龙珠Z》《龙珠超》等)、战斗力等级等。 图像数据:提供角色的图像资源,可用于图像分类和角色识别任务。这些图像来自动画剧集、漫画和相关衍生作品。 剧情与台词:部分数据集还包含角色在不同故事中的台词和剧情片段,可用于文本分析和自然语言处理任务。 战斗数据:记录角色在不同剧情中的战斗力变化和战斗历史,为研究角色成长和剧情发展提供支持。 数据集特点 多样性:数据集整合了角色、图像、文本等多种类型的数据,适用于多种研究场景。 深度:不仅包含角色的基本信息,还涵盖了角色的成长历程、技能描述和与其他角色的互动关系。 实用性:支持多种编程语言(如Python、R)的数据处理和分析,提供了详细的文档和示例代码。
基于protues仿真的多功公交站播报系统设计(仿真图、源代码) 该设计为基于protues仿真的多功公交站播报系统,实现温度显示、时间显示、和系统公交站播报功能; 具体功能如下: 1、系统使用51单片机为核心设计; 2、时钟芯片进行时间和日期显示; 3、温度传感器进行温度读取; 4、LCD12864液晶屏进行相关显示; 5、按键设置调节时间; 6、按键设置报站; 7、仿真图、源代码; 操作说明: 1、下行控制报站:首先按下(下行设置按键),(下行指示灯)亮,然后按下(手动播报)按键控制播报下一站; 2、上行控制报站:首先按上(上行设置按键),(上行指示灯)亮,然后按下(手动播报)按键控制播报下一站; 3、按下关闭播报按键,则关闭播报功能和清除显示
采用Java后台技术和MySQL数据库,在前台界面为提升用户体验,使用Jquery、Ajax、CSS等技术进行布局。 系统包括两类用户:学生、管理员。 学生用户 学生用户只要实现了前台信息的查看,打开首页,查看网站介绍、琴房信息、在线留言、轮播图信息公告等,通过点击首页的菜单跳转到对应的功能页面菜单,包括网站首页、琴房信息、注册登录、个人中心、后台登录。 学生用户通过账户账号登录,登录后具有所有的操作权限,如果没有登录,不能在线预约。学生用户退出系统将注销个人的登录信息。 管理员通过后台的登录页面,选择管理员权限后进行登录,管理员的权限包括轮播公告管理、老师学生信息管理和信息审核管理,管理员管理后点击退出,注销登录信息。 管理员用户具有在线交流的管理,琴房信息管理、琴房预约管理。 在线交流是对前台用户留言内容进行管理,删除留言信息,查看留言信息。
MATLAB可以用于开发人脸识别考勤系统。下面是一个简单的示例流程: 1. 数据采集:首先收集员工的人脸图像作为训练数据集。可以要求员工提供多张照片以获得更好的训练效果。 2. 图像预处理:使用MATLAB的图像处理工具对采集到的人脸图像进行预处理,例如灰度化、裁剪、缩放等操作。 3. 特征提取:利用MATLAB的人脸识别工具包,如Face Recognition Toolbox,对处理后的图像提取人脸特征,常用的方法包括主成分分析(PCA)和线性判别分析(LDA)等。 4. 训练模型:使用已提取的人脸特征数据集训练人脸识别模型,可以选择支持向量机(SVM)、卷积神经网络(CNN)等算法。 5. 考勤系统:在员工打卡时,将摄像头捕获的人脸图像输入到训练好的模型中进行识别,匹配员工信息并记录考勤数据。 6. 结果反馈:根据识别结果,可以自动生成考勤报表或者实时显示员工打卡情况。 以上只是一个简单的步骤,实际开发过程中需根据具体需求和系统规模进行定制和优化。MATLAB提供了丰富的图像处理和机器学习工具,是开发人脸识别考勤系统的一个很好选择。
hjbvbnvhjhjg
HCIP、软考相关学习PPT提供下载
绿豆BOX UI8版:反编译版六个全新UI+最新后台直播管理源码 最新绿豆BOX反编译版六个UI全新绿豆盒子UI8版本 最新后台支持直播管理 作为UI6的升级版,UI8不仅修复了前一版本中存在的一些BUG,还提供了6套不同的UI界面供用户选择,该版本有以下特色功能: 在线管理TVBOX解析 在线自定义TVBOX 首页布局批量添加会员信息 并支持导出批量生成卡密 并支持导出直播列表管理功能