All geek questions in one place

Adjust background image to div size using File API

I have a problem at the moment,

I use a set of image blocks for the boot system, as shown below.

enter image description here

When I click on each square, which input type="file", I get a preview of the image using the API for reading files , all this works fine, what I do is replace the background image div (whose dimensions are 100px X 100px) for preview using

.css( "background", 'url(' + e.target.result + ')' )

But the image does not adjust to the width and height of the div, and only one part is displayed.

I tried with the css map setup "background-size": "100%"or even "background-size": "100px 100px", but the results remained the same.

Any ideas?

Thanks in advance

+4
1

background-size css contain, :

.css( "background-size", 'contain' )

. .

. , background-size cover , .

+3

Source: https://habr.com/ru/post/1548406/

More articles:


All Articles