Documentation [#1601290]

Is there any more documentation on how to use this module? For example, how to do the following:

Make user picture responsive
Make flexslider slideshow responsive
Make any-size photo in a view responsive

Also, how does the loading of the images work? Do all the images load to the client and then only one presented depending on browser width? That could be a lot of images being loaded in a slideshow for example. Or is only the smallest image, depending on browser width, sent to the client?

I'm using the Omega theme, and would like to make images responsive using this module. Thanks!

Comments

Comment #1

attiks commented 26 May 2012 at 19:07

Issue tags:

+Needs documentation

Documentation is lacking, but the short how to is on the project page. In general the editor chooses the mobile variant for all image output and the modules handles the rest. User picture I never tested myself, so if it doesn't work open a new issue.

The client only needs to load one image, only exception is when the window size changes (or people rotate their device) then it might be that a new image is downloaded.

BTW we use this with omega all the time.

Comment #2

westis commented 28 May 2012 at 10:44

Thanks for your reply. After having tried some things I found out how it works. This is what I would like to add to the documentation, to make it easier for beginners to get started:

Add four image styles for every kind of image that you would like to be responsive, and add the suffixes _mobile, _narrow, _normal and _wide (as for the thumbnail example).
To use this image style, choose [imagestyle]_mobile (with [imagestyle] replaced by your image style name) as the image style for that field, in a view, in a content type or as the image style for the user profile photo (in Configuration->Account settings->Picture display style.

From the current documentation it's not entirely clear that [imagestyle]_mobile should be selected as the image style for the image field. At least that's how I understand it.

@attiks: Do you have any other examples of how to use res_img with the Omega theme?