いろいろやってみたのですが、上手くいかず、救いを求めてココにやってきました。。。すみません。。。
#wrapper{ display:block; margin:0 auto; overflow:hidden; background:rgba(68,136,79,1); width:700px; height:1000px; } #aaa{ display:block; position:relative; right:-300px; float:right; background:rgba(128,255,0,1); width:300px; height:300px; z-index:1; } #bbb{ display:block; position:relative; left:-300px; background:rgba(0,255,255,1); width:300px; height:300px; z-index:1; } #ccc{ display:block; position:relative; right:-300px; float:right; background:rgba(204,153,153,1); width:300px; height:300px; z-index:1; } #ddd{ display:block; position:relative; left:-300px; background:rgba(255,255,153,1); width:300px; height:300px; z-index:1; } #aaa-btn{ display:block; position:relative; top:-550px; right:50px; float:right; background:rgba(128,255,190,1); width:200px; height:50px; } #bbb-btn{ display:block; position:relative; top:-600px; background:rgba(0,255,190,1); width:200px; height:200px; } #ccc-btn{ display:block; position:relative; top:-550px; right:50px; float:right; background:rgba(204,153,190,1); width:200px; height:50px; } #ddd-btn{ display:block; position:relative; top:-500px; background:rgba(255,255,190,1); width:200px; height:200px; } aaa bbb ccc ddd go to aaa go to bbb go to ccc go to dddcss はちょっと違います。。
すみません。
まずは状況から説明させていただきます。
モニターの可視領域を作り、その中にボタンを4つ作りました。
btnA B C D という風です。
それから、モニターの不可視領域にコンテンツABCDを作りました。
イラストαの状況です
次にそれぞれのbtnにプログラムしたいです。
・btnAをクリックしたら、不可視領域にあるAが左から右へスライドしてきて、可視領域の中央に配置される。
・そのとき、すべてのbtnA B C Dはクリック不可。
・Aが元の不可視領域に戻るには「Aそのもの」をクリックする。
・Aが元に戻って、また、btnA B C Dはクリック可能になる。
イラストβの状況です。
また、btnA C は「左から右へ」、btnB Dは「右から左へ」動かしたいです。
このケースでif文を考えるとき、如何にしたら良いのでしょうか?
教えてください。
お願いいたします