这个图片预览代码哪里错了啊啊啊

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><html>
<title></title>
<head>
<script type="text/javascript" src="../jquery-1.8.0.js">
$(function(){
   var x,y=10;
   $("a").mouseover(function(e){
      var view="<div class='view'><img src='"+this.href+"'/> </div>";//新建div图片节点
  $("body").append(view);  //插入节点
  $(".view")
     .css({
        "left":(e.pageX+x)+"px",//图片位置
"top":(e.pageY+y)+"px"
     }).show("fast")
   }).mouseout(function(){
$(".view").remove();
    }).mousemove(function(e){
$(".view")
.css({
"top": (e.pageY+y) + "px",
"left":  (e.pageX+x)  + "px"
});
})</script><style type="text/css">
   ul { margin:0;padding:0;}
   li {
      margin:18px;
  border:3px solid #ffff00;
  float:left;
   }
   img {
      width:130px;
  height:180px;
  display:block;
      border:none; 
   }</style>
</head>
<body>   <ul>   
      <li><a href="./img/001.jpg" > <img src="./img/s_001.jpg" /> </a></li>
      <li><a href="./img/002.jpg" > <img src="./img/s_002.jpg" /> </a></li>
      <li><a href="./img/003.jpg" > <img src="./img/s_003.jpg" /> </a></li>
      <li><a href="./img/004.jpg" > <img src="./img/s_004.jpg" /> </a></li> 
      <li><a href="./img/005.jpg" > <img src="./img/s_005.jpg" /> </a></li>
      <li><a href="./img/006.jpg" > <img src="./img/s_006.jpg" /> </a></li>  
      <li><a href="./img/007.jpg" > <img src="./img/s_007.jpg" /> </a></li>
      <li><a href="./img/008.jpg" > <img src="./img/s_008.jpg" /> </a></li>
      <li><a href="./img/009.jpg" > <img src="./img/s_009.jpg" /> </a></li>
      <li><a href="./img/010.jpg" > <img src="./img/s_010.jpg" /> </a></li>
      <li><a href="./img/011.jpg" > <img src="./img/s_011.jpg" /> </a></li>
      <li><a href="./img/012.jpg" > <img src="./img/s_012.jpg" /> </a></li>
  </ul></body>
<html>
第一次写jquery。。不知道哪里错

解决方案 »

  1.   

    语法错了$(function(){
       var x,y=10;
       $("a").mouseover(function(e){
          var view="<div class='view'><img src='"+this.href+"'/> </div>";//新建div图片节点
          $("body").append(view);  //插入节点
          $(".view")
             .css({
                "left":(e.pageX+x)+"px",//图片位置
                "top":(e.pageY+y)+"px"
             }).show("fast")
       }).mouseout(function(){
            $(".view").remove();
        }).mousemove(function(e){
            $(".view")
                .css({
                    "top": (e.pageY+y) + "px",
                    "left":  (e.pageX+x)  + "px"
                });
    })})///////少了$(funciton(){的结束标签对
      

  2.   

    没初始化x的值。。IE有问题。。
     
    var x=0, y = 10;
      

  3.   

    $(function(){
       var x = 10;
       var y = 10;
       alert("dada");
      
       $("a").mouseover(function(e){
          var view="<div class='view'><img src='"+this.href+"'/> </div>";//新建div图片节点
          $("body").append(view);  //插入节点
          $(".view")
             .css({
                "left":(e.pageX+x)+"px",//图片位置
                "top":(e.pageY+y)+"px"
             }).show("fast")
       }).mouseout(function(){
            $(".view").remove();
        }).mousemove(function(e){
           $(".view").css({
    "left":(e.pageX+x)+"px",//图片位置
                "top":(e.pageY+y)+"px"
    });
                });
    });
    //这样写就没错啦
      

  4.   

    我发现原来引入jquery要单独写。。不能和下面的<script>凑在一起..
      

  5.   

    晕。。还真没注意看你js文件加载和页面的代码写到一个script标签里面了文件加载和页面js代码块要放到2个不同script标签里面。。
      

  6.   

    加载的div要先给个position，才能随时改变坐标