Ruby on Rails にて、JavaScript や CSS ファイル内で画像を読み込むときのパス(Path)の指定方法を調べたのでメモ。

ちなみに、 画像ファイルへのPathはこんな以下のとおりです。

$ tree
.
├── app
│   ├── assets
│   │   ├── images
│   │   │   └── thickbox
│   │   │       ├── loadingAnimation.gif
│   │   │       └── macFFBgHack.png

画像ファイルが、 app/assets/images/thickbox/loadingAnimation.gif にある場合、Pathは、

/assets/images/thickbox/loadingAnimation.gif

ではなく、images抜きの

/assets/thickbox/loadingAnimation.gif

というように指定しないといけません。

jQuery ライブラリ ThickBox のJavaScript、CSSファイル内で画像ファイルを指定している箇所を参考に変更箇所の例を書いてみました。

・参考：[jQuery] カンタンにDialogを表示できる「ThickBox」の使い方・参考記事まとめ | CodeNote.net

■ thickbox-compressed.js

・変更前

var tb_pathToImage = "images/loadingAnimation.gif";

↓

・変更後

var tb_pathToImage = "/assets/thickbox/loadingAnimation.gif";

■ thickbox.css

・変更前

.TB_overlayMacFFBGHack {background: url(macFFBgHack.png) repeat;}

↓

・変更後

.TB_overlayMacFFBGHack {background: url(/assets/thickbox/macFFBgHack.png) repeat;}

以上です。

【参考】

・Rails 3.1 and Image Assets - Stack Overflow