【原】可关闭，可重播的flash弹出广告代码

以前都是下别人的过来改，老是出现各种各样的莫名其妙的问题。今天终于爆发了。自己写了一个。还是学到一些东西的。不多说，上代码：





代码

1
var
popFlash
=

new
Object();

2
popFlash
=
{

3

//
初始化

4

init :
function
(options){

5

if
(
typeof
(options)
!=
'
object
'
){

6

return

false
;

7
}

8

//
初始化参数

9

this
.options
=
{

10

//
广告显示宽度

11

width : (options.width
?
options.width :
500
),

12

//
广告显示高度

13

height : (options.height
?
options.height :
300
),

14

//
广告显示时长

15

showTime : (options.showTime
?
options.showTime :
5000
),

16

//
广告插件基准路径

17

basePath : (options.bathPath
?
options.basePath :
""
),

18

//
swf文件名

19

swfSrc : (options.swfSrc
?
options.swfSrc :
"
ad.swf
"
),

20

//
缩略图文件名

21

iodSrc : (options.iocSrc
?
options.iocSrc :
"
ioc.gif
"
),

22

//
广告指向的链接

23

adHref : (options.adHref
?
options.adHref :
"
about:blank
"
)

24
}

25
},

26

27

//
拼装打开状态的html

28

createOpenedHtml :
function
() {

29

var
openedHtml
=

""
;

30
openedHtml
+=

'
<div id="openedLayer" style="width:
'
+

this
.options.width
+
'
px; height:
'
+

this
.options.height
+
'
px; display:block;">
'
;

31
openedHtml
+=

'
<div style="position:relative">
'
;

32
openedHtml
+=

'
<div id="closer" style="cursor:pointer;" onclick="javascript:popFlash.hidden();" >
'
;

33
openedHtml
+=

'
<img src="
'
+
this
.options.basePath
+
'
closer.gif" border="0"/>
'
;

34
openedHtml
+=

'
</div>
'
;

35
openedHtml
+=

'
<a href="
'
+

this
.options.adHref
+
'
" target="_blank" style="padding:0;margin:0;position:absolute;">
'
;

36
openedHtml
+=

'
<img src="
'
+

this
.options.basePath
+
'
blank.gif" width="
'
+

this
.options.width
+
'
" height="
'
+

this
.options.height
+
'
" border="0" />
'
;

37
openedHtml
+=

'
</a>
'
;

38
openedHtml
+=

'
<OBJECT id="swfObj" codeBase=http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0 height=
'
+
this
.options.height;

39
openedHtml
+=

'
width=
'
+
this
.options.width
+
'
classid=clsid:d27cdb6e-ae6d-11cf-96b8-444553540000>
'
;

40
openedHtml
+=

'
<PARAM NAME="_cx" VALUE="20320"/><PARAM NAME="_cy" VALUE="2117"/>
'
;

41
openedHtml
+=

'
<PARAM NAME="FlashVars" VALUE=""/><PARAM NAME="Movie" VALUE="
'
+
this
.options.basePath
+
this
.options.swfSrc
+
'
"/>
'
;

42
openedHtml
+=

'
<PARAM NAME="Src" VALUE="
'
+
this
.options.basePath
+
this
.options.swfSrc
+
'
"/><PARAM NAME="WMode" VALUE="Transparent"/>
'
;

43
openedHtml
+=

'
<PARAM NAME="Play" VALUE="-1"/><PARAM NAME="Loop" VALUE="-1"/>
'
;

44
openedHtml
+=

'
<PARAM NAME="Quality" VALUE="High"/><PARAM NAME="SAlign" VALUE=""/>
'
;

45
openedHtml
+=

'
<PARAM NAME="Menu" VALUE="0"/><PARAM NAME="Base" VALUE=""/>
'
;

46
openedHtml
+=

'
<PARAM NAME="AllowScriptAccess" VALUE="always"/><PARAM NAME="DeviceFont" VALUE="0"/>
'
;

47
openedHtml
+=

'
<PARAM NAME="EmbedMovie" VALUE="0"/><PARAM NAME="BGColor" VALUE=""/>
'
;

48
openedHtml
+=

'
<PARAM NAME="SWRemote" VALUE=""/><PARAM NAME="MovieData" VALUE=""/>
'
;

49
openedHtml
+=

'
<PARAM NAME="SeamlessTabbing" VALUE="1"/><PARAM NAME="Profile" VALUE="0"/>
'
;

50
openedHtml
+=

'
<PARAM NAME="ProfileAddress" VALUE=""/><PARAM NAME="ProfilePort" VALUE="0"/>
'
;

51
openedHtml
+=

'
<PARAM NAME="AllowNetworking" VALUE="all"/><PARAM NAME="AllowFullScreen" VALUE="false"/>
'
;

52
openedHtml
+=

'
<embed allowscriptaccess="always" menu="false" width="
'
+
this
.options.width
+
'
" height="
'
+
this
.options.height
+
'
" wmode="Transparent"
'
;

53
openedHtml
+=

'
src="
'
+
this
.options.basePath
+
this
.options.swfSrc
+
'
" quality="high"
'
;

54
openedHtml
+=

'
pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" name="swfObj"></embed>
'
;

55
openedHtml
+=

'
</OBJECT>
'
;

56
openedHtml
+=

'
<iframe id="asdIframe" src="about:blank" style="position:absolute; visibility:inherit;width:
'
+
this
.options.width
+
'
px;height:
'
+
this
.options.height
+
'
px;
'
;

57
openedHtml
+=

'
z-index:-1;filter:Alpha(Opacity=0); opacity:0.0; MozOpacity:0.0; KhtmlOpacity:0.0;left:0px;top:0px;"></iframe>
'
;

58
openedHtml
+=

'
</div>
'
;

59
openedHtml
+=

'
</div>
'
;

60

61

return
openedHtml;

62
},

63

64

//
拼装关闭状态的html

65

createClosedHmtl :
function
(){

66

var
closedHtml
=

''
;

67
closedHtml
+=

'
<div id="closedLayer" style="position:absolute;left:0px;top:0px; display:block;">
'
;

68
closedHtml
+=

'
<img src="
'
+
this
.options.basePath
+
'
ioc.gif" />
'
;

69
closedHtml
+=

'
<div style="width:76px;padding:2px;height:15px;">
'
;

70
closedHtml
+=

'
<div style="float:left;">
'
;

71
closedHtml
+=

'
<img src="
'
+
this
.options.basePath
+
'
replay_little.gif" border="0" onclick="popFlash.show();" style="cursor:pointer" />
'
;

72
closedHtml
+=

'
</div>
'
;

73
closedHtml
+=

'
<div style="float:right">
'
;

74
closedHtml
+=

'
<img src="
'
+
this
.options.basePath
+
'
close_little.gif" border="0" onclick="popFlash.closeAd();" style="cursor:pointer" />
'
;

75
closedHtml
+=

'
</div>
'
;

76
closedHtml
+=

'
</div>
'
;

77
closedHtml
+=

'
</div>
'
;

78

return
closedHtml;

79
},

80

81

//
显示广告

82

show :
function
(){

83

//
隐藏关闭状态

84

var
closedLayer
=
document.getElementById(
"
closedLayer
"
);

85

if
(closedLayer
&&
closedLayer.style.display
==

"
block
"
) {

86
closedLayer.style.display
=

"
none
"
;

87
}

88

//
显示打开状态

89

var
openedLayer
=
document.getElementById(
"
openedLayer
"
);

90

if
( openedLayer
&&
openedLayer.style.display
==

"
none
"
){

91
openedLayer.style.display
=

"
block
"
;

92
}
else
{

93

//
document.writeln(popFlash.createOpenedHtml());

94

document.body.innerHTML
+=
popFlash.createOpenedHtml();

95
}

96
popFlash.setPosition();

97

98

//
到了显示时长就影藏

99

this
.timer
=
setTimeout(
"
popFlash.hidden()
"
,
this
.options.showTime);

100

101
},

102

103

//
影藏广告

104

hidden :
function
(){

105
clearTimeout(
this
.timer);

106

//
影藏打开装态

107

var
openedLayer
=
document.getElementById(
"
openedLayer
"
);

108

if
(openedLayer
&&
openedLayer.style.display
==

"
block
"
) {

109
openedLayer.style.display
=

"
none
"
;

110
}

111

112

//
显示关闭状态

113

var
closedLayer
=
document.getElementById(
"
closedLayer
"
);

114

if
( closedLayer
&&
closedLayer.style.display
==

"
none
"
){

115
closedLayer.style.display
=

"
block
"
;

116
}
else
{

117

//
document.writeln(popFlash.createClosedHmtl());

118

document.body.innerHTML
+=
popFlash.createClosedHmtl();

119
}

120
popFlash.setPosition();

121
},

122

123

//
彻底关闭广告

124

closeAd :
function
(){

125

var
openedLayer
=
document.getElementById(
"
openedLayer
"
);

126

var
closedLayer
=
document.getElementById(
"
closedLayer
"
);

127

128

if
(openedLayer){

129
openedLayer.innerHTML
=

""
;

130
}

131

if
(closedLayer){

132
closedLayer.innerHTML
=

""
;

133
}

134
},

135

136

//
设置广告显示的位置

137

setPosition :
function
(){

138

var
openedLayer
=
document.getElementById(
"
openedLayer
"
);

139

var
closedLayer
=
document.getElementById(
"
closedLayer
"
);

140

141

if
(openedLayer){

142

var
marginLeft
=

this
.options.width
/
2;

143

var
marginTop
=

this
.options.height
/
2;

144

var
css
=

"
position:absolute;top:50%;left:50%;margin-left:-
"
+
marginLeft
+
"
px;margin-top:-
"
+
marginTop
+
"
px;
"
;

145
css
+=

"
width:
"
+
this
.options.width
+
"
px;height:
"
+
this
.options.height
+
"
px;
"
;

146

147
openedLayer.style.cssText
+=
css;

148
}

149

150

if
(closedLayer){

151

var
css
=

"
position:absolute;top:50%;left:100%;margin-left:-100px;margin-top:-40px;
"
;

152
css
+=

"
width:80px;height:80px;
"
;

153

154
closedLayer.style.cssText
+=
css;

155
}

156
}

157
}

使用方法也很简单：





代码

1
<!
DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
>

2

<
html
xmlns
="http://www.w3.org/1999/xhtml"
>

3

<
head
>

4

<
meta
http-equiv
="Content-Type"
content
="text/html; charset=utf-8"

/>

5

<
title
>
无标题文档
</
title
>

6

<
script
type
="text/javascript"
language
="javascript"
src
="popFlash.js"
></
script
>

7

</
head
>

8

9

<
body
>

10

<
script
>

11
popFlash.init({width:
700
,height:
275
});

12
popFlash.show();

13

</
script
>

14

</
body
>

15

</
html
>

init的参数可以参照源码中的options对象，缺省的可以不写