寫真、スクリーンショットの一部など、25 枚の寫真がある場合、これらの寫真はすべて UL に含まれます。初期畫面では10枚の寫真が表示されますが、詳細ボタンをクリックすると10枚すべてが上にスクロールして非表示になります。下にスクロールすると10枚の寫真があります。一度に表示できる畫像は 10 枚までです。もう一度クリックすると5枚の寫真が表示されます。最後にクリックすると初期狀態(tài)に戻ります。この効果を?qū)g現(xiàn)するにはどうすればよいですか?皆さんに説明してください。わかりません
まず親コンテナのposition:relative,top:0,left:0,transition:all .5を制御します
ファーストクリック寫真10枚の高さをマイナスしてください
2番目のクリック20枚の寫真の高さを引いたもの
......
他も同様
前回: トップ:0
2 階の正解は、カルーセルは一般的にこの考えに従っているということです。まず、親が隠れなくなり、その後は高さを調(diào)整し続けるだけで問題ありません。
上の階の正解は、一般的なカルーセルがこのアイデアに従っており、CSS のアニメーション効果も優(yōu)れており、より良いエクスペリエンスを提供するため、js jq アニメーションを使用して記述することをお勧めします。