如何使用CSS实现嵌入FLASH视频自适应长宽

html-css021

如何使用CSS实现嵌入FLASH视频自适应长宽,第1张

为了嵌入并使其自适应长宽,准备了一个非常有用的CSS技巧。在我进一步之前,引入介绍这个CSS技巧。 部分CSS样式代码如下;

.video {

position: relative

padding-bottom: 56.25%

height: 0

overflow: hidden

}

.video iframe,

.video object,

.video embed {

position: absolute

top: 0

left: 0

width: 100%

height: 100%

}

可以把FLASH外部调用

首先建立一个JS文件flash.js。写入如下代码:

function swf(file,w,h) {

document.write('<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="'+w+'" height="'+h+'">')

document.write('<param name="movie" value="' + file + '">')

document.write('<param name="quality" value="high">')

document.write('<param name="wmode" value="transparent">')

document.write('<param name="menu" value="false">')

document.write('<embed src="' + file + '" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="'+w+'" height="'+h+'"></embed>')

document.write('</object>')

}

随后在页面中调用下:

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

<div id="flash">

<script type="text/javascript" language="javascript">swf(designyesky.swf)</script>

</div>

flash的样式写在CSS中即可。