在Dreawearcs3中怎么调试啊
日期：2014-05-17 浏览次数：20696 次
在Dreawearcs3中如何调试啊？
我要的是图片滚动效果，是横向滚动，没有间隙的那种，但是我把下面的代码放到Dreawearcs3中后调试，结果就是吧这4张图片重复显示在右边而已，没有滚动？
网上看了好多，都是这样的，不知道我在那个角落弄错了，望高手指教？
<div id="demo" style="overflow:hidden;height:55;width:255;color:#ffffff">
<table border="0" align="left" cellpadding="0" cellspacing="0" cellspace="0">
<tr>
<td id="demo1" valign="top">
<img src="images/sinkon_14.jpg">
<img src="images/sinkon_16.jpg">
<img src="images/sinkon_18.jpg">
<img src="images/sinkon_39.jpg">
</td>
<td id="demo2" valign="top"></td>
</tr>
</table>
</div>
<script>
var speed=30
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>
------解决方案--------------------
试试这个应该可以
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
<!--
#demo {
background: #FFF;
overflow:hidden;
border: 1px dashed #CCC;
width: 500px;
}
#demo img {
border: 2px solid #F2F2F2;
}
#indemo {
float: left;
width: 800%;
}
#demo1 {
float: left;
}
#demo2 {
float: left;
}
-->
</style>
</head>
<body>
<div id="demo">
<div id="indemo">
<div id="demo1">
<a href="#"><img src="威汀东方/李芳制作相册/DSC_0061.jpg" border="0" width="100" height="100" /></a>
<a href="#"><img src="威汀东方/李芳制作相册/DSCN0614.JPG" border="0" width="100" height="100"/></a>
<a href="#"><img src="威汀东方/李芳制作相册/DSC_0397.jpg" border="0"width="100" height="100" /></a>
<a href="#"><img src="威汀东方/李芳制作相册/DSC_0061.jpg" border="0" width="100" height="100" /></a>
<a href="#"><img src="威汀东方/李芳制作相册/DSCN0614.JPG" border="0" width="100" height="100"/></a>
<a href="#"><img src="威汀东方/李芳制作相册/DSC_0397.jpg" border="0"width="100" height="100" /></a>
</div>
<div id="demo2"></div>
</div>
</div>
<script>
<!--
var speed=30; //数字越大速度越慢
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)};
我要的是图片滚动效果，是横向滚动，没有间隙的那种，但是我把下面的代码放到Dreawearcs3中后调试，结果就是吧这4张图片重复显示在右边而已，没有滚动？
网上看了好多，都是这样的，不知道我在那个角落弄错了，望高手指教？
<div id="demo" style="overflow:hidden;height:55;width:255;color:#ffffff">
<table border="0" align="left" cellpadding="0" cellspacing="0" cellspace="0">
<tr>
<td id="demo1" valign="top">
<img src="images/sinkon_14.jpg">
<img src="images/sinkon_16.jpg">
<img src="images/sinkon_18.jpg">
<img src="images/sinkon_39.jpg">
</td>
<td id="demo2" valign="top"></td>
</tr>
</table>
</div>
<script>
var speed=30
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>
------解决方案--------------------
试试这个应该可以
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
<!--
#demo {
background: #FFF;
overflow:hidden;
border: 1px dashed #CCC;
width: 500px;
}
#demo img {
border: 2px solid #F2F2F2;
}
#indemo {
float: left;
width: 800%;
}
#demo1 {
float: left;
}
#demo2 {
float: left;
}
-->
</style>
</head>
<body>
<div id="demo">
<div id="indemo">
<div id="demo1">
<a href="#"><img src="威汀东方/李芳制作相册/DSC_0061.jpg" border="0" width="100" height="100" /></a>
<a href="#"><img src="威汀东方/李芳制作相册/DSCN0614.JPG" border="0" width="100" height="100"/></a>
<a href="#"><img src="威汀东方/李芳制作相册/DSC_0397.jpg" border="0"width="100" height="100" /></a>
<a href="#"><img src="威汀东方/李芳制作相册/DSC_0061.jpg" border="0" width="100" height="100" /></a>
<a href="#"><img src="威汀东方/李芳制作相册/DSCN0614.JPG" border="0" width="100" height="100"/></a>
<a href="#"><img src="威汀东方/李芳制作相册/DSC_0397.jpg" border="0"width="100" height="100" /></a>
</div>
<div id="demo2"></div>
</div>
</div>
<script>
<!--
var speed=30; //数字越大速度越慢
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)};
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
