Mostrando entradas con la etiqueta jQuery width heigth ready click id javascript. Mostrar todas las entradas
Mostrando entradas con la etiqueta jQuery width heigth ready click id javascript. Mostrar todas las entradas

domingo, 17 de febrero de 2013

Modificar las dimensiones de un elemento con width y height

Podemos cambiar las dimensiones de un elemento en web por medio de los métodos width y height, asi como cambiar dichos atributos por medio del métod attr. Estos métodos no tienen un efecto de animación.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Width Height</title>
<script src="jquery.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(inicio);
function inicio(){
    $("#chica").click(onChica);
    $("#mediana").click(onMediana);
    $("#grande").click(onGrande);
}
function onChica(){
    $("#afro").width(400).height(251);
}
function onMediana(){
    $("#afro").width(800).height(502);
}
function onGrande(){
    $("#afro").width(1200).height(754);
}
</script>
</head>
<body>
<input type="button" id="chica" value="Chica"/>
<input type="button" id="mediana" value="Mediana"/>
<input type="button" id="grande" value="Grande"/>
<br>
<img src="imagenes/afrodita.jpg" id="afro"/>
<p></p>
</body>
</html>


Ejemplo: http://pacoarce.com/jQuery/WidthHeight.html
urso completo: https://www.udemy.com/jquery-y-mobile/