IE 中的 Colorbox - 加载外部页面,尝试下载内容,而不是播放

发布于 2024-12-09 23:00:21 字数 1590 浏览 1 评论 0原文

简单项目: http://mannyllerena.com/

当您在 IE 中并单击“Live Interviews”时,它会提示您下载媒体而不是允许它从调用的 URL 播放......

更多的是设计师而不是编码员。需要一些帮助!

这是 JQuery:

$(document).ready(function(){
        //Examples of how to assign the ColorBox event to elements
        $("a[rel='example1']").colorbox();
        $("a[rel='example2']").colorbox();
        $("a[rel='example3']").colorbox();
        $("a[rel='example4']").colorbox();
        $("a[rel='example7']").colorbox();
        $(".example7").colorbox({width:"40%", height:"25%", iframe:true});

        //Example of preserving a JavaScript event for inline calls.
        $("#click").click(function(){ 
            $('#click').css({"background-color":"#f00", "color":"#fff", "cursor":"inherit"}).text("Open this window again and this message will still be here.");
            return false;
        });
    });

这是 HTML:

<a class="projects example7" href="http://www.floordaily.net/UploadedFiles/RadioInterviews/MP3/Manny_2-15-08.mp3"  title=" " rel="example7">Live<br />Interviews</a>
<a class="example7" href="http://www.floordaily.net/UploadedFiles/RadioInterviews/MP3/Manny%20from%20Mohawk%27s%20Floorscapes%20meeting%20in%202008.mp3"  title=" " rel="example7"></a>
<a class="example7" href="http://www.floordaily.net/UploadedFiles/RadioInterviews/MP3/Manny%20Llerena%20Discusses%20the%20Highlights%20of%20Mohawks%20Aligned%20Retailer%20Meeting.mp3"  title=" " rel="example7"></a>

Simple project: http://mannyllerena.com/

When you are in IE and click on "Live Interviews" it prompts you to download the media rather than allowing it to play from the called URL...

More of a designer than coder. Need some help!

And here is JQuery:

$(document).ready(function(){
        //Examples of how to assign the ColorBox event to elements
        $("a[rel='example1']").colorbox();
        $("a[rel='example2']").colorbox();
        $("a[rel='example3']").colorbox();
        $("a[rel='example4']").colorbox();
        $("a[rel='example7']").colorbox();
        $(".example7").colorbox({width:"40%", height:"25%", iframe:true});

        //Example of preserving a JavaScript event for inline calls.
        $("#click").click(function(){ 
            $('#click').css({"background-color":"#f00", "color":"#fff", "cursor":"inherit"}).text("Open this window again and this message will still be here.");
            return false;
        });
    });

And here is HTML:

<a class="projects example7" href="http://www.floordaily.net/UploadedFiles/RadioInterviews/MP3/Manny_2-15-08.mp3"  title=" " rel="example7">Live<br />Interviews</a>
<a class="example7" href="http://www.floordaily.net/UploadedFiles/RadioInterviews/MP3/Manny%20from%20Mohawk%27s%20Floorscapes%20meeting%20in%202008.mp3"  title=" " rel="example7"></a>
<a class="example7" href="http://www.floordaily.net/UploadedFiles/RadioInterviews/MP3/Manny%20Llerena%20Discusses%20the%20Highlights%20of%20Mohawks%20Aligned%20Retailer%20Meeting.mp3"  title=" " rel="example7"></a>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

沫雨熙 2024-12-16 23:00:21

这里的问题不在于 IE 中的颜色框,而在于 IE 如何处理视频和音频文件。它还取决于每个人的 IE 设置方式。通常浏览器会内置一些功能来播放音乐和视频文件。然而,微软认为您会更乐意使用他们的另一个产品并打开媒体播放器。

为了防止这种情况,您需要将音乐或视频文件嵌入到预构建的播放器中。雅虎提供了一个非常简单的解决方案,全部用 javascript 完成 - 或者更确切地说,您对播放器所做的一切都是用 javascript 完成的。以下是将其集成到 colorbox 中需要执行的步骤:

1) 设置一个单独的页面,其中包含播放器的所有代码。这里是:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Click blocker test</title>
<script type="text/javascript">
    var YWPParams = {
        autoplay:true,
        volume:0.5
    };
</script>
<script type="text/javascript" src="http://webplayer.yahooapis.com/player-beta.js"></script>
</head>

<body style="font-size:200%">
    <a id="test1" href="http://www.floordaily.net/UploadedFiles/RadioInterviews/MP3/Manny_2-15-08.mp3" style="display:none">Video</a><br />
</body>
</html>

2) 然后在包含 mp3 文件链接的页面中:

$("#playerLink").colorbox({
    iframe: true,
    width:"50%",
    height:"50%" //or whatever dimensions you like
});

基本上它的工作方式(使用这些设置)是 Yahoo 脚本搜索任何带有 .mp3 扩展名的链接并加载他们进入播放器。有关雅虎播放器设置的更多信息,请访问此处

这只是一个玩家的例子,还有很多。这里有一个 jquery mp3 播放器,但是只要搜索嵌入式 mp3 播放器就会给你很多结果。

The issue here is not with the colorbox in IE, but rather how IE handles video and audio files. It will also be dependant on how each person has their IE set up. Normally a browser will have something built-in to play music and video files. Microsoft, however, assumes that you would be much happier using another of their products and opens media player.

To prevent this, you will need to embed your music or video files into a prebuilt player. Yahoo offers a pretty easy solution that's all done in javascript - or rather, everything you do with the player is in javascript. Here are the steps you'll need to take to integrate that into colorbox:

1) Set up a seperate page with all the code for the player. Here goes:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Click blocker test</title>
<script type="text/javascript">
    var YWPParams = {
        autoplay:true,
        volume:0.5
    };
</script>
<script type="text/javascript" src="http://webplayer.yahooapis.com/player-beta.js"></script>
</head>

<body style="font-size:200%">
    <a id="test1" href="http://www.floordaily.net/UploadedFiles/RadioInterviews/MP3/Manny_2-15-08.mp3" style="display:none">Video</a><br />
</body>
</html>

2) Then in the page with the link to your mp3 file:

$("#playerLink").colorbox({
    iframe: true,
    width:"50%",
    height:"50%" //or whatever dimensions you like
});

Basically the way it works (with these settings) is that the Yahoo script searches for any links with an .mp3 extension and loads them into the player. More info on the settings for Yahoo's player can be found here.

This is just an example of one player, there's a bunch out there. There's a jquery mp3 player here, but just searching for embedded mp3 players will give you plenty of results.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文