jQuery - bpopup插件,我需要帮助再现

Question

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

bpopup(jQuery plugin),代码示例.我的非工作示例在这里.

这是我试图开始工作的最后一个环节,仅作为一个起点.我在这里看了一些例子.它只显示了我想要使用的一些很酷的东西.下载页面和附带的文件并在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

来自他们网站的StyleSheet:

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>

工作正常(单击弹出按钮).

CSS :(用于弹出窗口)另一个例子

#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了三次,最重要的是,您已经加载了plugin (bPopup)多次,最后jQuery再次加载,因此jQuery对象已更改.因此,只需先加载一个verion,jQuery然后加载jquery.easing.js然后加载bPopup.js(min/expanded).同时加载stylesheet(style.js)为popupdiv 声明的样式.