<html>
<head>
<style type="text/css">
#demo1{
position:relative;
width:694px;
height:160px;
overflow:hidden;
white-space:nowrap;
}
#demo1 div{
position:absolute;
}
</style>
</head>
<body>
<div id="demo1" valign="top"> <div> <img src="http://www.baidu.com/img/baidu_logo.gif"> <img src="http://www.baidu.com/img/baidu_logo.gif"> <img src="http://www.baidu.com/img/baidu_logo.gif"> <img src="http://www.baidu.com/img/baidu_logo.gif"> <img src="http://www.baidu.com/img/baidu_logo.gif"> <img src="http://www.baidu.com/img/baidu_logo.gif"> </div> </div>
<script type="text/javascript">
function setMarquee(){
var Tim,Div=document.getElementById("demo1").getElementsByTagName("div")[0],Img=Div.getElementsByTagName("img");
var Child=function(){
return Div.getElementsByTagName("img")[0];
}
var Left=function(s){
if(s){
Div.style.left=s+"px";
}else{
var s=Div.style.left,r=/^(.+)px$/;
if(r.test(s)){
return parseInt(s.replace(r,"$1"));
}else{
return 0
}
}
}
var Distance=function(){
return -(Child().offsetWidth);
}
var Play=function(){
if(Tim)clearTimeout(Tim);
var l=Left();
if(Distance() <l){
Left(l-1);
Tim=setTimeout(Play,25); //滚动速度
}else{
var o=Child();
Div.removeChild(o);
Div.appendChild(o);
Div.style.left=0;
Tim=setTimeout(Play,500); //滚动间隔
}
}
Tim=setTimeout(Play,1000); //第一次滚动
for(var i=0;i <Img.length;i++){
Img[i].onmouseover=function(){
if(Tim)clearTimeout(Tim);
}
Img[i].onmouseout=function(){
Tim=setTimeout(Play,500); //鼠标离开后滚动间隔
}
}
}
setMarquee();
</script>
</body>
</html>
就是当每个图片有连接的时候怎么修改
如:<a href="><img /></a>这样的形式
<head>
<style type="text/css">
#demo1{
position:relative;
width:694px;
height:160px;
overflow:hidden;
white-space:nowrap;
}
#demo1 div{
position:absolute;
}
</style>
</head>
<body>
<div id="demo1" valign="top"> <div> <img src="http://www.baidu.com/img/baidu_logo.gif"> <img src="http://www.baidu.com/img/baidu_logo.gif"> <img src="http://www.baidu.com/img/baidu_logo.gif"> <img src="http://www.baidu.com/img/baidu_logo.gif"> <img src="http://www.baidu.com/img/baidu_logo.gif"> <img src="http://www.baidu.com/img/baidu_logo.gif"> </div> </div>
<script type="text/javascript">
function setMarquee(){
var Tim,Div=document.getElementById("demo1").getElementsByTagName("div")[0],Img=Div.getElementsByTagName("img");
var Child=function(){
return Div.getElementsByTagName("img")[0];
}
var Left=function(s){
if(s){
Div.style.left=s+"px";
}else{
var s=Div.style.left,r=/^(.+)px$/;
if(r.test(s)){
return parseInt(s.replace(r,"$1"));
}else{
return 0
}
}
}
var Distance=function(){
return -(Child().offsetWidth);
}
var Play=function(){
if(Tim)clearTimeout(Tim);
var l=Left();
if(Distance() <l){
Left(l-1);
Tim=setTimeout(Play,25); //滚动速度
}else{
var o=Child();
Div.removeChild(o);
Div.appendChild(o);
Div.style.left=0;
Tim=setTimeout(Play,500); //滚动间隔
}
}
Tim=setTimeout(Play,1000); //第一次滚动
for(var i=0;i <Img.length;i++){
Img[i].onmouseover=function(){
if(Tim)clearTimeout(Tim);
}
Img[i].onmouseout=function(){
Tim=setTimeout(Play,500); //鼠标离开后滚动间隔
}
}
}
setMarquee();
</script>
</body>
</html>
就是当每个图片有连接的时候怎么修改
如:<a href="><img /></a>这样的形式
解决方案 »
- javascript可以向服务器提交表单数据吗?
- js问题,浏览器报错Cannot read property 'id' of undefined
- jquery的each()方法中,当前正在被遍历的一个对象怎么表示
- 请问在js中是不是回调函数的定义有两种?
- js表单验证问题,在线等
- 我在vbscript中运行以下代码为何出错??
- javascript 奇怪的问题 (100分)
- 今天大年三十了,先给大家拜年,还有一个问题没有解决。
- 如何实现下拉框中包含复选框?
- 我现在只想打印:<table></table>里面的内容,页面其它不打印,而且,按照table的大小进行打印,
- 求JavaScript高级程序设计 中文版
- select中设置超连接的问题
如下:<html>
<head>
<style type="text/css">
#demo1{
position:relative;
width:694px;
height:160px;
overflow:hidden;
white-space:nowrap;
}
#demo1 div{
position:absolute;
}
</style>
</head>
<body>
<div id="demo1" valign="top"> <div> <a href="http://www.baidu.com/" target="_blank"><img border="0" src="http://www.baidu.com/img/baidu_logo.gif"></a> <a href="http://www.baidu.com/" target="_blank"><img border="0" src="http://www.baidu.com/img/baidu_logo.gif"></a> <a href="http://www.baidu.com/" target="_blank"><img border="0" src="http://www.baidu.com/img/baidu_logo.gif"></a> <a href="http://www.baidu.com/" target="_blank"><img border="0" src="http://www.baidu.com/img/baidu_logo.gif"></a> </div> </div>
<script type="text/javascript">
function setMarquee(){
var Tim,Div=document.getElementById("demo1").getElementsByTagName("div")[0],Img=Div.getElementsByTagName("img");
var Child=function(){
return Div.getElementsByTagName("img")[0];
}
var Left=function(s){
if(s){
Div.style.left=s+"px";
}else{
var s=Div.style.left,r=/^(.+)px$/;
if(r.test(s)){
return parseInt(s.replace(r,"$1"));
}else{
return 0
}
}
}
var Distance=function(){
return -(Child().offsetWidth);
}
var Play=function(){
if(Tim)clearTimeout(Tim);
var l=Left();
if(Distance() <l){
Left(l-1);
Tim=setTimeout(Play,25); //滚动速度
}else{
var o=Child();
Div.removeChild(o);
Div.appendChild(o);
Div.style.left=0;
Tim=setTimeout(Play,500); //滚动间隔
}
}
Tim=setTimeout(Play,1000); //第一次滚动
for(var i=0;i <Img.length;i++){
Img[i].onmouseover=function(){
if(Tim)clearTimeout(Tim);
}
Img[i].onmouseout=function(){
Tim=setTimeout(Play,500); //鼠标离开后滚动间隔
}
}
}
setMarquee();
</script>
</body>
</html>
<html>
<head>
<style type="text/css">
#demo1{
position:relative;
width:694px;
height:160px;
overflow:hidden;
white-space:nowrap;
}
#demo1 div{
position:absolute;
}
img{
border:0px solid;
}
</style>
</head>
<body>
<div id="demo1" valign="top"> <div> <a href="http://www.baidu.com/img/baidu_logo.gif">
<img src="http://www.baidu.com/img/baidu_logo.gif">
</a>
<a href="http://www.baidu.com/img/baidu_logo.gif">
<img src="http://www.baidu.com/img/baidu_logo.gif">
</a>
<a href="http://www.baidu.com/img/baidu_logo.gif">
<img src="http://www.baidu.com/img/baidu_logo.gif">
</a>
<a href="http://www.baidu.com/img/baidu_logo.gif">
<img src="http://www.baidu.com/img/baidu_logo.gif">
</a>
<a href="http://www.baidu.com/img/baidu_logo.gif">
<img src="http://www.baidu.com/img/baidu_logo.gif">
</a>
<a href="http://www.baidu.com/img/baidu_logo.gif">
<img src="http://www.baidu.com/img/baidu_logo.gif">
</a>
</div> </div>
<script type="text/javascript">
function setMarquee(){
var Tim,Div=document.getElementById("demo1").getElementsByTagName("div")[0],Img=Div.getElementsByTagName("img");
var Child=function(){
return Div.getElementsByTagName("img")[0];
}
var Left=function(s){
if(s){
Div.style.left=s+"px";
}else{
var s=Div.style.left,r=/^(.+)px$/;
if(r.test(s)){
return parseInt(s.replace(r,"$1"));
}else{
return 0
}
}
}
var Distance=function(){
return -(Child().offsetWidth);
}
var Play=function(){
if(Tim)clearTimeout(Tim);
var l=Left();
if(Distance() <l){
Left(l-1);
Tim=setTimeout(Play,25); //滚动速度
}else{
var o=Child();
Div.removeChild(o);
Div.appendChild(o);
Div.style.left=0;
Tim=setTimeout(Play,500); //滚动间隔
}
}
Tim=setTimeout(Play,1000); //第一次滚动
for(var i=0;i <Img.length;i++){
Img[i].onmouseover=function(){
if(Tim)clearTimeout(Tim);
}
Img[i].onmouseout=function(){
Tim=setTimeout(Play,500); //鼠标离开后滚动间隔
}
}
}
setMarquee();
</script>
</body>
</html>
<head>
<style type="text/css">
#demo1{
position:relative;
width:694px;
height:160px;
overflow:hidden;
white-space:nowrap;
}
#demo1 div{
position:absolute;
}
</style>
</head>
<body>
<div id="demo1" valign="top">
<div>
<a href="www.baidu.net"><img border="0" src="http://www.baidu.com/img/baidu_logo.gif"></a>
<a href="www.baidu.net"><img border="0" src="http://www.baidu.com/img/baidu_logo.gif"></a>
<a href="www.baidu.net"><img border="0" src="http://www.baidu.com/img/baidu_logo.gif"></a>
<a href="www.baidu.net"><img border="0" src="http://www.baidu.com/img/baidu_logo.gif"></a>
<a href="www.baidu.net"><img border="0" src="http://www.baidu.com/img/baidu_logo.gif"></a>
<a href="www.baidu.net"><img border="0" src="http://www.baidu.com/img/baidu_logo.gif"></a>
</div>
</div>
<script type="text/javascript">
function setMarquee(){
var Tim,Div=document.getElementById("demo1").getElementsByTagName("div")[0],Img=Div.getElementsByTagName("img");
var Child=function(){
return Div.getElementsByTagName("img")[0];
}
var Left=function(s){
if(s){
Div.style.left=s+"px";
}else{
var s=Div.style.left,r=/^(.+)px$/;
if(r.test(s)){
return parseInt(s.replace(r,"$1"));
}else{
return 0
}
}
}
var Distance=function(){
return -(Child().offsetWidth);
}
var Play=function(){
if(Tim)clearTimeout(Tim);
var l=Left();
if(Distance() <l){
Left(l-1);
Tim=setTimeout(Play,25); //滚动速度
}else{
var o=Child();
Div.removeChild(o);
Div.appendChild(o);
Div.style.left=0;
Tim=setTimeout(Play,500); //滚动间隔
}
}
Tim=setTimeout(Play,1000); //第一次滚动
for(var i=0;i <Img.length;i++){
Img[i].onmouseover=function(){
if(Tim)clearTimeout(Tim);
}
Img[i].onmouseout=function(){
Tim=setTimeout(Play,500); //鼠标离开后滚动间隔
}
}
}
setMarquee();
</script>
</body>
</html>
<head>
<style type="text/css">
#demo1{
position:relative;
width:694px;
height:160px;
overflow:hidden;
white-space:nowrap;
}
#demo1 div{
position:absolute;
}
</style>
</head>
<body>
<div id="demo1" valign="top">
<div>
<a href="www.baidu.net"><img border="0" src="http://www.baidu.com/img/baidu_logo.gif"></a>
<a href="www.baidu.net"><img border="0" src="http://www.baidu.com/img/baidu_logo.gif"></a>
<a href="www.baidu.net"><img border="0" src="http://www.baidu.com/img/baidu_logo.gif"></a>
<a href="www.baidu.net"><img border="0" src="http://www.baidu.com/img/baidu_logo.gif"></a>
<a href="www.baidu.net"><img border="0" src="http://www.baidu.com/img/baidu_logo.gif"></a>
<a href="www.baidu.net"><img border="0" src="http://www.baidu.com/img/baidu_logo.gif"></a>
</div>
</div>
<script type="text/javascript">
function setMarquee(){
var Tim,Div=document.getElementById("demo1").getElementsByTagName("div")[0],Img=Div.getElementsByTagName("img");
var Child=function(){
var ob = Div.getElementsByTagName("img")[0];
if(ob.parentNode.nodeName.toUpperCase()=="A") return ob.parentNode;
return ob;
}
var Left=function(s){
if(s){
Div.style.left=s+"px";
}else{
var s=Div.style.left,r=/^(.+)px$/;
if(r.test(s)){
return parseInt(s.replace(r,"$1"));
}else{
return 0
}
}
}
var Distance=function(){
return -(Child().offsetWidth);
}
var Play=function(){
if(Tim)clearTimeout(Tim);
var l=Left();
if(Distance() <l){
Left(l-1);
Tim=setTimeout(Play,25); //滚动速度
}else{
var o=Child();
Div.removeChild(o);
Div.appendChild(o);
Div.style.left=0;
Tim=setTimeout(Play,500); //滚动间隔
}
}
Tim=setTimeout(Play,1000); //第一次滚动
for(var i=0;i <Img.length;i++){
Img[i].onmouseover=function(){
if(Tim)clearTimeout(Tim);
}
Img[i].onmouseout=function(){
Tim=setTimeout(Play,500); //鼠标离开后滚动间隔
}
}
}
setMarquee();
</script>
</body>
</html>
像这样