jQuery fancybox媒体助手

本文介绍了jQuery fancybox媒体助手的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我是Jquery和fancyBox v.2(fancyApps)的新手，需要澄清一下:

I am new in Jquery and fancyBox v.2 (fancyApps) and need some clarifications:

1)fancyBox媒体助手的功能/用途是什么?如果使用例如fancyBox iFrame功能，例如youtube(iframe)?

1) What is the function/purpose of fancyBox media helper and the difference if I use e.g. fancyBox iFrame feature e.g. youtube(iframe)?

$(document).ready(function() {
    $('.fancybox-media').fancybox({
        openEffect  : 'none',
        closeEffect : 'none',
        helpers : {
            media : {}
        }
    });
});

<a class="various fancybox.iframe" href="http://www.youtube.com/embed/L9szn1QQfas autoplay=1">Youtube (iframe)</a>

2)除了在标题中链接以下js之外，我还需要其他的CSS文件吗?

2) Beside linking the following js in the header, do I need addtional css file?

<script type="text/javascript" src="/fancybox/source/helpers/jquery.fancybox-media.js?v=1.0.0"></script>

谢谢

推荐答案

js文件本身的解释和使用.它使您可以定位到最常见的媒体格式(例如

The explanation and use in the js file itself. It allows you have any anchor targeting the most common media formats like

<a class="fancybox" href="http://www.youtube.com/watch?v=opj24KnzrWo">open youtube</a>

...使用简化的自定义脚本，例如

...using a simplified custom script like

$(".fancybox").fancybox({
  helpers : {
      media : {}
  }
});

(脚本中没有类型，尺寸或复杂的replace函数)

(no type, dimensions, or complex replace functions within the script)

受支持的格式(在href属性内)是:

The supported formats (inside the href attribute) are:

 *      Youtube
 *          http://www.youtube.com/watch?v=opj24KnzrWo
 *          http://youtu.be/opj24KnzrWo
 *      Vimeo
 *          http://vimeo.com/25634903
 *      Metacafe
 *          http://www.metacafe.com/watch/7635964/dr_seuss_the_lorax_movie_trailer/
 *          http://www.metacafe.com/watch/7635964/
 *      Dailymotion
 *          http://www.dailymotion.com/video/xoytqh_dr-seuss-the-lorax-premiere_people
 *      Twitvid
 *          http://twitvid.com/QY7MD
 *      Twitpic
 *          http://twitpic.com/7p93st
 *      Instagram
 *          http://instagr.am/p/IejkuUGxQn/
 *          http://instagram.com/p/IejkuUGxQn/
 *      Google maps
 *          http://maps.google.com/maps?q=Eiffel+Tower,+Avenue+Gustave+Eiffel,+Paris,+France&t=h&z=17
 *          http://maps.google.com/?ll=48.857995,2.294297&spn=0.007666,0.021136&t=m&z=16
 *

顺便说一句，您不需要任何其他CSS文件，只需按照上面的说明使用它即可.

BTW, you don't need any additional CSS file, just use it as indicated above.

这篇关于jQuery fancybox媒体助手的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

Formats