花哨的东西
我只是尝试用 Fancybox 显示 Flash 文件和图像。
要想象我在说什么,请看下一张快照:
http://screencast.com/t/ eUFh94lFz
任务:
- fancybox 在页面加载时自动加载,其中 .swf 文件和 .jpg
- .swf 文件居中,就像上面的示例一样
- .jpg 文件位于屏幕的右下角/page
我部分成功了。
我创建了一个隐藏链接:
<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>
可以这样做,同时在 fancybox 覆盖层上显示 2 个媒体文件吗?
任何积极的回答都将不胜感激:)
谢谢。
I just tried to display a flash file and an image with Fancybox.
To imagine about what am I talking, please take a look on the next snapshoot:
http://screencast.com/t/eUFh94lFz
Tasks:
- fancybox to be loaded automatically on pageload with the .swf file and the .jpg
- .swf file to be centered as it is also on the example above
- .jpg file to be positioned on the right bottom of the screen/page
Partially i succeeded.
I created a hidden link:
<a href="media/test_video.swf" id="flash-video" style="display:none"></a>
Then i called it through Jquery command:
<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');
});
I created also a hidden link for the image, but it is not displayed on the Fancybox overlay.
<a href="media/bottom-r-img.jpg" id="flash-video" style="position:absolute;right:5px;bottom:5px;"></a>
Can this be done, to show up 2 media files on a fancybox overlay at the same time?
Any positive answer is well apreciated :)
Thank you.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
首先,HTML 代码中不能有重复的 ID。
其次,fancybox一次只能显示一件事。
我建议隐藏 Flash + 图像内联并使用内联加载器,或者使用 iframe 加载器从不同的 URL 加载内容。
First, you can't have duplicated IDs in your HTML code.
Second, fancybox can only display one thing at a time.
I would suggest to hide your flash + image inline and to use the inline loader, or to load the content from a different URL using the iframe loader.