Module Description
Dynamic Responsive Image (or drimage) is an alternative to the Responsive Image Style module (Drupal core). It is meant to take the pain away from configuring and maintaining responsive image styles by simply not needing any configuration.
It will generate (nearly) perfectly scaled (or cropped) images on-the-fly in Drupal based on the client's browser and device.
Install the module as usual and configure your image field to display with the "Dynamic Responsive Image" formatter. You can configure images to scale, to maintain an aspect ratio or to render as background image.
Drimage requires some JavaScript and CSS, so you will have to be comfortable with that.
Drimage assumes the width of images is set in CSS, either directly in the wrapper-div or inherited through a parent element. Any grid system will do just fine for this.
Drimage is fully compatible with the focal point module. This makes sure that if you instruct drimage to crop images, the focal point will never be cut off.
Drimage is fully compatible with the image_widget_crop module.
If you want to limit the amount of image styles drimage ceates (to save on diskspace) you can tinker with the drimage settings to allow images to not be pixel-perfect. Resulting images will the ben up-/downscaled or distorted in the browser to fit the available space defined in CSS. Any modern browser can handle this very well.
Known issues My custom Javascript is changing the size of containers with images in it and drimage does not respond to that
If you have Javascript that is resizing containers that contain drimage images you will need to delay drimage until your scripts have finished! Add a class "js-delay-drimage" on any element that wraps the images (it can even be the body element). Remove the class once everything is in place and call "Drupal.drimage.init()" with your element as argument. (no argument will default to the entire document, effectively rerendering all drimage images)
el.classList.remove('js-delay-drimage'); Drupal.drimage.init(el);I'm exporting (or importing) config and I notice a lot of image styles in the config. Do I need them?
They are not required to make drimage work, drimage will create them as needed. It is recommended however you do not delete them. The image styles store a cache for all generated images so your site will work considerably faster if you never delete them. If you've played with the drimage settings a lot, there might be some unused image styles taking up precious space on your server's disks, so you could delete them all in this case.
You should use config_split and add "image.style.drimage*" to the blacklist so they are ignored on importing.
It will generate (nearly) perfectly scaled (or cropped) images on-the-fly in Drupal based on the client's browser and device.
Install the module as usual and configure your image field to display with the "Dynamic Responsive Image" formatter. You can configure images to scale, to maintain an aspect ratio or to render as background image.
Drimage requires some JavaScript and CSS, so you will have to be comfortable with that.
Drimage assumes the width of images is set in CSS, either directly in the wrapper-div or inherited through a parent element. Any grid system will do just fine for this.
Drimage is fully compatible with the focal point module. This makes sure that if you instruct drimage to crop images, the focal point will never be cut off.
Drimage is fully compatible with the image_widget_crop module.
If you want to limit the amount of image styles drimage ceates (to save on diskspace) you can tinker with the drimage settings to allow images to not be pixel-perfect. Resulting images will the ben up-/downscaled or distorted in the browser to fit the available space defined in CSS. Any modern browser can handle this very well.
Known issues My custom Javascript is changing the size of containers with images in it and drimage does not respond to that
If you have Javascript that is resizing containers that contain drimage images you will need to delay drimage until your scripts have finished! Add a class "js-delay-drimage" on any element that wraps the images (it can even be the body element). Remove the class once everything is in place and call "Drupal.drimage.init()" with your element as argument. (no argument will default to the entire document, effectively rerendering all drimage images)
el.classList.remove('js-delay-drimage'); Drupal.drimage.init(el);I'm exporting (or importing) config and I notice a lot of image styles in the config. Do I need them?
They are not required to make drimage work, drimage will create them as needed. It is recommended however you do not delete them. The image styles store a cache for all generated images so your site will work considerably faster if you never delete them. If you've played with the drimage settings a lot, there might be some unused image styles taking up precious space on your server's disks, so you could delete them all in this case.
You should use config_split and add "image.style.drimage*" to the blacklist so they are ignored on importing.
Module Link
Project Usage
606
Security Covered
Covered By Security Advisory
Version Available
Production
Module Summary
Dynamic Responsive Image (or drimage) module aims to solve the pain of configuring and maintaining responsive image styles by generating perfectly scaled images on-the-fly in Drupal based on the client's browser and device.
Data Name
drimage
OPENAI CHATBOT
OPENAI CHATBOT
