js小技巧:延时加载Flash
时间:2022-04-23
本文章向大家介绍js小技巧:延时加载Flash,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
当页面中包含自动播放视频的flash播放器时,flash的流媒体播放会一直不停的下载视频(哪怕你点击了播放暂停/停止也一样在不停下载),这样会影响到页面其它元素的加载。
最简单的优化办法就是让Flash一开始不要播放:当然,你可以修改fla源文件,让视频播放一开始就处于暂停,直到用户点击了播放按钮。但问题是,如果您嵌入的是没有源文件的flash动画,这种路子就走不通了。
思路:
可以先在放置flash的地方,放一张小图片,点击图片后再把图片元素换成对应的object标签。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>swf占位符</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$().ready(function () {
$("#rbtvs_play_pos").click(function () {
$("#swfPos").html("<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0" width="226" height="338" id="rbtvs_player" align="middle" style="z-index: -999"><param name="allowScriptAccess" value="Always" /><param name="allowFullScreen" value="false" /><param name="movie" value="http://img.rbtvs.com/swf/rbtvs_player.swf" /><param name="quality" value="high" /><param name="bgcolor" value="#efefef" /><param name="wmode" value="opaque" /><embed src="http://img.rbtvs.com/swf/rbtvs_player.swf" quality="high" bgcolor="#efefef" width="226" height="338" name="rbtvs_player" align="middle" allowscriptaccess="Always" allowfullscreen="false" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer" /></object>");
})
})
</script>
</head>
<body>
<div id="swfPos">
<img id="rbtvs_play_pos" src="http://img.rbtvs.com/bihu001/images/rbtvs_play.gif" style="cursor:pointer" alt="点击播放视频" />
</div>
</body>
</html>
运行代码 (注:如果点击运行代码后报js错误,请在页面上右击选择编码为utf-8)
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- Spring ApplicationContext 简介
- Spring 配置String转Date
- zookeeper事务
- Thread Object wait() notify()基本
- 基本排序算法(冒泡排序 选择排序 插入排序 快速排序 归并排序 基数排序 希尔排序)
- Java加解密AES、DES、TripleDES、MD5、SHA
- Java 根据经纬度计算两点之间的距离
- mysql bin log配置及查看
- mybatis interceptor 处理查询参数及查询结果
- Mybatis基础
- java mix 知识点
- js 加密 crypto-js des加密
- jvm 语法糖
- flume-kafka-storm-hdfs-hadoop-hbase
- Mybatis利用拦截器做统一分页