JQuery和更改imgsrc_Jquery - Fatal编程技术网

JQuery和更改imgsrc

jquery

JQuery和更改imgsrc,jquery,Jquery,您好，我正在学习一个教程，其中一个方面似乎不起作用，我不知道我哪里出了问题当我将鼠标悬停在缩略图上时，它会将主图像更改为我刚才悬停的图像。我想我只是在代码的JQuery部分遗漏了一些东西 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <link rel="stylesheet" href="core.css"> <meta name="robots" content="

您好，我正在学习一个教程，其中一个方面似乎不起作用，我不知道我哪里出了问题

当我将鼠标悬停在缩略图上时，它会将主图像更改为我刚才悬停的图像。我想我只是在代码的JQuery部分遗漏了一些东西

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="core.css">
<meta name="robots" content="noindex, nofollow">
<title>Build A Greyscale Image Gallery</title>

<script src="js/jquery-1.11.0.js"></script>

<script>

    $.(document).ready(function(){
        $.('.thumb').hover(function(){
            $('.main_image img').attr('src',$(this).children('img').attr('src'));
            });
    })

</script>

</head>
<body>

<h2>Build A Greyscale Image Gallery</h2>

<div class="gallery">
    <div class="main_image">
        <img src="images/aston.jpg" />
    </div>

    <div class="selection_image">
            <div class="thumb">
            <div class="overlay"></div>
            <img src="images/aston.jpg" />
        </div>
        <div class="thumb">
            <div class="overlay"></div>
            <img src="images/aston2.jpg" />
        </div>
        <div class="thumb">
            <div class="overlay"></div>
            <img src="images/aston3.jpg" />
        </div>
        <div class="thumb">
            <div class="overlay"></div>
            <img src="images/aston4.jpg" />
        </div>
        <div class="thumb">
            <div class="overlay"></div>
            <img src="images/aston5.jpg" />
        </div>
        <div class="thumb">
            <div class="overlay"></div>
            <img src="images/aston6.jpg" />
        </div>
        <div class="thumb">
            <div class="overlay"></div>
            <img src="images/aston7.jpg" />
        </div>
        <div class="thumb">
            <div class="overlay"></div>
            <img src="images/aston8.jpg" />
        </div>
        <div class="thumb">
            <div class="overlay"></div>
            <img src="images/aston9.jpg" />
        </div>
    </div>
</div>

</body>
</html>


建立一个灰度图像库
$（文档）.ready（函数（）{
$.（'.thumb'）.hover（函数（）{
$（'.main_image img'）.attr（'src'，$（this.children（'img'）.attr（'src'））；
});
})
建立一个灰度图像库

我建议您在

之后删除

。试试下面的方法

$(document).ready(function(){
    $('.thumb').hover(function(){
        $('.main_image img').attr('src',$(this).children('img').attr('src'));
    });
});

如果未添加，还建议添加

jQuery

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>