こんにちは。
用意させていただいた画像のように、ボタンをクリックで隠れてるコンテンツをスライドで表示させるようにしたいです。
(説明が下手なので、画像を作成してみました)
巷にあるjQeryのプラグインではウィンドウの端を起点としてメニューやコンテンツがスライドしてくるものが多いのですが、今回は固定幅のコンテンツの右側を起点として表示させたいのです。
[開]ボタンを押すと #side エリアが、#wrap の右側を起点として、#contents にオーバーレイしてスライドするようなかたちです。
巷にある既存のカスタマイズすれば良いのでしょうが私にとってちょっと敷居が高いです。
初期(閉まってる状態)
![初期(閉まってる状態)]WIDTH:600
展開後(開いてる状態)
![イメージ説明]WIDTH:600
lang
1<div id="wrap"> 2 3<div id="contents"> 4コンテンツエリア 5</div><!-- /#contents --> 6 7<div id="side"> 8<p>サイドメニュー<p> 9<p><a href="#">開</a></p> 10 11<div class="box"> 12<div><img src="jpg" alt="">タイトル</div> 13<p>左画像に対してのテキスト左画像に対してのテキスト左画像に対してのテキスト</p> 14</div> 15 16<div class="box"> 17<div><img src="jpg" alt="">タイトル</div> 18<p>左画像に対してのテキスト左画像に対してのテキスト左画像に対してのテキスト</p> 19</div> 20 21<div class="box"> 22<div><img src="jpg" alt="">タイトル</div> 23<p>左画像に対してのテキスト左画像に対してのテキスト左画像に対してのテキスト</p> 24</div> 25 26</div><!-- /#side --> 27</div><!-- /#wrap -->
どうぞよろしくお願いいたします。
何か質問がございましたらお気軽にお願いします。
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2015/06/10 00:12