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/

No hay comentarios:

Publicar un comentario