0

我对 JQuery（和一般的 HTML）非常陌生，我正在尝试获得一个叠加层，以便在单击图像时显示和播放嵌入的电影。但是，该图像不可点击，我不明白为什么。

这是我的代码：

<style>
    .film_overlay {
     display:none;
     z-index:500;
     background-color:#d0d0d0;
     width:520;
     min-heigth:300;
     border:1px solid #666;
     -moz-box-shadow:0 0 90px 5px #000;
     -webkit-box-shadow:0 0 90px 5px #000;
 }
 .film_overlay .close {
     background-image:url(http://www.destinationfjallen.se/sites/destfjallen/files/close.png);
     position:absolute;
     right:-15px;
     top:-15px;
     cursor:pointer;
     height:35px;
     width:35px;
 }
</style>

<img class="karta" src="http://www.destinationfjallen.se/sites/destfjallen/files/film1.jpg" rel="#film"/>

<div class="film_overlay" id="#film">
     <iframe src="http://player.vimeo.com/video/54730694?title=0&amp;byline=0&amp;portrait=0&amp;autoplay=1" width="500" height="281" frameborder="0"webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
</div>

<script>
$(document).ready(function () {
   $("img[rel]").overlay();
});
</script>

我很感激我能得到的所有帮助！

4

3 回答 3

0

我不认为 $("img[rel]") 是一个正确的选择器。

如果您想选择具有特定rel值的图像，您可以尝试

$("img[rel=#film]")

顺便说一句，我会删除#你的 id (id="film")，不确定你是否可以选择$("##film")

此外rel，这不是img标签的正确属性。见http://www.w3.org/TR/REC-html40/struct/objects.html#edef-IMG

于 2013-07-18T09:53:11.387 回答
0

.overlay()不是 jQuery 的一部分。它是 jQuery 工具库中的一个插件。你必须包括它。将以下行添加到<head>页面的一部分（加载 jQuery 之后）：

<script src="http://cdn.jquerytools.org/1.2.7/full/jquery.tools.min.js"></script>
于 2013-07-18T10:05:11.427 回答
0

您需要在页面的 head 标签中添加脚本源，因为它是一个插件。以下链接将帮助您了解更多关于 Jquery Overlay

http://jquerytools.org/documentation/overlay/

于 2013-07-18T10:16:23.137 回答