为什么我的swf占用了比实际更多的空间？ [英] Why is my swf taking up more space than it actually is?

问题描述

我创建了一个简单的Flash动画，就像我的网站首页上的幻灯片一样工作。因为容器是640×500，周围填充了10px，所以我把swf 620做成了480。出于某种奇怪的原因，每当我预览我的网站或上传到我的主机服务器，滚动条出现，表明动画是稍大。我不明白我做错了什么。这里是关于动画和容器的HTML：

 < div class =mainspace> 
 
< object classid =clsid：d27cdb6e-ae6d-11cf-96b8-444553540000width =620height =480id =windexslideshow> 
< param name =movievalue =images / indexslideshow.swf/> 
< param name =wmodevalue =transparent/> 
<！ -  [if！IE]>  - > 
< object type =application / x-shockwave-flashdata =images / indexslideshow.swfwidth =620height =480> 
< param name =movievalue =images / indexslideshow.swf/> 
< param name =wmodevalue =transparent/> 
<！ - <！[endif]  - > 
< a href =http://www.adobe.com/go/getflash>< img src =http://www.adobe.com/images/shared/download_buttons/get_flash_player。 gifalt =Get Adob​​e Flash player/>< / a> 
<！ -  [if！IE]>  - > 
< / object> 
<！ - <！[endif]  - > 
< / object> 
< / div> 
  

这里是容器的CSS：

  .mainspace {
 width：620px; 
 height：480px; 
溢出：auto; 
 position：absolute; 
 text-align：left; 
 margin：0px 0px 0px 160px; 
 padding：10px; / *添加到上面的内容区域（宽度和高度），所以它实际上是640×500 * / 
 z-index：1; 
} 
 
 .mainspace img {
 border：none; 
} 
 
 .mainspace .slide {
 margin-left：auto; 
 margin-right：auto; 
 width：620px; 
} 
 
 .imglinks1 {
 margin-left：auto; 
 margin-right：auto; 
 width：50px; 
 border：none; 
 z-index：2; 
} 
 
 .imglinks2 {
 margin：0 0px 0 0px; 
 float：left; 
 border：none; 
 z-index：3; 
} 
 
 body .mainspace {
} 
 
 .mainspace p {margin：0px 0 14px 0;} 
 
 .mainspace h1 {margin-left：10px;字体大小：18像素;颜色：＃56AD3D; clear：both;} 
 .mainspace h2 {margin-left：10px;字体大小：15像素;颜色：＃56AD3D; clear：both;} 
 .mainspace h3 {margin-left：30px;字体大小：15像素;颜色：＃56AD3D;} 
 .mainspace h4 {margin-left：40px;字体大小：15像素; color：＃56AD3D;} 
 .mainspace h5 {font-size：16px;} 
 .mainspace h6 {font-size：16px;} 
 
 .mainspace a：link {颜色：＃E0D3C6; text-decoration：none;} 
 .mainspace a：visited {color：＃56AD3D; text-decoration：none;} 
 .mainspace a：hover {color：＃56AD3D;文本修饰：无;} * / 
  

解决方案

code>< div class =mainspace> 实际上是620x480（不是640x500，如你所说），填充10px。这使得< div>< / code> 600x460的实际区域，因为填充在里面，所以你是溢出来的。

更改

  .mainspace {
 width：620px; 
 height：480px; 
 ... 
  

到

  .mainspace {
 width：640px; 
 height：500px; 
 ... 
  

I created a simple flash animation to work like a slideshow on the front page of my website. Because the container was 640 by 500 with a padding of 10 px all around, I made the swf 620 by 480 to fit perfectly. For some strange reason, whenever I preview my site or upload it to my host server, scroll bars appear, indicating that the animation is slightly too big. I can't understand what I'm doing wrong. Here's the HTML pertaining to the animation and the container:

<div class="mainspace">

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="620" height="480" id="windexslideshow">
<param name="movie" value="images/indexslideshow.swf"/>
<param name="wmode" value="transparent"/>
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="images/indexslideshow.swf" width="620" height="480">
    <param name="movie" value="images/indexslideshow.swf"/>
    <param name="wmode" value="transparent"/>
<!--<![endif]-->
    <a href="http://www.adobe.com/go/getflash"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player"/></a>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object> 
</div>

And here's the CSS for the container:

.mainspace {
width:620px;
height:480px;
overflow:auto;
position:absolute;
text-align:left;
margin:0px 0px 0px 160px;
padding:10px; /*adds to the content area above (width and height), so it's actually 640 by 500*/
z-index:1;
}

.mainspace img {
border:none;
}

.mainspace .slide {
margin-left:auto;
margin-right:auto;
width:620px;
}

.imglinks1 {
margin-left:auto;
margin-right:auto;
width:50px;
border:none;
z-index:2;
}

.imglinks2 {
margin:0 0px 0 0px;
float:left;
border:none;
z-index:3;
}

body .mainspace {
}

.mainspace p {margin:0px 0 14px 0;}

.mainspace h1 {margin-left:10px; font-size:18px; color:#56AD3D; clear:both;}
.mainspace h2 {margin-left:10px; font-size:15px; color:#56AD3D; clear:both;}
.mainspace h3 {margin-left:30px; font-size:15px; color:#56AD3D;}
.mainspace h4 {margin-left:40px; font-size:15px; color:#56AD3D;}
.mainspace h5 {font-size:16px;}
.mainspace h6 {font-size:16px;}

.mainspace a:link {color:#E0D3C6; text-decoration:none;}
.mainspace a:visited {color:#56AD3D; text-decoration:none;}
.mainspace a:hover {color:#56AD3D; text-decoration:none;}*/

解决方案

The <div class="mainspace"> Is actually 620x480 (not 640x500, as you said), with a padding of 10px. This makes the actual area of the <div> 600x460, since padding is on the inside, so you are overflowing.

Change

.mainspace {
  width:620px;
  height:480px;
  ...

to

.mainspace {
  width:640px;
  height:500px;
  ...

这篇关于为什么我的swf占用了比实际更多的空间？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！