Rails: How to access images in Javascript?

Question

i'm pretty new to Rails and have a little question:

How can i access images in Javascript? SCSS, ERB, ... have methods like "image_path", but i didn't find something similar for Javascript.

I need it to specify the image URLs for the firefly plugin:

$.firefly({images : ['???/1.jpg', '???/2.jpg'],total : 40});

HungryCoder · Accepted Answer · 2012-10-02 10:33:01Z

4

if your image in /app/assets/images/ you can simply use

/assets/1.jpg

Similarly in css, you can use

url(/assets/1.jpg)

You can follow same thing when using in javascript.

$.firefly({images : ['/assets/1.jpg', '/assets/2.jpg'],total : 40});

Note: The above methods will cause problem when your rails app is in sub-directory. In that case use relative path. Asset pre-compilation will compile all assets in public/assets directory. so your structure may be like:

public -assets --images ---1.png --javascripts --stylesheets ---style.css

so from style.css, you can use relative path like ../images/1.png

edited Oct 2, 2012 at 10:33

answered Oct 2, 2012 at 10:24

HungryCoder

7,6161 gold badge41 silver badges52 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

kiddorails · Accepted Answer · 2012-10-02 10:18:45Z

2

When I needed to do this, I inserted the whatever image was required on the page under a div#class and set that class as hidden in my css. Then, in javascript, I could access the image from that div.

May not be ideal solution, but couldn't think of anything else because of asset pipeline.

Also, try accessing image from ./assets/image_name.jpg

answered Oct 2, 2012 at 10:18

kiddorails

13k2 gold badges34 silver badges42 bronze badges

Collectives™ on Stack Overflow

Rails: How to access images in Javascript?

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related