javascript - jQuery - bpopup 插件，我需要重现方面的帮助

Question

我已经尝试了所有我能想到的 - 包括每个 bpopup 和 jquery javascript 文件，甚至是我在一个示例中找到的 .json 文件，但似乎无法让这个东西工作。我将所有脚本文件都包含在与我尝试运行的示例相同的文件夹中:

bpopup(jQuery 插件)，Code Example .我的非工作 example here .

这是我试图开始工作的最后一个链接，它只是一个起点。我浏览了 examples here .它只显示了我想使用的一些很酷的东西。下载页面和随附文件并在 Dreamweaver 中打开它对我也不起作用。

任何帮助将不胜感激。 jfiddle 示例有效，但是我看不到它们链接到哪些脚本文件 - 它们必须以某种方式上传到 jfiddle。我在 stackoverflow 上尝试使用 bpopup 时搜索了其他问题，但是我找不到一个完整的、未损坏的(分为各个部分)解决方案，即整个 html 页面以及链接到嵌入在 head 标签中的脚本文件。

非常感谢，

布莱恩

Answer 1

需要添加jQuery.js、jquery.bpopup-0.9.4.min.js、jquery.easing.1.3.js > 和样式表。例如，

JS:

http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js
http://dinbror.dk/bpopup/assets/jquery.bpopup-0.9.4.min.js
http://dinbror.dk/bpopup/assets/jquery.easing.1.3.js

来自他们网站的样式表:

http://dinbror.dk/bpopup/assets/style.min.css

还有这段代码

$(function(){
    $('#pop').click(function(){
        $('#popup').bPopup();
    });
});

HTML:

<div id="popup" style="display: none;">
    <span class="button b-close"><span>X</span></span>
    If you can't get it up use<br />
    <span class="logo">bPopup</span>
</div>

Works Fine (单击弹出按钮)。

CSS:(在弹出窗口中使用)与 another example

#popup, .bMulti {
    background-color: #FFF;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 0 0 25px 5px #999;
    color: #111;
    display: none;
    min-width: 450px;
    min-height: 250px;
    padding: 25px;
}

#popup .logo {
    color: #2B91AF;
    font: bold 325% 'Petrona',sans;
}

.button.b-close, .button.bClose {
    border-radius: 7px 7px 7px 7px;
    box-shadow: none;
    font: bold 131% sans-serif;
    padding: 0 6px 2px;
    position: absolute;
    right: -7px;
    top: -7px;
}

.button {
    background-color: #2B91AF;
    border-radius: 10px;
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.3);
    color: #FFF;
    cursor: pointer;
    display: inline-block;
    padding: 10px 20px;
    text-align: center;
    text-decoration: none;
}

更新:在您的示例(给定链接)中，您加载了 jQuery 三次，最重要的是，您加载了 插件 (bPopup) 不止一次，最后又是 jQuery，所以 jQuery 对象改变了。因此，只需先加载单个版本的 jQuery，然后加载 jquery.easing.js，然后加载 bPopup.js(最小/扩展) .同时加载 stylesheet (style.js)，其中包含为 popup div 声明的样式。