Name is required.
Email address is required.
Invalid email address
Answer is required.
Exceeding max length of 5KB

Different images depending on browser size in cover story

Robbie May 10, 2017 08:51PM CEST

Is it possible to have difference images that'll load depending on the size of the browser/device? So image1 loads for mobile size, image2 for desktop, etc., in the same manner that semplice can tell the fonts to do different sizes dependent on browser sizing.

Reason I'm doing that is to achieve better control over the kerning of my headlines. Default coding just didn't look good. Now that the headline looks good throughout, the company names above them appear too large on desktop. If I shrink it, it'll be too small on mobile devices. Can't get a happy medium.

Thanks in advance.

Up 0 rated Down
Amanda May 10, 2017 10:36PM CEST Semplicelabs Agent

Hi Robbie,

Are you trying to do images or kerning text? Your question seems to be asking about two separate things, so I wanted to clarify. :)

Best,
Amanda

Up 0 rated Down
Robbie May 10, 2017 10:48PM CEST
I'm using images to kern my text because you can't achieve proper kerning using browser coding.

So I'm trying to have the same ability to load different images based on browser sizing as you can in semplice with text.

Let me know if you understand that, heh.

Thanks,
Rob
Up 0 rated Down
Amanda May 11, 2017 01:10AM CEST Semplicelabs Agent

Hi Rob,

Understand now, thanks for clarifying.

You could change it out with CSS if it was a background. Otherwise, if it’s a regular image, it would need to be done through jQuery or JavaScript. Unfortunately we aren’t able to help with that level of customization.

Best,
Amanda

Up 0 rated Down
Robbie May 11, 2017 06:50PM CEST
Hmmm. If it were a background as you suggest, how would I go about doing that?

thanks,
Robbie
Up 0 rated Down
Amanda May 11, 2017 08:39PM CEST Semplicelabs Agent

Hi Robbie,

If it was a background image, you would use some CSS like this:

@media (max-width: 568px) {
#selector {
background: url(yourimage.jpg);
}
}

That would adjust the image for mobile screen sizes smaller than 568px wide.

Best,
Amanda

Post Your Public Answer

Your name (required)
Your email address (required)
Answer (required)
17c96688a1a336f6040dd1b6149c3fa8@semplicelabs.desk-mail.com
https://cdn.desk.com/
false
desk
Loading
seconds ago
a minute ago
minutes ago
an hour ago
hours ago
a day ago
days ago
about
false
Invalid characters found
/customer/en/portal/articles/autocomplete