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

Question

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

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

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

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

请问我该怎么做，抱歉语言不好:)

Answer 1

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

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

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

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

<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>