zoukankan      html  css  js  c++  java
  • animateBackground-plugin

            (function ($) {
                if (!document.defaultView || !document.defaultView.getComputedStyle) {
                    var oldCurCSS = jQuery.curCSS;
                    jQuery.curCSS = function (elem, name, force) {
                        if (name === 'background-position') {
                            name = 'backgroundPosition';
                        }
                        if (name !== 'backgroundPosition' || !elem.currentStyle || elem.currentStyle[name]) {
                            return oldCurCSS.apply(this, arguments);
                        }
                        var style = elem.style;
                        if (!force && style && style[name]) {
                            return style[name];
                        }
                        return oldCurCSS(elem, 'backgroundPositionX', force) + ' ' + oldCurCSS(elem, 'backgroundPositionY', force);
                    };
                }
    
                var oldAnim = $.fn.animate;
                $.fn.animate = function (prop) {
                    if ('background-position' in prop) {
                        prop.backgroundPosition = prop['background-position'];
                        delete prop['background-position'];
                    }
                    if ('backgroundPosition' in prop) {
                        prop.backgroundPosition = '(' + prop.backgroundPosition + ')';
                    }
                    return oldAnim.apply(this, arguments);
                };
    
                function toArray(strg) {
                    strg = strg.replace(/left|top/g, '0px');
                    strg = strg.replace(/right|bottom/g, '100%');
                    strg = strg.replace(/([0-9.]+)(s|)|$)/g, "$1px$2");
                    var res = strg.match(/(-?[0-9.]+)(px|\%|em|pt)s(-?[0-9.]+)(px|\%|em|pt)/);
                    return [parseFloat(res[1], 10), res[2], parseFloat(res[3], 10), res[4]];
                }
    
                $.fx.step.backgroundPosition = function (fx) {
                    if (!fx.bgPosReady) {
                        var start = $.curCSS(fx.elem, 'backgroundPosition');
    
                        if (!start) {//FF2 no inline-style fallback
                            start = '0px 0px';
                        }
    
                        start = toArray(start);
    
                        fx.start = [start[0], start[2]];
    
                        var end = toArray(fx.end);
                        fx.end = [end[0], end[2]];
    
                        fx.unit = [end[1], end[3]];
                        fx.bgPosReady = true;
                    }
    
                    var nowPosX = [];
                    nowPosX[0] = ((fx.end[0] - fx.start[0]) * fx.pos) + fx.start[0] + fx.unit[0];
                    nowPosX[1] = ((fx.end[1] - fx.start[1]) * fx.pos) + fx.start[1] + fx.unit[1];
                    fx.elem.style.backgroundPosition = nowPosX[0] + ' ' + nowPosX[1];
                };
            })(jQuery);

    调用示例:


    //动画调用示例
    $("#viewBody").animate({ backgroundPosition: '(520px 0)' });
  • 相关阅读:
    User Contro用法
    IHttpHandler 在SharePoint中的应用
    常用Stsadm 操作,网站备份与还原
    Schedule
    WP7>界面>ListBox数据绑定、图文混编、动态添加行
    WP7>界面>全景视图
    WP7>网络>读取网页源码
    UNIXLINUX编程实践教程>第二章>实例代码注解>who01
    WP7>界面>页面导航、切换及参数传递
    UNIXLINUX编程实践教程>第二章>实例代码注解>more01
  • 原文地址:https://www.cnblogs.com/yeminglong/p/4012744.html
Copyright © 2011-2022 走看看