Método jQuery ancho()

❮ Métodos jQuery HTML/CSS

Ejemplo

Devuelve el ancho de un elemento <div>:

$("button").click(function(){
    alert($("div").width());
}); 

Definición y uso

El método width() establece o devuelve el ancho de los elementos seleccionados.

Cuando se usa este método para devolver el ancho, devuelve el ancho del PRIMER elemento coincidente.

Cuando se usa este método para establecer el ancho, establece el ancho de TODOS los elementos coincidentes.

Como ilustra la imagen a continuación, este método no incluye relleno, borde o margen.

Dimensiones jQuery


Métodos relacionados:

  • height() - Establece o devuelve la altura de un elemento
  • innerWidth() - Devuelve el ancho de un elemento (incluye relleno)
  • innerHeight() - Devuelve la altura de un elemento (incluye relleno)
  • outsideWidth() - Devuelve el ancho de un elemento (incluye relleno y borde).
  • outerHeight() : devuelve la altura de un elemento (incluye relleno y borde).


Sintaxis

Devuelve el ancho:

$(selector).width()

Establecer el ancho:

$(selector).width(value)

Establezca el ancho usando una función:

$(selector).width(function(index,currentwidth))

Parameter Description
value Required for setting width. Specifies the width in px, em, pt, etc. Default unit is px
function(index,currentwidth) Optional. Specifies a function that returns the new width of selected elements
  • index - Returns the index position of the element in the set
  • currentwidth - Returns the current width of the selected element

Pruébelo usted mismo - Ejemplos


Cómo establecer el ancho de un elemento usando diferentes unidades.


Cómo usar una función para disminuir el ancho de un elemento.


Cómo devolver el ancho actual de los elementos del documento y de la ventana.


Cómo utilizar ancho(), altura(), altura interior(), anchura interior(), anchura exterior() y altura exterior().


Cómo cambiar el color de fondo de la página en pantallas más pequeñas.


❮ Métodos jQuery HTML/CSS