让视频在网页上无缝播放
我有一个 157 MB 的 mov 文件。我尝试在我的页面上使用 javascript 滚动动画运行它，动画非常断断续续，事实上我使用 css 来模拟遮罩，但东西没有被遮罩，可能会导致整个页面的缓慢，页面永远不会完全加载后，电影文件几乎无法滚动页面。文件太大了。我目前将其嵌入为这样：
<a href="#">
<object class="im" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab" height="286" width="655">
<param name="src" value="why_eating_dry_fruit_is_unhealthy.MOV">
<param name="autoplay" value="false">
<param name="type" value="video/quicktime" height="286" width="655">
<embed src="why_eating_dry_fruit_is_unhealthy.MOV" height="286" width="655" autoplay="false" type="video/quicktime" pluginspage="http://www.apple.com/quicktime/download/">
</object>
</a>
我的问题是：
1）我应该将 mov 转换为 swf - 也就是说，swf 是否是一种更兼容且更适合在 html 网页中无缝集成的格式？
2) 无论我选择哪一个，如何减小文件大小 - 就像 YouTube 上的视频无缝运行一样？我计划使用 javascript 滚动浏览视频库，因此我需要视频不会让页面陷入困境。
3) 此外，许多拥有视频库的网站都有一个指示“点击播放”的图标。这是视频本身的一部分，还是我可以创建一个图像，然后单击时播放视频？
我有 Adobe Flash CS4 Professional，如果这很重要的话。如果mov文件更合适，那么我怎样才能减少它的文件大小？
感谢您的回复。
I have a mov file that's 157 megabytes. I try running it on my page within a javascript scroller animation and the animation is very choppy and in fact I used css to simulate a mask but the thing doesn't get masked, probably do to the sluggishness of whole page, the page never fully loads, and the movie file makes it nearly impossible to scroll through the page. The file is just too huge. I currently have it embedded as such:
<a href="#">
<object class="im" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab" height="286" width="655">
<param name="src" value="why_eating_dry_fruit_is_unhealthy.MOV">
<param name="autoplay" value="false">
<param name="type" value="video/quicktime" height="286" width="655">
<embed src="why_eating_dry_fruit_is_unhealthy.MOV" height="286" width="655" autoplay="false" type="video/quicktime" pluginspage="http://www.apple.com/quicktime/download/">
</object>
</a>
My question is:
1) Should I convert the mov to swf - that is, is swf a more compatible and appropriate format for seamless integration in html web page?
2) Whichever I choose, how do I reduce the file size - like on youtube where the videos run seamlessly? I plan on using javascript to scroll through a gallery of videos, so I need the videos to not bog down the page.
3) Also, a lot of sites with galleries of videos have an icon that indicates "click to play". Is that part of the video itself or can I just create an image and then when clicked on, the video plays?
I do have Adobe Flash CS4 Professional, if that matters. And if mov file is more suitable, then how can I reduce its file size?
Thanks for response.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
首先：检查是否在所有浏览器中都会发生这种情况。尝试禁用所有扩展和主题，然后看看它是否运行良好。
其次：检查完毕后，返回此答案。
第三：继续阅读这个答案。
制作三个版本：移动版、桌面版和高清版，让用户决定。
如果您使用的是 Mac，则可以使用 QuickTime X 来减小文件大小。如果您拥有 Windows 计算机，则可以使用各种工具，例如 Miro Video Converter。
点击播放按钮只是使用 JavaScript 将带有属性的
玩得开心！
First of all: Check if this happens in all browsers. Try disabling all extensions and themes and look if it's working well then.
Secondly: After checking, return to this answer.
Thirdly: Continue reading this answer.
Make three versions: mobile, desktop and HD, and let the user decide.
Reducing the filesize can be done with QuickTime X if you have a Mac. If you have a Windows computer, various tools are available, such as Miro Video Converter.
Click to play buttons are simply buttons which inject the
<object>tag with attributes into the DOM using JavaScript. They are usually not part of the video itself, unless it's Flash. However, Flash is slowly coming to it's end and HTML 5 supports the new<video>tag which rules. :DHave fun!