- ベストアンサー
画像のキャッシュとプリロード
kokucho81の回答
その通りです。 私が思う洗練された解決法（レイヤーを使用している場合の）としては、以下のものです。 解説のため、以下、メニューデフォルト画像Ａ１，Ｂ１，Ｃ１、そして、ロールオーバー画像をＡ２、Ｂ２，Ｃ２とします。そして、それぞれの画像にレイヤーを割り当てます。 初めの表示の際に、Ａ１レイヤー、Ｂ１レイヤー、Ｃ１レイヤーの真下（z-indexを少なくしてそれぞれ同じ位置）に、Ａ２レイヤー、Ｂ２レイヤー、Ｃ２レイヤーを置き、マウスオーバーとマウスアウトを契機として、レイヤーのz-indexをうまく切りかえるようにしてやれば、美しくいくと思います。
noname#25358
関連するQ&A
- 画像のプリロードに付いて
● 1.html、2.html、3.html、4.html、5.html とページがあるとします。 ● それぞれのページにメインビジュアルとなる少し大きめの画像があるとします。 ● 1.htmlを表示させたときに2～5.htmlの画像も先に読み込んでブラウザにキャッシュさせる。 ● ページを移動しても画像がキャッシュされているので表示が早くなる。 というのをしたいのです。 プリロードに関するのは検索でたくさん出て来たのですが、 自分の思う様な物はありませんでした。 ※探しきれてないだけかもしれません。 もしよろしければご教授願います。 よろしくお願い致します。
- ベストアンサー
- JavaScript
- ロールオーバーの「プリロード」の設定で…
JavaScriptのロールオーバーで画像のプリロードを行いたいのですが、 <body onLoad=”MM_preloadImages(～～～というように、BODYの中に書く以外に、方法はありませんか？いろいろ検索してみましたがわかりませんでした。 「JavaScript」の書き方講座、のようなサイトではなく、すぐに使えるサンプルソースが載っているものが良いです。
- ベストアンサー
- JavaScript
- 画像のプリロード
jqueryを使い、下のようなサイトを作っています。（URL先はサンプル） http://s1.shard.jp/studioy/test2/ 横に大きな画像を一枚使っており、ページを開くと同時に画像がスライドし、一番最後まで流れたらストップ、右側のリンクで希望の画像までスライドできるようになっています。 動きに支障はないのですが、最初に読み込んだときに画像が完全に読み込まれておらず、徐々に表示されてしまいます。 一応、jsでプリロードさせているのですが、環境によってなのでしょうか。 jsで読ませる他に、何か方法はないでしょうか？ どなたか詳しい方、ご教示下さい。
- ベストアンサー
- JavaScript
- javascriptのロールオーバーの問題につきまして。
Dreamweaverのjavascriptを使ってロールオーバーを作成したのですが、firefoxなどでロールオーバーした画像からリンク先に飛んで、ブラウザの戻るで戻ると、画像がロールオーバー状態のままになってしまいます。なにか良い解決方法はないでしょうか。よろしくお願いいたします。
- 締切済み
- その他（インターネット・Webサービス）
- 画像のある部分にロールオーバーをつける方法
質問タイトルの通り、画像のある部分にロールオーバーをつけ、さらにその部分にリンクを貼りたいのですが、ロールオーバーがうまくできません。 リンクを貼るだけならソフトにあるイメージマップ作成機能を使ったり、HTMLで作成すればできるのですが、イメージマップを作成した部分にロールオーバーをつける方法がわかりません。 ソフトはFireworks8、Dreamweaver8を使用しています。 ロールオーバーをつける方法がわかる方、ご教授ください。
- 締切済み
- HTML
- 指定したフォルダの画像を一括でプリロードしたい
ページが表示されたときに、指定した画像をプリロードするようjavascriptで実装しています。 preloadの引数に１つ１つプリロードしたいファイルを書いていかないといけないので ファイル数が多くなると手間です。 例えば img/photo1.jpg img/photo2.jpg img/thumb.jpg image/photo1.jpg image/photo2.jpg image/thumb.jpg という具合にimgとimageのフォルダがあってimgにだけある画像ファイル全てを一括でプリロード したいです。どのようなソースをかけばいいでしょうか？ また、指定したフォルダ以下の画像ファイルを一括でプリロードする関数などがあるのでしょうか？ function preload(imgs){ for(var i = 0; i < imgs.length; i++){ var imgObj = new Image(); imgObj.src = imgs[i]; } } preload(["./img/photo1.jpg", "./img/photo2.jpg", "./img/photo3.jpg"]);
- ベストアンサー
- JavaScript
- 別のフレームに画像を表示させる
検索をかけてみたのですが、同じ質問は見付からず 似た(？)ような質問の回答では理解出来ないので どなたかご存知の方が居ましたらお願い致します マウスを乗せた時、他の画像を表示させたり、画像に効果をつける ロールオーバーという機能の仲間なのではないかと思うのですが 「マウスを乗せた時、別のフレームに画像を表示させる」事は可能なのでしょうか？ フレームを上下に分けて、上は写真のサムネイルで そのサムネイルにマウスを乗せた時に 下のフレームに大きめの、サムネイルとは別の画像を表示させたいのですが やり方が判りません。 ロールオーバーも使った事がなかったのですが やってみたら(基本の効果は)、そこそこ理解出来ました。 フレームも最近覚えた初心者ですので、スクリプトも良く判りません (作られたソースを貼る位しか出来ません・・・・) 宜しくお願い致します
- ベストアンサー
- JavaScript
- cssとjavascriptを使って画像の一部をロールオーバー
以下の条件でロールオーバーをさせることが可能かどうか、また可能な場合はどのようにしてやるのか教えていただきたいです。 (1)1枚のgif画像がある。画像内にいくつか文字があり、文字の上にカーソルが上がった時に文字の色を変えたい。 (2)文字がすべてロールオーバーしていない元画像と、文字がすべてロールオーバーした画像の2枚を用意。 (3)CSSとjavascriptを駆使して作りたい。 元画像を背景に設定し、その上にロールオーバー後の画像を配置し、隠す。→文字の上にカーソルが来たら、隠していたロールオーバー後の画像の一部をその同じ場所に表示させる というような考え方でやってみたのですが、どうもうまくいきませんでした。Flashでやった方が簡単なのですが、Flashは使わずに作るということになっているので困っています。 何卒、よろしくお願いいたします。
- ベストアンサー
- HTML
- Dreamweaverでimageのロールオーバー
Dreamweaverを使ってimageボタンのロールオーバーを指定すると <head>内に記述されるjavascriptのほか、<body>タグの中にも以下のタグが記述されます。 <body onLoad="MM_preloadImages('menu1_over.gif','menu2_over.gif')"> ()内のgif名はボタンがover時の画像名ですが、ロールオーバーするボタンが膨大だと <body>タグ内も膨大なソース量になってしまいます。 試しに削除してみたところIEでは正常にロールオーバーが動作します。 上記の記述は何を意味しているのでしょうか。 不足な情報があれば補足させていただきますので、お知恵をお貸し下さい。
- 締切済み
- ホームページ作成ソフト
お礼
難しい内容の回答ですね、でもやっと理解できました。 これはDreamweaverのRollOverのFunctionの動きではありませんね。 ここまでやらないとちょっと大きな画像の入れ替えはできないということなのですね。 これはShowHideLayerとかを使えということになりますかね、もっともこんなDreamweaverだらけの専門用語ではみなさんの迷惑に、申し訳ありません。