<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>这个是一个关于动画效果的例子</title> </head> <body> <p id="message">an short message</p> <script src="../js/addLoadEvent.js"></script> <script src="../js/positionMessage.js"></script> <script src="../js/moveMessage.js"></script> <!--<script src="../js/add.js"></script>--> </body> </html>
//第一个JS
function addLoadEvent(func){
var oldOnload = window.onload;
if(typeof window.onload != 'function'){
window.onload = func;
}else{
window.onload = function(){
oldOnload();
func();
}
}
}function moveElement (ele_id,p_x,p_y,interval){
if(!document.getElementById)return false;
if(!document.getElementById("ele_ID"))return false;
var ele=document.getElementById("ele_id");
var xpos=parseInt(ele.style.left);
var ypos=parseInt(ele.style.top);
if(xpos==p_x&&ypos==p_y) {
if (xpos < p_x) {
p_x++;
}
if (xpos > p_x) {
p_x--;
}
if (ypos > p_y) {
p_y--;
}
if (ypos < p_y) {
p_y++;
}
ele.style.left = xpos + "px";
ele.style.top = ypos + "px";
var repeat = "moveElement('" + ele_id + "'," + p_x + "," + p_y + "," + interval + ")";
movement = setTimeout(repeat, interval);
}
}
addLoadEvent(moveElement);document.write("<script language='javascript' src='../js/moveElement.js'></script>");
function positionMessage(){
if(!document.getElementById)return false;
if(!document.getElementById("message"))return false;
var ele=document.getElementById("message");
ele.style.position="absolute";
ele.style.left="50px";
ele.style.top="50px";
moveElement("message",125,125,20);
}
addLoadEvent(positionMessage);上面的三个功能分别写在三个不同的JS文件里面但是在同一个文件夹里面,经过引用却无法实现相应的效果,看过控制面板上面没有明显的错误,但是为何就是实现相应的效果呢?
紫皇夜雨
慕瓜9220888
MarlboroKay
随时随地看视频慕课网APP
相关分类