Atributo naturalWidth da Image

Objeto Image do DOM HTML

Definição e uso

naturalWidth O atributo retorna a largura original da imagem.

Por exemplo, se você tiver uma imagem que originalmente tinha 100 pixels de largura. Então, você usa CSS/ou usa o atributo "largura" do HTML para definir o estilo da imagem, tornando sua largura 500 pixels. O atributo naturalWidth retornará "100", enquanto o atributo width retornará 500.

Dica:Use Atributo naturalHeight Retorna a altura original da imagem, ou use Atributo height Definir ou retornar a largura da imagem Atributo height o valor.

Atenção:Este atributo é apenas de leitura.

Exemplo

Exemplo 1

Retorna a largura original da imagem:

var x = document.getElementById("myImg").naturalWidth;

Experimente pessoalmente

Exemplo 2

A diferença entre os atributos naturalWidth e width:

var x = document.getElementById("myImg").naturalWidth;
var y = document.getElementById("myImg").width;

Experimente pessoalmente

Sintaxe

imageObject.naturalWidth

Detalhes técnicos

Retorno: Número, representando a largura original da imagem (em pixels).

Suporte ao navegador

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Suporte 9.0 Suporte Suporte Suporte

Objeto Image do DOM HTML