javascript - 设置 Blueimp 照片库的困难

标签 javascript html css blueimp

我知道 stackOverflow 已经有很多关于 Blueimp Photo Gallary 的问题,但我的问题太基础了,找不到答案,这就是我来问的原因。

我无法设置 Blueimp,我已经按照 github 的步骤进行操作,但它根本不起作用。除此之外,我想从我的 flickr 获取图片 url,这可能吗?我认为是,但我不知道如何。

如果有人能帮助我,我会很高兴。

非常感谢。

<html lang="en">
<head>
<!--[if IE]>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<![endif]-->
<meta charset="utf-8">
<title>blueimp Gallery</title>
<link rel="stylesheet" href="css/blueimp/blueimp-gallery.min.css">

<script>
document.getElementById('links').onclick = function (event) {
    event = event || window.event;
    var target = event.target || event.srcElement,
        link = target.src ? target.parentNode : target,
        options = {index: link, event: event},
        links = this.getElementsByTagName('a');
        blueimp.Gallery(links, options);
};
</script>

</head>
<body>
    <!-- The Gallery as lightbox dialog, should be a child element of the document body -->
<div id="blueimp-gallery" class="blueimp-gallery blueimp-gallery-controls">
    <div class="slides"></div>
    <h3 class="title"></h3>
    <a class="prev">‹</a>
    <a class="next">›</a>
    <a class="close">×</a>
    <a class="play-pause"></a>
    <ol class="indicator"></ol>
</div>

<div id="links">
    <a href="img/surf/1.jpg" title="Banana">
        <img src="img/surf/1.jpg" alt="Banana">
    </a>
    <a href="img/surf/1.jpg" title="Banana">
        <img src="img/surf/1.jpg" alt="Banana">
    </a>
    <a href="img/surf/1.jpg" title="Banana">
        <img src="img/surf/1.jpg" alt="Banana">
    </a>
</div>

</body> 
<script src="js/blueimp/blueimp-gallery.min.js"></script>
</html>

最佳答案

在 blueimp-gallery.js 之前加载 jquery

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="js/blueimp/blueimp-gallery.min.js"></script>

并检查 Chrome 控制台是否有任何错误。

关于javascript - 设置 Blueimp 照片库的困难,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25168189/

相关文章:

javascript - 如何在高级编译模式下使用 Google Closure 编译器编译 jQuery UI 小部件?

javascript - 如何获取servlet中从ajax调用传递过来的数组

html - 如何防止 outlook 破坏 div 大小? (通讯)

html - 悬停更改背景颜色但不更改文本颜色

javascript - 如何居中 DIV 弹出窗口?

html - CSS Div&Classes 样式优先级

javascript - 使用 Javascript 更改没有 id 的 DOM 元素的 css

javascript - jQuery 根据数据属性值查找元素不起作用

javascript - noscript 标签,如果未启用,我需要提供替代 html

android - Whatsapp 链接不适用于 ios