画像の拡大は出来ているのですが、FancyZoom付属の画像(closeboxなど)が表示されません。
表示させるページは、「report.html」です。
現在のディレクトリ構成は、下記のようになっています。
HPフォルダ-index.html
|
-report.html (http://www.○○○.com/report.html)
|
-images-global-zoom-closebox.png
|
-spacer.png
|
-js-global-FancyZoom.js
|
-FancyZoomHTML.js
closeboxなどの画像(25個)は、全てアップロードしてあります。
また、「FancyZoom.js」内の44行目に記述されているパスは、以下のように絶対パスに書き換えてあります。
var zoomImagesURI = '/images-global/zoom/'; // Location of the zoom and shadow images
↓
var zoomImagesURI = 'http://www.○○○.com/images-global/zoom/'; // Location of the zoom and shadow images
※ブラウザ上で見た、表示されないclosebox.pngのパス:
http://www.○○○.com/images-global/zoom/closebox.png
◆また、アイコンや枠(影)が表示されないことから、以下のようなCSSの効果が影響している可能性はありますか?
.top_img_shadow {
background-image: url(../images/top_shadow.jpg);
background-repeat: repeat-x;
background-position: 0px 0px;
margin-bottom: 20px;
}
■ FancyZoom
http://www.cabel.name/2008/02/fancyzoom-10.html
■ 設置に関する参考サイト
http://freesoft.tvbok.com/freesoft/web/fancyzoom …
説明が分かりづらくてすみません。どうかよろしくお願いいたします。
No.3ベストアンサー
- 回答日時:
ご免、変な勘違いしてた。
絶対パスでも表示されないって事だよね。(確認用に設置したら出来たので。ttp://www.geocities.jp/n_a_o11/fz/fz.html)
NO.2は無しで。
サイト見たらわかるかも。
丁寧なご説明ありがとうございます。
その後、色々試してみたのですが、解決できなかったので
「FancyZoom」に似ている「Slimbox」というものを設置してみました。
こちらは、画像拡大、アイコン表示ともに上手くいきました。
原因は分かりませんが、しばらくはこれで我慢しようと思います。
ありがとうございました。
No.2
- 回答日時:
FancyZoomHTML.js
83行目位
inImage2.setAttribute('src','images-global/zoom/'+'closebox.png');//zoomImagesURI
No.1
- 回答日時:
パスの指定は正しそうですね。
ご提示のディレクトリ構成ならあえて、絶対パスにする必要もないと思いますけど。CSSが怪しいと思われるなら外して試してみてはいかがですか?
情報が少ないので、コメントしようがありませんが、
firebugとかを使って、それぞれの画像のスタイル属性がどうなっているか
チェックしてデバッグしてみては
一応、CSSを外して試してみましたがダメでした。
また、意味はないですが、jsファイル内の絶対パスを相対パスに戻しました。
ご指摘の通り、firebugも使って調べてみましたが、さっぱりです。
yyr446さんの仰る通り、パスは合ってると思うのですが…。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS 書籍を見つつサイト造りの練習をしているのですが、見た目が一致しません 2 2022/11/28 15:00
- HTML・CSS ヘッダーの画像にメインエリアがかぶってしまいます 1 2022/11/28 14:06
- JavaScript スマフォではボタンを表示させたくない 2 2023/01/20 14:26
- HTML・CSS 下にスクロールしても、追従するボタンのコードを書いたのですが、ボタンの中の画像が半分しか表示されない 1 2022/04/16 21:31
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/30 09:10
- HTML・CSS スクロールすると追従する画像のコードを書いているのですが、追従する画像の大きさの調節が上手くいきませ 2 2022/04/18 12:52
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- HTML・CSS CSSが効かずどのように指定すれば良いか分からないのでアドバイスお願い致します 2 2023/06/07 12:25
- HTML・CSS CSSでサイトの背景に画像を組み込みたいのですが反映されません 2 2022/11/22 16:21
- HTML・CSS PCサイズで赤い画像2つと、青い画像2つがそれぞれ横に2つずつ並んでいるのですが、これをスマホサイズ 5 2022/04/11 12:01
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
javascriptで毎月替わる画像
-
HTMLで条件分岐はできますか?
-
Gifアニメ、最後のコマに行った...
-
マウスオーバーとポップアップ...
-
textareaに画像を表示したい
-
Javascriptで指定した日付と時...
-
透過pngの透明部分以外をクリッ...
-
画像クリックで別の場所の画像...
-
JavaScript スライドの画像にリ...
-
JavaScriptでスライドショー
-
FancyZoom (javascriptで画像拡...
-
1枚の画像をクリックすると複数...
-
画像をフォルダから自動読み込み。
-
jQueryスライドショー画像への...
-
画面の表示位置を指定させて表...
-
Javascript で共通の処理をどこ...
-
サムネイルをクリックすると画...
-
MAX関数を使ってからLEFT JOIN...
-
Slick.jsのオプションrtlについて
-
jQueryで、リンクURLの一致を確...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
Javascript で共通の処理をどこ...
-
Javascriptで指定した日付と時...
-
textareaに画像を表示したい
-
Gifアニメ、最後のコマに行った...
-
1枚の画像をクリックして複数の...
-
画像ランダム表示、しかしダブ...
-
スライダーを実装した場合、ペ...
-
1枚の画像をクリックすると複数...
-
HTMLで条件分岐はできますか?
-
JavaScript スライドの画像にリ...
-
オンマウスで、画像切り替え+...
-
画像の重なりの順序を代える方...
-
JavaScriptとチェックボックス...
-
透過pngの透明部分以外をクリッ...
-
画像をドラッグ&ドロップで移...
-
各フォルダから1枚ずつ画像をラ...
-
jQueryで特定のURLの時のみ表示
-
bxsliderにて読み込み後に内容...
-
prettyphotoの画像表示について
-
WEBページ立ち上げ時に1回のみ...
おすすめ情報