1

CSSトランジションでの私の最初の試みは、iOSに似たスライディングパネルシステムを使用することです。パネル以外はすべて機能しており、左からスライドして左から内側にスライドしています。私はiOSスタイルのスライダーを探しています。一方のパネルが左にスライドし、もう一方のパネルが右からスライドします。一方が戻ると、反対のことが起こります。

#container{    
    position: relative;
    overflow: hidden;
    width: 250px;
}

.panel{
    position: absolute;    
    overflow: hidden;
    top: 0;
    left: 250px;
    width: 250px;
    max-height: 0;
    -webkit-transition: left .25s linear, max-height .25s linear;
    -moz-transition: left .25s linear, max-height .25s linear;
    -o-transition: left .25s linear, max-height .25s linear;
    transition: left .25s linear, max-height .25s linear;
    display:block;
}

.panel:target{
    left: 0px;
    max-height: 9999px;
    position: relative;
}

何か案は、

素晴らしい

4

1 に答える 1

1

http://css3.bradshawenterprises.com/sliding/をご覧ください。

さまざまなパネルを一列に並べてから、上のリンクに示すようにそれらの間をスライドさせます。

于 2011-05-05T20:46:52.250 に答える