0

邪魔にならないように移動するのではなく、ある div の幅を別の div の上にスライドさせる css トランジションを作成することは可能ですか?

4

1 に答える 1

0

はい、可能です。HTML と CSS は次のとおりです。

HTML:

<body>

  <div class="overlord"></div>
  <div class="target"></div>

</body>

CSS:

.target
{
  z-index:-1;
  position:fixed;
  left:120px;
  width:100px;
  height:100px;
  background:blue;
}

div.overlord
{
  float:left;
  z-index:999;
  width:100px;
  height:100px;
  background:red;
  transition:width 2s;
  -webkit-transition:width 2s; /* Safari */
}

div.overlord:hover
{
  z-index:999;
  width:300px;
}

JSFIDDLE

于 2013-10-30T23:28:42.080 に答える