Si tengo el archivo en esa linea, puesto que los ejercicios anteriores me funcionan.
este es mi codigo js: funciona todo menos la ultima funcion
/* Ejercicio 7 Utilizando jQuery programa en “introJQuery.js” los
* eventos y funciones necesarios para que:
*/
$(document).ready(function () {
$("#divMobil").css("color", "blue"); //inciada la web #divMobil se muestra azul//
$("#setBlueColor").mouseenter(function () { //al entrar el raton encima de #setBlueColor
$("#divMobil").css("background-color", "green"); //el #divMobil pasa a color de fondo verde//
});
$("#setBlueColor").click(function () {//al hacer click en #setBlueColor el elemento #divMobil//
$("#divMobil").css("background-color", "blue");//cambia a color de fondo azul//
});
$("#setBlueColor").mouseleave(function () {//al situar raton fuera de #setBlueColor//
$("#divMobil").css("background-color", "orange");//#divMobil pasa a color de fondo naranja//
});
$("#setRedColor").click(function () {//al hacer click en setRedColor//
$("#divMobil").css("background-color", "red");//divMobil pasa a color de fondo rojo//
});
});
/*Ejercicio 8 Utilizando jQuery, añade en “introJQuery.js” los eventos y
* funciones necesarios para que:
*/
$(document).ready(function () {
$("#setInvisible").click(function () {//Al clikar sobre #setinvisible
$("#divMobil").fadeOut();//se oculta #divMobil//
});
$("#setVisible").click(function () {//Al clicar sobre #setvisible
$("#divMobil").fadeIn();//se muestre el #divMobil
});
$("#toggleVisible").click(function () {//al clicar sobre #toggleVsible
$("#divMobil").fadeToggle();//se alterna visible/invisible el #divMobil
});
});
/*Ejercicio 9
* Utilizando jQuery, añade en “introJQuery.js” los eventos y funciones
* necesarios para que:
*/
$(document).ready(function () { //al clicar sobre #incSize aumenta en 50px
$("#incSize").click(function () {// la altura del elemento #divMobil con
$("#divMobil").animate({//un transicion de 1.5seg
height: '+=50px'},
1500
);
});
$("#decSize").click(function () {//al clicar sobre #decSize disminuya 50px
$("#divMobil").animate({//altura elemento #divMobil con transición 2seg
height: '-=50px'},
2000
);
});
$("#incRight").click(function () {//al clicar sobre #incRight aumente 50px
$("#divMobil").animate({//la altura del elemento #divMobil con transision de 1.5seg
left: '+=50px'
}, 1500
);
});
$("#decRight").click(function () {//al clicar sobre #decRight disminuya 50 px la
$("#divMobil").animate({//distancia a la izquierda del elemento #divMobil con transicion de 1.5seg
left: '-=50px'
}, 1500
);
});
});
$(document).ready(function () {
$(".contentImg > img").mouseenter(function () {
$("#infoImg").animate({
height: '100%'
}, 1000);
});
$(".contentImg > img").mouseout(function () {
$("#infoImg").animate({
height: '30%'
}, 1000);
});
});
Tema: Duda ejercicio jquery mouseenter animate, eventos del ratón y efecto animación (Leído 6941 veces)
RSS -
WAP2