Responsive image (re)size - or how to serve different image sizes..

More
2 years 3 months ago #136316 by scool
scool created the topic: Responsive image (re)size - or how to serve different image sizes..
...based on client screen dimension?

I need Picture(s) in my questions for i.e. choosing/selecting. Can i store i.e. one image (jpg) in 3 different sizes i.e. 375 x 667, 800 x 600, 1024 x 768 and serve the image size 375 x 667 for mobile devices and so on?

is there a trick? maybe can this served by an classid?

hopefully your scool

Please Log in or Create an account to join the conversation.

More
2 years 2 months ago #136351 by DenisChenu
DenisChenu replied the topic: Responsive image (re)size - or how to serve different image sizes..
There are a lot of specialized Web dev forum for this ....

searx.me/?q=responsive%20image&categories=general

Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand (or search sondages pro).
An error happen ? Before make a new topic : remind the Debug mode .

Please Log in or Create an account to join the conversation.

More
2 years 2 months ago #136405 by tpartner
tpartner replied the topic: Responsive image (re)size - or how to serve different image sizes..
In most cases, simply loading the largest image and scaling with CSS is adequate.

img {
	width: 90%;
	height: auto;
}

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

Please Log in or Create an account to join the conversation.

More
2 years 2 months ago #136412 by DenisChenu
DenisChenu replied the topic: Responsive image (re)size - or how to serve different image sizes..
Hi Tony,

Yes : with thgis one : you have an responsive image (in fact , i use img,video,svg{max-width: 100%;height: auto;} at start of any css file, just after the reset part). Taken from getSkeleton (but older than this).

But here : is different source for image, depend on screen size.

I have a french link : blog.nursit.net/Adaptive-Images-et-Responsive-Web.html

Some english link from this source:
- css-tricks.com/which-responsive-images-solution-should-you-use/
- www.smashingmagazine.com/2013/07/choosin...sive-image-solution/
And : xkcd.com/927/

Denis

Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand (or search sondages pro).
An error happen ? Before make a new topic : remind the Debug mode .

Please Log in or Create an account to join the conversation.

Start now!

Just create your account and start using Limesurvey today.

Register now
Join our Newsletter!