Question

我不确定这里是否有人愿意为此提供帮助，但我真的非常非常感激！这是我建立的第一个网页，我是一个完整的新手，但我肯定在这个过程中学到了很多东西。

我在Mac上使用DreamWeaver CS4。我正在尝试让灯箱库工作。我只是想要一个简单的缩略图页面，当你点击一个时，较大的图像出现在灯箱中。我在使用Adobe Bridge工作的网站的其他页面上有画廊，但我不喜欢它们，因为它们不适用于iphone。现在，当您单击缩略图时，它们只是在没有灯箱效果的新页面中打开。

我从Lokesh Dhakar下载了灯箱。我还下载了jQuery。这是我一直试图让灯箱工作的页面：http://www.greencommamedia.com/logos.html

当我看到我拼错了“lightbox”作为“lighbox”时，我以为我已经解决了这个问题，但我想我已经解决了这个问题（虽然我真的不能确定，它是代码中的其他地方吗？）。我试图检查lightbox.css的路径是否正确。我还在灯箱索引中更改了此路径。我需要在代码中添加其他内容才能使其正常工作吗？我完全搞砸了，需要重新开始吗？我意识到我的代码是一个完整的MESS（DreamWeaver，这是我第一次尝试这样的东西！）。

我真的很感激任何指针或帮助实现这一目标。谢谢!!

我的代码：

<style type="text/css">
<!--
#linkline {
    font-family: Arial, Helvetica, sans-serif;
}
a {
    font-family: Arial, Helvetica, sans-serif;
    color: #000;
}
a:link {
    text-decoration: none;
}
a:visited {
    text-decoration: none;
    color: #FFF;
}
a:hover {
    text-decoration: none;
    color: #F60;
}
a:active {
    text-decoration: none;
    color: #F00;
}
body {
    background-color: #FFF;
    font-size: 10px;
}
#center {
    text-align: center;
}
.abouttext {
    background-color: #CCC;
}
#abouttext {
    color: #333;
    background-color: #CCC;
}
#abouttext td p span {
    font-family: Arial, Helvetica, sans-serif;
}
#center a {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 18px;
}
.copyright {
    font-family: arial;
    font-size: 12px;
    font-style: normal;
    color: #333;
    background-color: #CCC;
    text-align: center;
}
div.img a:hover img {
    background-color: #lightgrey;
}
div.desc {
    text-align: center;
    font-weight: normal;
    width: 120px;
}
body, ul, li, img {
    padding: 0;
    border: 0;
}
body {
    background: #FFFFFF;
}
#logos {
    width: 500px;
    text-align:center;
}
#logos li {
    list-style: none;
    float:left;
}
#logos a img {
    border: 5px solid #FFFFFF;
}
#logos a:hover img {
    border: 5px solid #aaa;
}
<script type="text/javascript" src="lightbox/js/jquery.js"></script> <script type="text/javascript" src="lightbox/js/jquery-1.11.0.min.js"></script> <script type="text/javascript" src="lightbox/js/lightbox.min.js"></script>
</style>
<title>logos</title>
<link href="lightbox/css/lightbox.css" rel="stylesheet" type="text/css" media="screen" />
<table width="100%" border="0" align="center">
  <tr>
    <td width="745" id="center"><img src="images/greencommalogo.jpg" alt="logo" width="700" height="200" border="0" /></td>
  </tr>
  <tr>
    <td height="33" bgcolor="#CCCCCC" font-size="18px" id="center"><a href="index.html">HOME</a> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <a href="about.html">ABOUT</a> &nbsp;&nbsp;&nbsp;&nbsp; <a href="portfolio.html">WORK</a> &nbsp;&nbsp;&nbsp;&nbsp; <a href="contact.html">CONTACT</a></td>
  </tr>
</table>
<link href="lightbox/css/lightbox.css" rel="stylesheet" />
<div id="logos">
  <ul>
    <li><a href="images/logos/3handlogoLiteracy1ad.jpg" rel="data-lightbox"><img src="images/logosthumbnails/3handlogoLiteracy1_jpg.jpg" /></a></li>
    <li><a href="images/logos/circlepencilad.jpg" rel="data-lightbox"><img src="images/logosthumbnails/circlepencil_jpg.jpg" /></a></li>
    <li><a href="images/logos/farmerlogoad.jpg" rel="data-lightbox"><img src="images/logosthumbnails/farmerlogo_jpg.jpg" /></a></li>
    <li><a href="images/logos/handlogoad.jpg" rel="data-lightbox"><img src="images/logosthumbnails/handlogo_jpg.jpg" /></a></li>
    <li><a href="images/logos/linemanad.jpg" rel="data-lightbox"><img src="images/logosthumbnails/lineman_jpg.jpg" /></a></li>
    <li><a href="images/logos/Logo5ad.jpg" rel="data-lightbox"><img src="images/logosthumbnails/Logo5_jpg.jpg" /></a></li>
    <li><a href="images/logos/storylinessealad.jpg" rel="data-lightbox"><img src="images/logosthumbnails/storylinesseal_jpg.jpg" /></a></li>
  </ul>
</div>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<table width="100%" border="0" align="center">
  <tr>
    <td>Copyright &copy; 2014 Green Comma Media</td>
  </tr>
</table>
</body></html>

更新：正如一位有用的评论者指出的那样，lightbox.js似乎没有加载。查看网络选项卡时，我收到错误消息Uncaught ReferenceError：$ is not defined logos.html：107（匿名函数）。据我所知，lightbox.js已加载，应该在哪里。我需要在代码中添加一些语言才能使其正常工作吗？谢谢你的帮助。

Lightbox无法在Dreamweaver CS4上加载

0 个答案: