将创建的div调整为父div

Question

当父div的宽度发生变化时，如何使创建的div的宽度调整为父div。 例如，当我的网页缩小创建的div（标题类型）溢出父div。

var $discDiv = $("<div></div>");
$discDiv.css({
  width:$(".col-md-8").width(),
  height:$(".col-md-8").height()*0.3,
  backgroundColor:"blue",
  position:"absolute",
  zIndex: 1,
  opacity:0,

});
$(".col-md-8").append($discDiv);

$(".col-md-8").mouseenter(function() {
  $discDiv.css({
  opacity:0.3

  });

});

Pen

Answer 1

只需将width更改为百分比值

即可

$discDiv.css({
  width:$(".col-md-8").width(),
  height:"100%",
  backgroundColor:"blue",
  position:"absolute",
  zIndex: 1,
  opacity:0
});

并添加鼠标假以获得更好的渲染效果：

$(".col-md-8").mouseleave(function() {
  $discDiv.css({
     opacity:0
  });
});