问题标签 [magnific-popup]

I'm trying to create an event to a view which opens a light box when I click in the tag, but when I add the magnific pop-up code the view disappears.

Here is my html code:

And now my views and some data to test them:

I don't know if the problem is related with my views code or vith the magnific pop-up code.

Thanks

我正在使用Magnific Popups ajax popup 来创建类似于 Instagram 的弹出体验（左侧的图像，右侧的评论等）。我试图弄清楚如何使左右内容框始终具有相同的高度。如果右侧的图像太大，它会相应地适合 div，因为它应该是响应式的。此外，如果整个浏览器变得更小（可能在移动设备上），图像会出现在顶部，内容会出现在底部。

图像和内容是这样浮动的：

并且使用媒体查询减小了屏幕尺寸，浮动刚刚被清除。

我制作了一个 jsfiddle 来帮助理解我要解释的内容：

jsFiddle

如果您单击“打开”并调整 iframe 的大小，您将看到我正在寻找的效果。

那么视图容器如何设置大小并且左右内容区域总是相同的高度呢？只是简单地看一下这个例子，你会发现它看起来有点滑稽。

编辑

我还尝试将图像垂直居中，这似乎也是一个挑战。我已经尝试让 css 显示一个表格单元格然后尝试vertical-align: middle，但最终没有奏效。

该解决方案应该适用于所有现代浏览器。

我是使用magnific popup 的新手，我正在尝试在dreamweaver cs5 中实现query.magnific-popup.js。我没有更改此文件的原始语法中的任何内容，但在以下位置出现语法错误：

<meta name="selected-link" value="repo_source" data-pjax-transient />

我还在网上放置了一个带有语法的测试图像，这很有效：

有人能帮我一下吗？提前致谢。

我正在尝试将Magnific-Popup灯箱与我的 Meteor 应用程序一起使用。我遇到的问题是，当我启动画廊时，我无法关闭画廊弹出窗口。点击[x]按钮或点击背景没有任何效果。否则，灯箱似乎工作正常。使用单个弹出窗口按预期工作（包括关闭），但画廊没有。很难看到发生了什么，因为它会使 Chrome 检查器崩溃。有时我会看到以下错误：

如果我在下面的代码中设置 gallery=false，弹出窗口工作正常，但显然我失去了画廊功能......

谢谢你。

html:

js：

我已将该站点临时部署到http://miyako.meteor.com/以防万一。这是我第一次涉足 Web 开发，所以请原谅凌乱的代码！:)

我已经在我的解决方案中实现了 Magnific Popup，并且我正在使用Bootbox来获得用户的确认，即他想要关闭窗口而不保存更改等。

我连接了我的自定义函数以关闭回调，但它没有按预期工作。

这只是一个快速示例，而不是生产代码。if-else 语句在那里，因为否则 Bootbox 对话框无法显示（通常不需要检查返回的值，因为它作为参数传递，在本例中称为 result ）。

问题是，在我单击关闭按钮后，我的图像（即弹出窗口的内容）消失了。我想有机会取消关闭操作并实现我需要一个在关闭弹出窗口之前触发的事件。

这可以通过 Magnific Popup 实现吗？

我正在使用Magnific Popup 版本 0.8.9。

我正在通过 Ajax 将内容加载到其中，并且我对ajaxContentAdded. 此回调设置了一个事件处理程序，用于提交加载到弹出窗口中的表单，如下所示：

这工作正常，表单提交处理正确。事件处理函数将其发布到服务器，服务器（在发生错误的情况下）返回包括错误消息在内的整个表单。为此，我让它用返回的表单替换弹出窗口的内容，并再次设置提交处理程序。

但是，尽管closeOnContentClick在两个不同的点设置为 false，但在替换内容后单击内容时弹出窗口会立即关闭（第一次确实有效）。

顺便说一下，弹出窗口中的内容只有一个根元素。

我希望作者或其他人可以在这里提供帮助，我不知道这里出了什么问题。

非常感谢！

我对 Javascript 非常陌生，虽然有些很直观，但我感到有些失落。尝试创建一个 Jquery Magnific-popup 网站来展示 vimeo 视频，因为它是一个免费插件。我想要链接到这个弹出脚本的缩略图。

我发现自己对包含哪些文件以及不使用哪些文件感到非常困惑，因为我是 Javascript 新手。

我一直在使用这个网站： http ://dimsemenov.com/plugins/magnific-popup/documentation.html#mfp-build-tool

我应该使用哪些脚本，哪些脚本可以省略？请帮忙！我感谢任何帮助谢谢

我正在使用 Magnific Popup Responsive lightbox 插件打开一个 youtube 视频。

我的代码：

在 Chrome 中，当我单击链接时，灯箱会打开，有时会加载视频，有时则不会。大多数情况下，它只加载音频而不加载视频。

我收到警告“阻止了来源为“ http://www.youtube.com ”的框架，无法访问来源为“[我的域]”的框架。协议、域和端口必须匹配。- Chrome 通常使用 iframe 给我这个警告。它也无法加载 .swf 文件。

我正在服务器上开发，而不是在本地进行开发。

这在 Safari、Firefox 和 IE8+ 中运行良好；它仅在 Chrome 中存在此问题。

使用的插件：mb.extruder和magnific-popup

当使用 magnific-popup 在我的页面上使用以下代码的内联内容时：

它工作完美。但是，如果我使用上面相同的代码作为 mb.extruder 链接，那么它只会将该链接视为普通 url 并使用 /#test-inline 加载页面。

这是我的jQuery函数：

我已经阅读了这方面的优秀文档，这很棒。 http://dimsemenov.com/plugins/magnific-popup/documentation.html 我有基本的弹出工作正常。

我的问题是动画。我就是不能让他们工作。抱歉，如果我错过了一些非常基本的东西，但我现在花了太长时间，希望有人能指出我的错误。它目前只是看起来没有褪色。

我已经在 codepen 上玩过它，并且可以通过删除 CSS 来重新创建问题，所以也许这没有正确通过，尽管我知道它是链接的，因为它是在为弹出窗口设置样式而不是动画。

这是我的html：

我的 JavaScript 来自同一页面：

我的 CSS