实现图片右移显示的代码错误

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>Web Design</title>

<link rel="stylesheet" type="text/css" href="layoutstyle.css">

</head>

<body>

<h1>Web Design</h1>

<p>these are the things you should know.</p>

<ol id="linklist">

<li>

<a href="structure.html">Structure</a>

</li>

<li>

<a href="presentation.html">Presentation</a>

</li>

<li>

<a href="behavior.html">Behavior</a>

</li>

</ol>

<div id="slideshow">

<img src="j_06.jpg" alt="building blocks of web design" id="preview">

</div>

<script  src="slideshow.js"></script>

</body>

</html>

//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////


window.onload=Slideshow;


function Slideshow() {

var preview=document.getElementById("preview");

preview.style.positon="absolute";

preview.style.left="0px";

preview.style.top="0px";

//取得表中所有连接

var list=document.getElementById("linklist");

var links=list.getElementsByTagName("a");

//为mouseover事件添加动画效果

links[0].onmouseover=function() {

moveElement("preview",-100,0,10);

}

links[1].onmouseover=function() {

moveElement("preview",-200,0,10);

}

links[2].onmouseover=function() {

moveElement("preview",-300,0,10);

}

}


function moveElement(elementID,final_x,final_y,interval){//后面的位置

var elem=document.getElementById(elementID);

if (elem.movement){

clearTimeout(elem.movement);

}

var xpos=parseInt(elem.style.left);//得到坐标

var ypos=parseInt(elem.style.top);

if(xpos==final_x&&ypos==final_y) {return true;}

if (xpos<final_x){xpos++;}

if(xpos>final_x){xpos--;}

if (ypos<final_y){ypos++;}

if(ypos>final_y){ypos--;}

elem.style.left=xpos+"px";

elem.style.top=ypos+"px";

var repeat="moveElement('"+elementID+"',"+final_x+","+final_y+","+interval+")";

elem.movement=clearTimeout(repeat,interval);

}


////////////////////////////////////////////////////////////////////////////////////////////////////////////////

运行后浏览器F12不报错但也不运行js的功能只有html结构

慕粉3900206
浏览 1436回答 1
1回答
打开App,查看更多内容
随时随地看视频慕课网APP