对象元素自动高度不起作用

Question

您好我正在尝试将Flash游戏添加到html网页。

＆＃13;

＆＃13;

.gameplace{
    padding: 10px;
    background-color: #ffffff;
    border: dashed #c4b470 1px;
    height: 100%;
    min-height: 100%;
}
.gameplace object{
    width: 853px;
    height: 100%;
}

＆＃13;

<div class='main-filler'>
<div class='main-info'>  
    <div class='gameplace'>
        <object data='test.swf'></object>
    </div>
</div>
</div>

＆＃13;

＆＃13;

＆＃13;

我想自动计算swf文件的高度，但什么都没有出现。相反，如果我设置一个特定的高度，swf文件将正常运行，问题是我想通过浏览器自动放置swf文件的真实高度..

请问我怎么能这样做，对不好的语言表示抱歉：）

Answer 1

用swf对象替换image元素应该可以正常工作。

＆＃13;

＆＃13;

$("#getHeight1").click(function() {
  alert($("#swfobject1").height());
});

$("#getHeight2").click(function() {
  alert($("#swfobject2").height());
});

＆＃13;

  .gameplace {
    padding: 10px;
    background-color: #ffffff;
    border: dashed #c4b470 1px;
    height: 100%;
    min-height: 100%;
  }
  .gameplace img {
    width: 100%;
    height: auto;
  }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='main-filler'>
  <div class='main-info' style='width: 200px;'>
    <div class='gameplace'>
      <img src="http://lorempixel.com/400/200" id="swfobject1"/>
    </div>
  </div>
</div>

<div class='main-filler'>
  <div class='main-info'>
    <div class='gameplace'>
      <img src="http://lorempixel.com/400/200" id="swfobject2"/>
    </div>
  </div>
</div>

<p>
  <button id="getHeight1">Get height of object 1</button>
  <button id="getHeight2">Get height of object 2</button>
</p>

＆＃13;

＆＃13;

＆＃13;