Percent instead of pixel

I don't really think so, as (at least for now) I don't see a way of how this could be achieved. First of all, using percentage-based image sizes instead of pixel-based is not possible, as they need to be pixel-perfect. Percentages would distort the layout. Secondly, as image sizes are calculated before the html page is built, there is no option to manipulate IM block sizes based on page/element width, because this width is not known yet at this point.

Do you think this might be achievable by using a similar method to the adaptive image module?
Essentially the max available width is set in a cookie (client side) and the image sizes are generated based on media query style breakpoints (1382, 992, 768 or 480) depending on the value of that cookie.

Once the client side cookie has returned after the first request, the devices maximum width will be available, which will fit into a media query breakpoint (much like the adaptive_image image style is defined).
The max width of the breakpoint (1382, 992, 768 or 480) would then be the effective width that would be applied to the imagematrix block_width setting.

If the above steps can be calculated, the theme layer markup would be the last part to modify, such as changing the inline styles on the divs wrapping the images to percentages and removing the width/height attributes from the img elements (so they become max-width:100%; height: auto).

I think this might work for the main content area, but would not work so well in narrow regions (such as a sidebar).

Maybe another way of doing this is allowing configuration options (such as block_width, block_images_count etc) to be defined for multiple breakpoints, so layouts can be adjusted for different devices.

I'd be happy to help if you would like to look into this further.

Re-opening or I will forget about this one...

resizing of the images is done by the magazine class, the only way i found to do something responsive is changing the width of the image matrix blocks..

based on the ideas behind adaptive images and client-side adaptive images i extended the image matrix modul to support different block sizes based on browser resolution. setting a cookie with the actual width let us modify the magazine class settings on page reload.

may be usefull also for others.

This is exactly what i was looking for thanks...

Could you please provide a proper patch from Git?

I haven't tested this patch but I'm about 90% sure its a correct reroll or what #5 was. I first attempted to create a patch based solely on the patch files which were in an odd format. I think building the patch based on the zip was more extensive though. I recommend using this one.

I'm going to attach both just in case.

Hi...its confirmed this patch works? it would be great....

Zip Patch applies with some whitespace errors, will report back further findings

Thanks BWPanda, applies perfectly, will update with test results later this week.

Patch applied trying to test.. I'm lost with regard setup. I'm looking at settings and I see % Width of one block and then many textfields for CLIENT WIDTH BREAKPOINT and block width with format px. If my layout is 15% for both side bars and 70% for center block, how do I go about making this work? This is going to cause a lot of support questions in queue if not clarified better.

Edit: Ah, I think I am getting this after learning a little more about breakpoints.. if my breakpoint is 1024, then my block max width should be 70% of this?

It looks like I am bringing up an old 2012 question, but the patch doesn't seem to be working anymore. Would anyone happen to have an updated patch? Or am I missing something? Thanks so much for your help!

WOW patch in #11 works!! BUT after clearing cache seems to be disable sweaver module and removes all the changes made using sweaver. Also disables the module filter. Any help would be much appreciated.

Please note the request in #15 is active. Thanks

Thanks for your input Kerry. First, please do not change current issue category, as it relates to the original problem/request, not to your one. The same applies to 'assigned to', unless you're plan to continue working on the patch yourself - which, by the way, you're most welcomed to. Whatever the case, I'm marking the issue as 'needs work'.

Advice noted thanks maciej.zgadzaj. Thanks for responding to the query.

What about images for Retina displays (high-definition displays)?

#11 ok, but...
This solution with Cookies, in my opinion, is not the best, since when you first view the page, ImageMatrix cannot receive Cookies (after all, they are created after working out php). In addition, when resizing the browser window, ImageMatrix blocks remain unchanged. If the latter can be solved with the line window.location.reload(); (for example), I can’t think of any way to deal with the first problem. Do you have any thoughts?