redimensionnement animé d'image et flou avec jquery

Question

J'ai une image que je veux redimensionner après le chargement de la page pour s'adapter à son parent (peut-être en utilisant une petite animation), puis flou. Des conseils?

Merci!

L

Answer 1

var img = $('.anImage'), 
    offset = img.offset(); 

// position image absolutely in the same position to allow it to expand 
img.css({ 
     position: "absolute", 
     top: offset.top, 
     left: offset.left, 
     zIndex: 100 
    }) 
    // animate expansion 
    .animate({ 
     top: 0, 
     left: 0, 
     width: img.parent().width(), 
     height: img.parent().height() 
    }, "fast") 
    // fadeout 
    .fadeOut("fast"); 

La seule exigence est que vous laissez l'élément parent avec position: relative.