Fancybox thingie - PullRequest
       12

Fancybox thingie

0 голосов
/ 17 февраля 2011

Я только что попытался отобразить флэш-файл и изображение с помощью Fancybox.

Чтобы представить, о чем я говорю, взгляните на следующий снимок:

http://screencast.com/t/eUFh94lFz

Задачи:

  • fancybox для автоматической загрузки при загрузке страницы с файлом .swf и .jpg
  • .swf файл должен быть центрирован, как и в примере выше
  • .jpg файл для размещения в правом нижнем углу экрана / страницы

Частично мне это удалось.

Я создал скрытую ссылку:

<a href="media/test_video.swf" id="flash-video" style="display:none"></a>

Затем я вызвал его с помощью команды Jquery:

<script type="text/javascript">$(document).ready(function() {
    $("#flash-video").fancybox(
    {
        'padding'               : 0,
        'autoScale'             : false,
        'padding'               : 0, 
        'margin'                : 0, 
        'easingIn'              : 'swing',
        'easingOut'             : 'swing',
        'transitionIn'          : 'fade',
        'transitionOut'         : 'fade',
        'hideOnContentClick'    : true,
        'speedIn'               : 600,
        'speedOut'              : 200,
        'overlayShow'           : true
    }
    ).trigger('click');
});

Я также создал скрытую ссылку для изображения, но она не отображается на оверлее Fancybox.

<a href="media/bottom-r-img.jpg" id="flash-video" style="position:absolute;right:5px;bottom:5px;"></a>

Можно ли это сделать, чтобы одновременно отображать 2 мультимедийных файла на оверлее fancybox?

Любой положительный ответ хорошо ценится:)

Спасибо.

1 Ответ

1 голос
/ 17 февраля 2011

Во-первых, вы не можете иметь дублированные идентификаторы в своем HTML-коде. Во-вторых, fancybox может отображать только одну вещь за раз.

Я бы посоветовал скрыть встроенное flash + изображение и использовать встроенный загрузчик или загрузить контент с другого URL-адреса с помощью загрузчика iframe.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...