Question

我希望div的宽度与'iframe'相同，目前它使div的宽度更大！

提前致谢

<div id="box3" onmouseup="$('#box3').stop().animate({boxShadow: '10px 10px 15px', top: 0}, 'fast')" 
onmousedown="$('#box3').stop().animate({boxShadow: '3px 3px 3px', top: 3}, 'fast')" style="top: 0px;
box-shadow: 10px 10px 15px 0px rgb(102, 102, 102);">
<iframe width="700" height="525" id="SHADDOW" src="http://www.youtube.com/embed/LRo-L9zYf-M" frameborder="0" allowfullscreen="allowfullscreen"></iframe>
</div>

Answer 1

可能太明显了，但只是让它与iframe的宽度相同：

#box3 { width : 700px; }

另一种可能的选择：

#box3 { float : left; }

float:left可能会产生您不想要的“副作用”，但您不必关心内容的宽度。

除此之外：我强烈建议将您的脚本和CSS 移出 HTML属性并移植到外部CSS和javaScript文件中。像这样的代码很难维护。

Answer 2

使用此脚本：

<script>
$(function(){
$("#box3").css("width",$("#SHADDOW").css("width"));
});
</script>

Answer 3

<div id="box3" onmouseup="$('#box3').stop().animate({boxShadow: '10px 10px 15px', top: 0}, 'fast')" onmousedown="$('#box3').stop().animate({boxShadow: '3px 3px 3px', top: 3}, 'fast')" style="top: 0px;
width: 700px;
box-shadow: 10px 10px 15px 0px rgb(102, 102, 102);">
<iframe width="700" height="525" id="SHADDOW" src="http://www.youtube.com/embed/LRo-L9zYf-M" frameborder="0" allowfullscreen="allowfullscreen"></iframe>
</div>

你如何改变这个div的宽度？

3 个答案: