Question

如何使用FancyBox显示图像？我已经试了几个小时了。

HTML：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>`  
    <script type="text/javascript" src="js/fancyBox/source/jquery.fancybox.pack.js"></script>  
    <link rel="stylesheet" href="js/fancyBox/source/jquery.fancybox.css" type="text/css" media="screen"/>


<a class="fancybox" href="house.jpg"><img src="house.jpg" alt="" height="400px" width="400px"/></a>  

<script>
    $(document).ready(function() {
        $('.fancybox').fancybox();
    });
</script>

Answer 1

如@JFK所述，您可能需要更高版本的jQuery。使用Fancybox提供的演示文件的示例：

<!DOCTYPE html>

<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>Fancybox Example</title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>`  
    <script type="text/javascript" src="js/fancyBox/source/jquery.fancybox.pack.js"></script>  
    <link rel="stylesheet" href="js/fancyBox/source/jquery.fancybox.css" type="text/css" media="screen"/>
</head>
<body>
<a class="fancybox" href="js/fancybox/demo/1_b.jpg">
    <img src="lib/fancybox/demo/1_b.jpg" alt="" height="400px" width="400px"/>
</a> 
</body>
</html>

<script>
    $(document).ready(function() {
        $('.fancybox').fancybox();
    });
</script>

使用FancyBox显示图像

1 个答案: