1
SWFObject: 基于Javascript的Flash媒体版本检测与嵌入模块
2
原文:SWFObject: Javascript Flash Player detection and embed script
3
翻译:Awflasher.com
4
汉化地址:http://www.awflasher.com/flash/articles/swfobj.htm - 更新到SWFObject 1.5官方文档(Updated to 1.5 @ 070318)
5
SWFObject是一个用于在HTML中方面插入Adobe Flash媒体资源(*.swf文件)的独立、敏捷的JavaScript模块。该模块中的JavaScript脚本能够自动检测PC、Mac机器上各种主流浏览器对Flash插件的支持情况。它使得插入Flash媒体资源尽量简捷、安全。而且它是非常符合搜索引擎优化的原则的。此外,它能够避免您的HTML、XHTML中出现object、embed等非标准标签,从而符合更加标准。
6
(即:通过text/html应答页面, 而非application/xhtml+xml)
7![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
8
请注意: 由于法律原因,FlashObject已经更名为SWFObject,详见这里。
9![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
10
内容导读
11![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
12
新功能
13
实现原理
14
SWFObject范例
15
在SWFObject中应用ExpressInstall
16
下载
17
独特优势
18
常见问题
19
新功能
20
详细的更新记录可以在SWFObject 1.5 blog post这里找到。
21![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
22
实现原理
23
[对于急切需要下载的用户点击这里直接观看JS代码]
24![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
25
SWFObject的使用是非常简单的,只需要包含 swfobject.js这个js文件,然后在DOM中插入一些简单的JS代码,就能嵌入Flash媒体资源了。 下面是一个最简单的范例:
26![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
27
<script type="text/javascript" src="swfobject.js"></script>
28
29
<div id="flashcontent">
30
This text is replaced by the Flash movie.
31
</div>
32![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
33
<script type="text/javascript">
34
var so = new SWFObject("movie.swf", "mymovie", "200", "100", "7", "#336699");
35
so.write("flashcontent");
36
</script>让我们看看这些代码是如何工作的
37![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
38
<div id="flashcontent">[
]</div>首先,我们要为SWF资源预留一个HTML结点。这个HTML结点内的所有内容都会在客户端被Flash资源替换,当客户端没有安装Flash播放器的时候,这些内容会显示出来。这一特色在SEO以及对用户体验方面非常有必要。
39![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
40
var so = new SWFObject(swf, id, width, height, version, background-color [, quality, xiRedirectUrl, redirectUrl, detectKey]);创建一个新的SWFObject实例,并且传入一下参数:
41![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
42
swf - SWF文件路径
43
id - 您为这个SWF文件分配的id值,它将用于给embed与object标签设定name属性,以便于可以支持swliveconnect的功能,如动态传入变量
44
width - 宽度
45
height - 高度
46
version - FlashPlayer需要的版本号,它可以详细到 '主版本号.小版本号.细节',例如:"6.0.65"。一般地,我们只需传入主版本即可,例如:"6"。
47
background-color - Flash资源的背景色,16进制格式
48
此外,还有如下可选参数:
49![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
50
quality - 画面质量,默认为"high"。
51
xiRedirectUrl - 详见ExpressInstall相关
52
redirectUrl - 没有安装相应版本的播放器后自动跳转的目标地址
53
detectKey - 这是当忽略检测时,SWFObject将去url地址中查找的变量,默认值为“detectflash”,后续有详细介绍
54
so.write("flashcontent");将Flash资源应用到DOM里,在浏览器显示出来。
55![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
56
细节
57
SWFObject 的灵活性非常好。您完全可以事先写好HTML的其他部分,最后再回过头来添加Flash内容。这样可以确保在客户端没有Flash的情况下,用户不会一无所获;也可以确保针对搜索引擎,做了什么样的关键词优化。您完全不用像以前那样担心客户端的各种状况
58![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
59
SWFObject兼容当前各种主流浏览器,如:PC上的IE5/5.5/6, Netscape 7/8,Firefox, Mozilla, and Opera。Mac上的IE5.2, Safari, Firefox, Netscape 6/7, Mozilla, and Opera 7.5+,各种浏览器的后续版本也会继续支持
60![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
61
SWFObject检测Flash播放器版本从3开始到最新的版本号,而且也消灭了IE中“激活”的麻烦。这里有相关背景。
62![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
63
SWFObject可以方便地检查版本细节,例如我们需要v.6.0 r65 (or 6,0,65,0) 来处理SWF资源,就可以添加如下代码:
64![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
65
var so = new SWFObject("movie.swf", "mymovie", "200", "100", "6.0.65", "#336699");SWFObject的版本检测可以人工忽略。如果在特定环境下您不希望SWFObject检测版本号,那么只需要传递一个参数在HTML页面中,就可以了。SWFObject可以捕获这个参数并且跳过检测,直接写入Flash嵌入代码到DOM中。用于忽略版本检测的变量名是“detectflash”,以下是一个例子:
66![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
67
<a href="mypage.html?detectflash=false">Bypass link</a>SWFObject 范例
68
以上我们接触到的范例都最基础的,接下来我们列举一些其他功能,尤其是传入参数、变量这些使用频率较高的行为。
69![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
70
传入Flash内联参数的简单范例
71
<script type="text/javascript">
72
var so = new SWFObject("movie.swf", "mymovie", "200", "100%", "7", "#336699");
73
so.addParam("quality", "low");
74
so.addParam("wmode", "transparent");
75
so.addParam("salign", "t");
76
so.write("flashcontent");
77
</script>这里可以看到Flash支持的内联参数列表:full list of the current parameters and their possible values(adobe.com官方资源)
78![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
79
采用"Flashvars"参数传入变量
80
用Flashvars是在预加载Flash时传入数据的最佳做法,语法格式与GET变量串非常类似,如:variable1=value1&variable2=value2&variable3=value3SWFObject帮助您将这项工作变得更加明确化
81![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
82
<script type="text/javascript">
83
var so = new SWFObject("movie.swf", "mymovie", "200", "100", "7", "#336699");
84
so.addVariable("variable1", "value1");
85
so.addVariable("variable2", "value2");
86
so.addVariable("variable3", "value3");
87
so.write("flashcontent");
88
</script>这些变量将会保存在_root这个MovieClip对象里。
89![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
90
SWFObject还可以方便地直接从URL中接受参数传入Flash中,例如你有这样一个URL:http://www.example.com/page.html?variable1=value1&variable2=value2。采用getQueryParamValue()方法你就可以轻松获取这些参数,并将它们传入Flash,例如:
91![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
92![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
93
<script type="text/javascript">
94
var so = new SWFObject("movie.swf", "mymovie", "200", "100", "7", "#336699");
95
so.addVariable("variable1", getQueryParamValue("variable1"));
96
so.addVariable("variable2", getQueryParamValue("variable2"));
97
so.write("flashcontent");
98
</script>getQueryParamValue()方法同样可以获取JavaScript的Location对象的hash值“location.hash”来与swf内部进行通信。这里是一个采用SWFObject的应用程序,其中用到了location.hash对象:链接地址
99![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
100
在SWFObject中应用Express Install(利用官方自动升级接口)
101
SWFObject全面支持AdobeFlash播放器的自动升级功能(从6.0.65起的FlashPlayer支持在swf内部自动升级!),这样用户完全不用离开您的网页就能完成播放器的升级了。
102![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
103
首先,上传官方的expressinstall.swf到您的服务器上,然后使用useExpressInstall方法指定这个swf文件的地址就可以了,例如:
104![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
105
<script type="text/javascript">
106
var so = new SWFObject("movie.swf", "mymovie", "200", "100", "8", "#336699");
107
so.useExpressInstall('expressinstall.swf');
108
so.write("flashcontent");
109
</script>您可以安装一个低版本的Flash播放器然后访问这个页面看到效果
110![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
111
在SWFObject原文件压缩包中您可以找到具体的使用细节,您可以自己定制ExpressInstall的流程。
112![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
113
如果您的Flash影片在弹出窗口中,或者您希望用户在完成了ExpressInstall后重定向到其他地址,你可以采用xiRedirectUrl属性,来自动完成这一步骤。例如:
114![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
115
<script type="text/javascript">
116
var so = new SWFObject("movie.swf", "mymovie", "200", "100", "8", "#336699");
117
so.useExpressInstall('expressinstall.swf');
118
so.setAttribute('xiRedirectUrl', 'http://www.example.com/upgradefinished.html'); // must be the absolute URL to your site
119
so.write("flashcontent");
120
</script>下载
121
SWFObject基于MIT License,您可以免费任意使用。
122![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
123
下载 SWFObject 1.5 - Zip 文件, 包含 swfobject.js 和其他范例。
124![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
125
更多链接:
126![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
127
标准Flash嵌入 - 符合XHTML 1.0 Strict.*
128
全屏Flash嵌入 - 符合XHTML 1.0 Strict.*
129
含Express Install的标准Flash嵌入 - 从6.0.65起的FlashPlayer才支持此功能
130
* 页面全部是 text/html格式,不是 application/xhtml+xml.
131![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
132
更多问题可以访问我们的论坛:SWFObject论坛!
133![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
134
独特优势
135
多年以来,各种各样的Flash播放器版本检测代码层出不穷,包括嵌入脚本也有许多。我们在这一部分针对流行的几种方法进行一个比较。
136![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
137
1) Adobe官方做法
138
这就是经典的Object标签和Embed标签配合做法,也是目前最常用的做法:
139![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
140
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"
141
codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0"
142
width="550" height="400" id="Untitled-1" align="middle">
143
<param name="allowScriptAccess" value="sameDomain" />
144
<param name="movie" value="mymovie.swf" />
145
<param name="quality" value="high" />
146
<param name="bgcolor" value="#ffffff" />
147
<embed src="mymovie.swf" quality="high" bgcolor="#ffffff" width="550"
148
height="400" name="mymovie" align="middle" allowScriptAccess="sameDomain"
149
type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer" />
150
</object>虽然是目前最常用的方法,但仍然有一些问题。
151![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
152
缺乏播放器版本检测 没有播放器插件版本检测,用户会获得非常糟糕的体验,他们会在不知情的情况下看到ActiveX插件安装入口,这样会导致大部分用户离开。而且,用低版本播放器播放高版本的swf文件,会导致更多潜在问题,而用户会将一切问题归咎于您的产品
153
Eolas专利纠纷导致IE的近期发行版中需要进行一次“激活”点击才可以完成和Flash内容的交互。详细内容
154
不符合XHTML规范 - 在HTML和XHTML中都没有embed标签HTML or XHTML。因为object标签在不同浏览器中的诡异表现,我们不得不用embed标签来完善最终效果。
155
2) 仅采用Object标签 / Flash satay
156
这种方法在2002年的A List Apart article出现之后开始大面积流行,这里有两个例子:
157![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
158
'仅含Object标签'
159![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
160
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
161
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"
162
width="300" height="120">
163
<param name="movie" value="http://www.macromedia.com/shockwave/download/triggerpages_mmcom/flash.swf">
164
<param name="quality" value="high">
165
<param name="bgcolor" value="#FFFFFF">
166
<!--[if !IE]> <-->
167
<object data="http://www.macromedia.com/shockwave/download/triggerpages_mmcom/flash.swf"
168
width="300" height="120" type="application/x-shockwave-flash">
169
<param name="quality" value="high">
170
<param name="bgcolor" value="#FFFFFF">
171
<param name="pluginurl" value="http://www.adobe.com/go/getflashplayer">
172
FAIL (the browser should render some flash content, not this).
173
</object>
174
<!--> <![endif]-->
175
</object>Flash satay
176![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
177
<object type="application/x-shockwave-flash
178
data="c.swf?path=movie.swf"
179
width="400" height="300">
180
<param name="movie"
181
value="c.swf?path=movie.swf" />
182
<img src="noflash.gif"
183
width="200" height="100" alt="" />
184
</object>可用性问题 - 采用 Flash Satay 的话, 一些屏幕阅读器会忽略swf内容.
185
Eolas专利纠纷导致IE的近期发行版中需要进行一次“激活”点击才可以完成和Flash内容的交互。详细内容
186
缺乏播放器版本检测 没有播放器插件版本检测,用户会获得非常糟糕的体验,他们会在不知情的情况下看到ActiveX插件安装入口,这样会导致大部分用户离开。而且,用低版本播放器播放高版本的swf文件,会导致更多潜在问题,而用户会将一切问题归咎于您的产品
187
早期的的Safari会忽略param标签 - 在这些版本:2.0 (Tiger) 或者 1.3 (Panther) 或者可能 1.2.8 (前Panther) 之前,Safari 完全忽略param 标签。这将会让你的Flashvars等参数无法传入。
188
3) 'small flash movie on the index page' 检测方法
189
这个方法会通过在首页放一个swf文件去访问$version 变量来返回版本信息。
190![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
191
问题在于:
192![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
193
内页无检测 - 内页如果不放着这个swf就无法检测
194
“激活”问题
195
不符合HTML或者XHTML规范
196
影响搜索引擎索引排名
197
4) Adobe官方 Flash Player Detection 模块
198
Adobe官方这个模块非常不错,然而仍然有一些不足,它采用两种方法来检测
199![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
200
Flash自身检测,如上面提到的"small Flash movie on the index page" - 缺点已经提过了
201
Javascript - 混乱的代码让你的HTML变得非常难以维护
202
深入讨论在这里。
203![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
204
5) 用纯粹的JS来检测、嵌入
205
这种方法看起来不错,但是仍然缺乏规范,而且消耗开发成本
206![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
207
检测不够完善 - 通常只能检测到当前的Flash播放器发行版,而且升级也需要手工参与
208
增加了 更多 代码 - 难以维护的DOM结构
209
解决方案太笨重 - SWFObject进行了多次优化,非常轻量
210
常见问题
211
这里进入论坛可以与其他用户交流
212![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
213
问. 到底什么是 'IE的激活内容升级' 我听说过这件事情,SWFObject能应对它么?
214
答. 可以,更多详细信息可以看:这里。
215
问. 在Flash资源加载前,相关区域的内容会有闪烁(仅IE有)
216
答. 这与 FOUC bug有关。
217
问. 用 SWFObject 嵌入多个SWF该怎么做?
218
答. 只要给每一个HTML结点唯一的id就可以了。
219
问. 如何使SWFObject兼容Netscape 4.x?
220
答. 这条评论包含相关信息。
221
问. 我如何在blog中使用SWFObject?
222
答. 这里有针对WordPress的插件: 这里。
223
问. SWFObject 是否可以与 Dreamweaver 、 Golive协同工作?
224
答. 这里可以得到一个Dreamweaver 扩展在CommunityMX。目前还没有GoLive扩展。
225
问. 哪里可以找到其他语言的翻译?
226
答. 法语 ,瑞典语, 意大利语, 德语, 西班牙语, 波兰语(部分), 日语, 葡萄牙语,和 芬兰语。
227
问. 有支持FlashIDE的发布插件么?
228
答. 有!你可以在这里得到: Fluid Flash Blog。
229
问. 谁在使用SWFObject/FlashObject?
230
答. 这些网站: The Library of Congress, Adobe.com (制定的轻量版本), Amazon.com, Windows.com, YouTube.com, skype.com, Snapple.com, 包括 Adobe Photoshop (在Flash画廊中的) 和大量其他的网站. Colin Moock 也 推荐这种解决方案。
231
仍然有疑问? 这里有我之前的一些文章[1, 2, 3] 这些日志,以及评论含有许多丰富的解决思路。
232![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
233
致谢
234
Toby Boudreaux给了我大量的建议,让我的代码更加快捷可靠。
235![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
2
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
3
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
4
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
5
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
6
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
7
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
8
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
9
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
10
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
11
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
12
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
13
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
14
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
15
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
16
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
17
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
18
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
19
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
20
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
21
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
22
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
23
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
24
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
25
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
26
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
27
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
28
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
29
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
30
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
31
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
32
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
33
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
34
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
35
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
36
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
37
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
38
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
![](https://www.cnblogs.com/Images/dot.gif)
39
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
40
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
41
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
42
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
43
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
44
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
45
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
46
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
47
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
48
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
49
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
50
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
51
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
52
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
53
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
54
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
55
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
56
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
57
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
58
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
59
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
60
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
61
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
62
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
63
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
64
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
65
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
66
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
67
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
68
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
69
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
70
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
71
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
72
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
73
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
74
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
75
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
76
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
77
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
78
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
79
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
80
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
81
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
82
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
83
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
84
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
85
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
86
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
87
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
88
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
89
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
90
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
91
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
92
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
93
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
94
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
95
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
96
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
97
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
98
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
99
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
100
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
101
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
102
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
103
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
104
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
105
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
106
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
107
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
108
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
109
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
110
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
111
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
112
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
113
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
114
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
115
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
116
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
117
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
118
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
119
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
120
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
121
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
122
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
123
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
124
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
125
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
126
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
127
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
128
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
129
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
130
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
131
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
132
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
133
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
134
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
135
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
136
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
137
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
138
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
139
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
140
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
141
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
142
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
143
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
144
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
145
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
146
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
147
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
148
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
149
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
150
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
151
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
152
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
153
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
154
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
155
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
156
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
157
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
158
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
159
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
160
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
161
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
162
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
163
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
164
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
165
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
166
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
167
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
168
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
169
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
170
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
171
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
172
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
173
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
174
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
175
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
176
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
177
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
178
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
179
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
180
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
181
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
182
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
183
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
184
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
185
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
186
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
187
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
188
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
189
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
190
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
191
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
192
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
193
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
194
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
195
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
196
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
197
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
198
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
199
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
200
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
201
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
202
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
203
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
204
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
205
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
206
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
207
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
208
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
209
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
210
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
211
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
212
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
213
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
214
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
215
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
216
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
217
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
218
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
219
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
220
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
221
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
222
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
223
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
224
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
225
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
226
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
227
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
228
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
229
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
230
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
231
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
232
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
233
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
234
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
235
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)