css - ブロックの上位25％のみを表示

Question

css3を使用して生成された特定の形状があります。ブロックの一部のみを表示したい。例：上の25％または下の25％。どうすればこれを達成できますか？

例： http： //jsfiddle.net/HNyHM/1/ ; 上から25％だけ表示したい。

Answer 1

これをチェックして。http://jsfiddle.net/LB8mC/

CSS 形状を div 内にラップし、形状を表示する正確な高さ、幅を指定します。次に、ラッパーに対して絶対に形状を配置します。

これが私がフィドルで使用したものです。

  .shape-wrapper {
        position:relative;
        overflow:hidden
        height: 25px;
  }



  .shape-wrapper > div {
        top: -25px;
        left: -25px;
     }

子 div の位置を変更し続けることができます (JS を使用して求めていたように、上位 25% または下位 25%)。

Answer 2

ラッパー div を追加すると役立つ場合があります。ただし、固定サイズの開始についてはhttp://jsfiddle.net/HNyHM/3/を参照してください。