- 締切済み
画像のサムネール+フォトアルバムを制作中で困っています
こんにちは。 HTML + CSS + Javascriptを使用して、「サムネール画像+フォトアルバム」を作っています。 Javascriptの知識が乏しいため、質問させていただきました。 よろしくお願いいたします。 サムネール画像の並ぶ A.html 拡大画像の並ぶ B.html CSS外部をリンクさせている C.css Javascriptを外部リンクさせている D.js の4つのファイルがあります。 A.htmlでクリックした際に数字を記憶させて B.htmlに入れ込むことがしたいです。 □A.htmlは下記で画像を並べています。 <img src="images/photo1.jpg" alt="Photo" width="120" height="120" > <img src="images/photo2.jpg" alt="Photo" width="120" height="120" > <img src="images/photo3.jpg" alt="Photo" width="120" height="120" > <img src="images/photo4.jpg" alt="Photo" width="120" height="120" > ・ ・ ・ ・ 40枚くらいあります。 □B.htmlは下記で画像を表示しています。 <div id="mainPhoto"> <img src="images/photo1.jpg" id="slidePhoto" /> </div> <div id="mainPhotoNavi"> <script type="text/javascript">count = 0; imageLength = 9; baseuri = 'images'</script> <script src="js/slideshow.js" type="text/javascript"></script> </div> ※A.htmlのphoto3.jpgをクリックしたら、3という数字が記憶されて、 B .htmlの"mainPhoto"内部のphoto(x).jpg、(x)に当てはまる。 "mainPhotoNavi"内部のcount = (x)、(x)に当てはまる。 上記のような方法をとりたいです。 どうか、よろしくお願いいたします。
- みんなの回答 (2)
- 専門家の回答
みんなの回答
a.html <html><body> <img src="test1.jpg" onCLick="j(1)"> <img src="test2.jpg" onCLick="j(2)"> <img src="test3.jpg" onCLick="j(3)"> <script> function j(n){location.href='b.html?'+n;} </script> </body> </html> ---------- b.html <html> <body> <script> var count; window.onload=function(){ count=location.search.replace('?',''); alert(count); } </script> </body> </html>
- yambejp
- ベストアンサー率51% (3827/7415)
う~ん、今回の質問はA/B両方を一緒に表示するのでしょうか? HTML自体には二つのHTMLを結合して表示するような仕組みはありません。 もしやるならA内にiframeでBを表示するか、A/Bをフレームで処理するか AからajaxでBを呼び出すかが妥当でしょう。 そうではなく、Aから別ウィンドウをひらいてBを表示するとか AからリンクでBに移動するとか、AからSubmitするとか どうしたいかによって処理がダイブ違うと思いますよ
補足
ご回答ありがとうございます。 言葉不足で申し訳ありません。 A.htmlのサムネールが並んだページから、 並んだ画像の一つとクリックすると、 B.htmlへ移動(同じウインドウ)して、 A.htmlで押した画像によって、 B.htmlで表示される画像が違う。 との仕組みを作りたいです。 画像枚数が多いので、一枚一枚リンクを貼り直すではない方法を 使ってみたいと思ってます。 よろしくお願いします!!