【问题标题】:image animated resize and blur with jquery使用 jquery 调整图像动画大小和模糊
【发布时间】:2011-07-24 13:34:12
【问题描述】:

我有一个图像,我想在页面加载后调整其大小以适应其父级(可能使用小动画),然后进行模糊处理。有什么建议吗?

谢谢!

L

【问题讨论】:

    标签: jquery resize scale blur animated


    【解决方案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");
    

    唯一的要求是您将父元素保留为position: relative

    【讨论】:

    • 这很好用,我只需要将淡出更改为 .fadeTo('slow', 0.3)!非常感谢!!!
    猜你喜欢
    • 2013-05-29
    • 1970-01-01
    • 2013-09-04
    • 1970-01-01
    • 2018-11-27
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-03-16
    相关资源
    最近更新 更多