- ベストアンサー
サムネイル画像の拡大
サムネイル画像がオンマウス時に拡大するようにしたいと思い、色々調べました。 画像をtableタグ（表！？）の中に表示させようとすると、デザインが崩れるものばかりでした。 ようやく下記のサイトに辿り着き、デザインも崩さずに画像を拡大させることが出来たのですが・・・・・・ 複数の画像を同じように拡大できるようにしようとした所、拡大した画像が他の画像（拡大するように設定しているサムネイル画像）の下に表示されてしまいます。 これをサムネイル画像の下にならないようにするにはどうしたら良いのでしょうか？？？ また、この方法以外でも、比較的簡単でデザインを崩さない拡大のやり方があれば教えて下さい。 お願いします。 私が試したサイオトは下記のものです↓ http://tonecontrol.mods.jp/memo/css_thumbnail.html
- syosinsyasan
- お礼率60% (59/98)
- HTML
- 回答数1
- ありがとう数8
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
a.thumbnail { display: block; float: left; margin: 0.3em 10px 0.3em 0; } a.thumbnail img{ position: absolute; } この辺りを削除すればいいのですけど、画像を拡大したら他の画像が押し出されて、それこそデザインが崩れると思うのですが。
関連するQ&A
- アメブロで画像の上にマウスオンで拡大させたい
他のブログでは自分のブログ記事に使用した画像の上に、 マウスを上に持ってくると下記アドレスのように拡大されるのですが、 アメブロではできないです。 アメブロでは禁止になるのでしょうか？ もし可能ならやり方を教えていただければありがたいです。 http://tonecontrol.mods.jp/memo/css_thumbnail.html
- 締切済み
- ブログ
- サムネイル画像にマウスカーソルが触れると拡大画像になる～その応用について
JavaScript初心者です。どうぞよろしくお願いします。 サムネイルにオンマウスすると拡大画像が現われるよう「myBigImage」を使い記述し、これは実行できました。 そこで質問なのですが、同じ一つのhtml内で、下記のように二つのプログラムを並列させる事は可能でしょうか。 例） A（myBigImage）、A1（サムネイルの1）、A2（サムネイルの2） B（myBigImage）、B1（サムネイルの1）、B2（サムネイルの2） ※「サムネイルにオンマウスすると拡大画像が現われる」、 それを2グループ表示させたい、という事です。 例えば2つ目のグループ、Bを（myBigImage2）などとして 実行する事はできるのでしょうか。 初心者につきわかりにくい表現になってしまっているとしたら申し訳ありません。 この応用ができるかどうか、また万一可能な場合はどのように記述すればいいのか、教えていただけると大変助かります。 何とぞよろしくお願いします。
- ベストアンサー
- JavaScript
- CSSだけでサムネイルから拡大画像チェンジ
1ヶ所の指定場所に拡大画像が表示された状態で、下段にいくつかのサムネイルを設置し、マウスをそのサムネイルに乗せると拡大画像がチェンジして、マウスを外すと元画像に戻るみたいな事をCSSだけで表現したいのですが可能でしょうか？感じとしては http://curucuru-select.com/?pid=7429014 のCSS版みたいなものをのぞんでいるのですが・・・多分このサイトはjavascriptでやってるみたいなんですけど・・できたら、サンプルソースをいただけるとありがたいのですが・・どうかよろしくお願いします。
- 締切済み
- CSS
- サムネイル画像をクリックすると拡大画像を表示させる方法
今はまずサーバに同一画像の小さい写真（サムネイル用）と大きい写真の両方をアップロードして、 小さい画像を表示させて、そこにリンクをつけて大きい画像のURLへとばすようにタグを書いているのですが、これでは同じ写真を２枚アップロードしなくてはいけず、面倒です。 1枚の写真だけをアップロードしてサムネイル画像を表示させて、クリックしたら拡大写真がでるようにするためにはどのようなタグを使えばいいのでしょうか？
- ベストアンサー
- HTML
- サムネイルをクリックすると画像が拡大表示されるようにするには？
下記のページの「SAMPLE」を、サムネイルをクリックすると、選択した画像が真ん中の段の陰付き白枠の中に拡大表示されるようにしたいです。 インラインフレームは使いたくないのでJavaScriptでできないかと思っています。 ちなみに当方はJavaScript初心者です。 白枠はcssで#subcon2というボックスの背景に設定しています。 画像については、サムネイルの画像はs01.jpg、s02.jpg・・・という名前で、拡大表示用の画像はサムネイルの名前からsを取って、01.jpg、02.jpg・・・と、名前を付けて、このhtmlと同じ階層にある「images」フォルダの中の「sample_nail」フォルダに入ってます。 この情報で足りますか？ どのようにすればいいでしょうか？よろしくお願い致します。 http://www.ac.auone-net.jp/~mrs/sample.html
- ベストアンサー
- JavaScript
- 複数の画像切り替えと拡大表示
ウェブサイトを作っています。 ２列のテーブルで、上列に画像（サムネイル）、下列に「拡大」ボタン、「一つ戻る」ボタン、「一つ進む」ボタンがあります。行いたい動作は、 ＊５つの画像（サムネイル）を、「戻る」「進む」ボタンのクリックで順番に切り替えて表示させる ＊「拡大」ボタンを押すと、そのときに表示されている画像（サムネイル）の拡大版が、別ウィンドウで表示される どのように記述すればよろしいでしょうか。よろしければアドバイスをお願いいたします。
- 締切済み
- Java
- サムネイル画像のことで
初めまして。ホームページにあるサムネイル画像がいきなり拡大表示されるようになり動かなくました。一つのホームページだけだったのですがいつの間にか他のホームページでも拡大表示されるようになりました。（拡大表示されない所も有ります）どうしたらいいかわかりません。よろしくお願いします。｛動かなくなるのは一つだけ今の所｝
- ベストアンサー
- その他（インターネット・Webサービス）
- 小さい画像にマウスを合わせると小さい画像の右上（右下）に拡大画像が表示される
ホームページ作成で教えて欲しいのですが、小さなマンションのサムネイル画像の上にマウスを持って行くと、大きな画像がサムネイル画像の右下か右上に表示されるような仕組みを作りたいのですが、どのようにしたらいいのでしょうか？ヤフー不動産などで実際にあるのですが、小さな間取り図にオンマウスで拡大間取りが見れるようにしたいのです。 javaスクリプトで作成しているのでしょうか？javaは当方分からないのですが、アドバイスをお願い致します。
- 締切済み
- Windows XP
- highslideで拡大画像・サムネイルが表示されない
こんにちは、いつもお世話になっています。 こちらで紹介して頂いたhighslide(http://vikjavev.no/highslide/)からサンプルをダウンロードしました。 サンプルの画像フォルダに自分の表示したい画像（拡大画像とサムネイル）をサンプルファイルと同名（full-image.jpg, thumbnail.jpg）で上書きしたのですが、画像が表示されません。 highslideを利用するには、あとどうすればよろしいのでしょうか？ どなたかご教授お願いします。
- 締切済み
- JavaScript
お礼
そうですね・・・・・・ 押し出されるようになってしまいました。。。 他のやり方を探してみます。 ありがとうございました！！