提供zblog模板 emlog模板 dedecms模板的下载和仿站定制
当前位置:网站首页 > 教程 > 正文

swf文件做背景时自适应宽高的解决办法

天兴工作室 2019-10-10 教程 183 0 评论


有个客户要求用swf文件做页面背景,但是弄上去之后发现swf文件的宽度高度自适应这块很不好控制,如果直接设置宽度和高度为100%是不起作用的。

折腾了一番最后终于解决,分享下解决办法。

首先将swf文件调用放到一个div包裹起来,代码大概是这样:

<div class="swf-box"><embed id="movie" src="swf文件地址" wmode="transparent" width="100%" height="100%"></div>

然后设置外部div的宽度为100%;高度也是100%;position: absolute;上左距离为0;z-index的值设置小一点,然后页面正文内容部分的z-index设置大一点,这样将这个div设置成了一个背景。

再来解决swf文件的自适应宽高度问题,首先要确定你的swf默认宽高度是多少,然后算一个宽高度比例。例如宽度是1000px,高度是500px,那么宽高比就是50%。

得到这个比例后,写以下js代码:

<script type="text/javascript">document.getElementById("movie").style.height = document.getElementById("movie").scrollWidth*0.5+"px"</script>

用js强行给swf文件设置一个高度,这个高度就是宽度的50%。这样就完成了swf文件宽高度自适应了。


ps:现在很多浏览器都默认关闭了flash插件。所以用swf文件做背景天兴工作室是不太推荐的。

没有找到解决你问题的教程?

您可以试着搜索一下或者直接在线提问。我们也提供收费技术支持,有需要可以在线联系我们。

在线提问 在线客服

取消回复欢迎 发表评论:

  • 请填写验证码
  • 最新文章
  • 热文排行
  • 最多评论
标签聚合
×58zblog模板×33zblog×27zblogphp×20zblogphp模板×18天兴工作室×16阿里云×12dedecms×11电子券×11ytcms×11zblog企业模板×10天兴互联×10zblog插件×9随意打×9模板×9zblog安装×9zblogphp1.5×9zblog错误×8天兴通讯×8刷机×8企业模板

请登录

社交账号登录

将本文分享给你的朋友们