Php 产品的Javascript图像框_Php_Javascript_Css_Web Applications

Php 产品的Javascript图像框

php javascript css web-applications

Php 产品的Javascript图像框,php,javascript,css,web-applications,Php,Javascript,Css,Web Applications,我正在寻找一个“图像显示”脚本类似的例子如下所示。在小图片上悬停，大图片会发生变化（类似于Amazon.com、eBay和许多其他电子商务网站）是否有任何库/代码可用于执行此操作示例1 ------------------------------------------------------------------ 示例2 下面是一个小例子，当将鼠标悬停在较小的图像上时，它将更改较大的图像 <html> <head> <script src="htt

我正在寻找一个“图像显示”脚本类似的例子如下所示。在小图片上悬停，大图片会发生变化（类似于Amazon.com、eBay和许多其他电子商务网站）

是否有任何库/代码可用于执行此操作

示例1

------------------------------------------------------------------

示例2

下面是一个小例子，当将鼠标悬停在较小的图像上时，它将更改较大的图像

<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
    <script>
    $(document).ready(function() {
        $('.smallImage').hover(function() {
            $('.bigImage').attr('src',this.src);
        });
    });
    </script>
    <style>
        .bigImage {
            width: 100px;
            height: 100px;
            display: block;
        }
        .smallImage {
            width: 50px;
            height: 50px;
            display: inline;
        }
    </style>
</head>
<body>
    <div id="imagesDiv">
        <img class="bigImage" src="Blue hills.jpg"></img>
        <img class="smallImage" src="Blue hills.jpg"></img>
        <img class="smallImage" src="Sunset.jpg"></img>
        <img class="smallImage" src="Water lilies.jpg"></img>
    </div>
</body>
</html>


$（文档）.ready（函数（）{
$（'.smallImage'）.hover（函数（）{
$（'.bigImage'）.attr（'src'，this.src）；
});
});
.bigImage{
宽度：100px；
高度：100px；
显示：块；
}
.smallImage{
宽度：50px；
高度：50px；
显示：内联；
}

这是css、php还是javascript问题？如果把所有的东西都放在一起，那么外面就有数百万个画廊。如果是关于“如何使图像在悬停状态下出现在大框中”的问题，那么最简单的事情就是

document.getElementById（'largeImage'）。src=this.src。请说得更具体些