gaccerboni
gaccerboni

Reputation: 57

Change CSS on element with JavaScript?

I'm new to frontend development, and I want to rezize an <img> with JavaScript:

Which element?

<div class="dz-image">
    <img data-dz-thumbnail="" alt="principal.png" src="http://localhost:49407/file/Image/660">
</div>

What function im using in js?

this.emit("thumbnail", mockFile, "http://localhost:11111/file/Image/" + principal)
    { document.querySelector('data-dz-thumbnail') }; 

I'm using querySelector to get the spefic <img> element.

Is it possible to add some style directly on that line like height:120; width: 120;?

Upvotes: 0

Views: 72

Answers (3)

gaccerboni
gaccerboni

Reputation: 57

I solved this using jQuery's .css() method like this:

$('[data-dz-thumbnail]').css('width', '120');
$('[data-dz-thumbnail]').css('height', '120');

Upvotes: 0

Vimal
Vimal

Reputation: 197

Yes,it is possible to add some style directly.

let ele = document.querySelector('[data-dz-thumbnail]')
ele.style.width="120px"
ele.style.height="120px"

Upvotes: 2

RBC
RBC

Reputation: 478

Per my understanding, queryselector should be classname, id or tag

Second you can add css by taking a variable for your querySelector line. It is like:

var el = document.querySelector('div'); 
el.style.backgroundColor = 'green';
el.style.display = 'none';
el.style['border-radius'] = '5px';

Upvotes: 1

Related Questions