- ベストアンサー
写真表示のページ・・・
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
そういうことをやろうとした友人のために書いた簡単なコードがある。 勝手に使いやがれ…ではなくて宜しければどうぞ（ぉ ★サムネイル画像をクリックするとポップアップウインドウが開いて画像が表示されます。 ★JavaScriptが無効となっている場合は画像を直接新しいウインドウで開きます。 ☆これをHTMLファイルの<head>～</head>間にコピーしてね <script type="text/javascript"> <!-- function PIC_OPEN(image,width,height){ var PIC; PIC=window.open("","_blank","toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=no,width="+ width +",height="+ height +""); PIC.document.open(); PIC.document.write("<html>\n<head>\n<title>Garelly</title>\n"); PIC.document.write("</head>\n"); PIC.document.write("<body topmargin='40'>\n"); PIC.document.write("<center>\n<img src='"+ image +"'>\n"); PIC.document.write("<hr>\n"); PIC.document.write("<a href='javascript:window.close();'>Close</a>\n</center>\n"); PIC.document.write("</body>\n"); PIC.document.write("</html>\n"); PIC.document.close(); } //--> </script> ★<title>Garelly</title>は開かれるポップアップウインドウのタイトル部分。適宜変更。 ★topmargin='40'がページ上部の余白設定 ☆サムネイルの部分をこういう風に書こうね <a href="image01.png" target="_blank" onclick="PIC_OPEN('image01.png','400','450');return false;"><img src="image01_s.png" border="0"></a> ★image01.pngが表示させたい画像（※二ヶ所あります） ★image01_s.pngがimage01.pngのサムネイル画像 ★PIC_OPEN('image01.png','400','450');の部分は ★image01.pngが表示させたい画像のパスまたはファイル名 ★400が開かれるポップアップウインドウの幅、画像の幅+100位を目安にどうぞ ★450が開かれるポップアップウインドウの高さ、画像の高さ+150を目安にどうぞ
その他の回答 (2)
- hamue
- ベストアンサー率33% (2/6)
steel_grayさんも指摘されてますが、一つのhtmlページで（ページを切り替えずに）画像を切り替え表示させたいようでしたら、javascriptを使わないとできないと思います。 lightboxというのは画像閲覧などのために一般公開されているjavascriptのコード（ライブラリ）です、ググってみれば使用方法などもたくさん出てきますよ。 それか、ちょっと高度な方法であればcssのa:hoverを使って表示させる方法もありますけど、、、ちょっとむずいと思います。
- steel_gray
- ベストアンサー率66% (1052/1578)
画像だけを変えるなら、HTMLではなく画像を直接リンクしては？ 説明文とか画像以外も変える必要があるならもちろんHTMLとして個別に作る必要があります。 HTMLにリンクして表示したい理由が、サイズ指定したウィンドウに開きたい、とかって事なら「Lightbox」とか使った方がいいかと思う。
関連するQ&A
- 綺麗な写真アルバムのHPを作りたい☆
みなさんこんばんは☆ ホームページビルダー２００１ ver.5.0 での質問です。 写真を公開するHPを製作しているところなのですが、よく写真系のサイトで見かけるレイアウトにしたいのですが、どういう風に作ればアップ等がしやすく出来るのでしょうか？ 具体的には、アルバムトップページにサムネイルを配置し、クリックすると写真が表示されるようにしたいのですが、写真が表示される際、写真ファイルに直接リンクするのではなく、写真を中心に配置し、少々のコメントとサムネイルの前後へのリンクも貼りたいのですが、そうすると写真の枚数分ページを作成しなければならないですよね？ 一枚一枚最初から作成すると大変なので、全てのページを統一し、写真とコメントを挿入するだけで出来上がるようにしたいのですが、何か良い方法はありますでしょうか？ スタイルシートというものを使えば出来そうなのですが、使い方がさっぱりわからないので・・・。 どなたかお助けください(>_<)！ 宜しくお願いいたします。
- ベストアンサー
- ホームページ作成ソフト
- フレームタイプ？のフォトアルバムを作りたいのです
ホームページを作成しているのですが、画像をまとめてアルバム（ギャラリー）のようなものを作りたいと考えています。 lightboxやlightwindowのような、リンクをクリックするとポップアップで画像が現れるアルバムなのですが、画像のサムネイルをクリックするのではないものを探しています。 そのようなものを２，３年前にあるサイトで見かけて、今になって使ってみたいと思いＣＧＩなどをサーチしてみたのですが・・・なかなか見つかりません。 lightbox、lightwindow等はサムネイル画像をクリックするとポップアップで現れ、その画像をクリックすることで次の画像を表示できたりする・・・と理解しているのですが（間違っていましたらすみません）私が見かけたそのアルバムは、サムネイル自体をクリックして呼び出すのではなく、webページ上の文字や画像（サムネイルではないものです）からリンクされており、クリックするとフレームページ型で半透明の窓（小さめです）が現れ、その窓上の左側で選択した写真が右側に表示される・・・というものでした。 その左側はサムネイル画像ではなく、テキスト表示（もしかしたらテキスト画像だったかもしれません）でした。それもカテゴリのようにまとまったものではなく、各写真の個々のものでした。そのタイトルをクリックするとその画像（一枚）が右側に表示される、という感じです。 色々なところで見かけるlightbox等を使用したアルバムは、サムネイルをクリックするとそのサムネイル画像が拡大されて画像だけがポップアップ表示されますが、私のみたものはメニューと画像の表示範囲がまとまってポップアップ表示されるものでした。 そしてlightboxとは違い、写真が表示されている周りは黒背景ではく、後ろのwebページが見えていました。 とても説明下手なもので、わかりにくくすみません。 わかりにくいですが絵にしてみましたので、よろしければご覧いただけるとありがたいです。 当時に見かけたアルバムは、右下辺りにそのアルバムを製作された方のwebページへのリンクが貼られていた記憶があるので、配布されていたものだと思うのですが・・・ご存知の方はいらっしゃいませんでしょうか。 配布されているものでなくとも、lightboxやlightwindow等を使って作ることが可能であればその方法など教えていただけるとありがたいです。 どうぞよろしくお願いします。
- 締切済み
- その他（インターネット・Webサービス）
- 写真のサムネイルを表示する（ホームページでのアルバム）
初歩的な質問ですが、写真をホームページにのせているのですが、 画像がおっきくてレイアウトがうまくいきません。 そこでサムネイルを並べて表示して、そのサムネイルをクリックしたら本当の大きさの画像がみれるようにしたいのですが、いいプログラム（ＪＡＶＡ？）あったら教えてください。ひとつひとつにリンクつけるのもめんどくさいので（汗）
- ベストアンサー
- CSS
- ページが重いから？表示スピードが遅いんです
教えて下さい・・・ 【ホームページビルダー8】で会社ＨＰを作成しています。 トップページ（index.html)のサイズは32KB、他ページはhtmlファイルが34個あります。 それぞれ44KB、12KB、7KB、3KBが4個、写真掲載ページはサムネイル化して別ウィンドゥで開くようにしていて1KBのファイルが27個あります。 全体的に写真(JPEG)や画像(GIF)が多いページだとは思うのですが・・・表示スピードが遅いんです。 写真の画質を下げるなどの方法は試してみました。 なにかよい方法はないでしょうか？？
- ベストアンサー
- ホームページ作成ソフト
- 写真をポップアップで拡大表示したい
複数写真のサムネイルがある画面で、 サムネイルをクリックした時に 「閉じる」ボタンがついた ポップアップ画面で表示させたいのですが。 ポップアップ画面のサイズは、固定なので ポップアップ画面のhtmlは、ひとつで 元のサムネイルによって、 表示する写真を変えたいのですが。 外部ファイルで処理をしたいのですが。 できるんでしょうか？ よろしくお願いします。
- 締切済み
- その他（プログラミング・開発）
- 写真表示ページで印刷もできるようにしたい
jQueryを使って写真ギャラリーのページを作成しており、好みの小さい写真をクリックすると同じページ内に大きな写真（webページで表示出来る程度のサイズ）を表示するというページを作っています。 そのクリックされた写真を同ページ内にある写真を印刷というボタンを押すと写真印刷用の@media printが呼び出され、写真以外の情報は表示しないようにしたいのです。 プレビューを見ると<p>や<h1>タグなどのテキスト情報はdisplay:noneでは消えないようです。 また、ページのタイトル、日付、ページのURL、ページの枚数情報なども表示されてしまうようなのですが、これらを表示せずに、画像のみを印刷できるようにする方法はありませんか？
- 締切済み
- CSS
- 掲載写真の拡大
ＷＥＢページ等に掲載したサムネイル写真をクリックして拡大写真にする方法を教えて頂きたく、お願いします。 サムネイル写真と別ページに作成した拡大写真をリンクでつなげる方法しかないのであれば、だいたい分かるような気がします。
- 締切済み
- ホームページ作成ソフト
- 自分のHPに写真を30枚ほどサムネイル表示させています。
自分のHPに写真を30枚ほどサムネイル表示させています。 サムネイル画像をクリックすると新たにポップアップの形で別ウィンドウが開き、そこには拡大された写真と戻る、閉じる、次へ、のボタンが表示されます。当然、次へボタンを押すとサムネイルで次にある写真が表示されます。これらの部分はJavaScript(window.open)で書いています。 しかし、この場合、写真の枚数だけHTMLファイルを作る必要があります。 HTMLファイルは共通で使用して、写真をはめ込みにして、「戻る」、「次へ」ボタンが押されたら写真だけ入れ替わる、という風にはできないのでしょうか？ イメージだけの希望ですが、なにかヒントになるようなアドバイスがありましたらよろしくお願いいたします。
- ベストアンサー
- JavaScript
- jsファイルを使って、複数の写真を一つのhtmlファイルで表示
jsファイルを使い、一つのhtmlファイルで写真表示をサムネイル式に表示して、クリックしたらもう一つのhtmlファイルで拡大版を表示して、その写真画面をクリックしたら再度サムネイルのページに戻れるようなスクリプトを無料配布している所をご存知ありませんでしょうか。 なんどか自分でやってはみたけど、どうしても上手く行きませんでした。よろしくお願いします。
- ベストアンサー
- JavaScript
- 写真の表示について
今ホームページを作っていて画像のサムネイルにリンクを貼って大きい写真を表示したいと思っています。だけど表示される写真には写真以外に白い空白やツールバーが表示されてしまいます。写真と「閉じる」や「最小化」などの部分だけを表示させる方法を教えてください。
- ベストアンサー
- ホームページ作成ソフト
