(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(/([-\.]+)(\s|\)|$)/g, "$1px$2");
var res = strg.match(/(-?[-\.]+)(px|\%|em|pt)\s(-?[-\.]+)(px|\%|em|pt)/);
return [parseFloat(res[], ), res[], parseFloat(res[], ), res[]];
} $.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[], start[]]; var end = toArray(fx.end);
fx.end = [end[], end[]]; fx.unit = [end[], end[]];
fx.bgPosReady = true;
} var nowPosX = [];
nowPosX[] = ((fx.end[] - fx.start[]) * fx.pos) + fx.start[] + fx.unit[];
nowPosX[] = ((fx.end[] - fx.start[]) * fx.pos) + fx.start[] + fx.unit[];
fx.elem.style.backgroundPosition = nowPosX[] + ' ' + nowPosX[];
};
})(jQuery);

调用示例:

//动画调用示例
$("#viewBody").animate({ backgroundPosition: '(520px 0)' });

animateBackground-plugin的更多相关文章

  1. Jenkins 安装的HTML Publisher Plugin 插件无法展示ant生成的JunitReport报告

    最近在做基于jenkins ant  junit 的测试持续集成,单独ant junit生成的junitreport报告打开正常,使用Jenkins的HTML Publisher Plugin 插件无 ...

  2. [转]NopCommerce How to add a menu item into the administration area from a plugin

    本文转自:http://docs.nopcommerce.com/display/nc/How+to+code+my+own+shipping+rate+computation+method Go t ...

  3. MySQL: Table 'mysql.plugin' doesn't exist的解决

    安装解压版MySQL以后,不能启动,日志里面出现了这个错误: MySQL: Table 'mysql.plugin' doesn't exist 这是因为mysql服务启动时候找不到内置数据库&quo ...

  4. JQuery plugin ---- simplePagination.js API

    CSS Themes "light-theme" "dark-theme" "compact-theme" How To Use Step ...

  5. 学习Maven之Maven Clean Plugin

    1.maven-clean-plugin是个什么鬼? maven-clean-plugin这个插件用maven的人都不陌生.我们在执行命令mvn clean时调用的就是这个插件. 这个插件的主要作用就 ...

  6. MySQL 从 5.5 升级到 5.6,启动时报错 [ERROR] Plugin 'InnoDB' init function returned error

    MySQL 从 5.5 升级到 5.6,启动时报错: [ERROR] Plugin 'InnoDB' init function returned error. [ERROR] Plugin 'Inn ...

  7. No plugin found for prefix 'mybatis-generator' in the current project

    http://blog.csdn.net/you23hai45/article/details/50792430 1.错误描述 F:\workspaces\Mybatis>mvn mybatis ...

  8. 创建Unity3D的MacOS Plugin的正确姿势

    http://www.tedlindstrom.se/how-to-link-dylibs-into-unity3d/ I was roaming around the net looking for ...

  9. Jetty Maven Plugin配置

    官方文档:http://www.eclipse.org/jetty/documentation/current/jetty-maven-plugin.html#maven-config-https 1 ...

  10. Service Plugin / Agent - 每天5分钟玩转 OpenStack(73)

    Core Plugin/Agent 负责管理核心实体:net, subnet 和 port.而对于更高级的网络服务,则由 Service Plugin/Agent 管理.Service Plugin ...

随机推荐

  1. windows命令启动mysql

    找到mysql的安装位置,进入bin目录 dos输入  mysql -h localhost -uroot -p   ,在输入密码

  2. Python和xml简介

    python提供越来越多的技术来支持xml,本文旨在面向初学利用Python处理xml的读者,以教程的形式介绍一些基本的xml出来概念.前提是读者必须知道一些xml常用术语. 先决条件 本文所有的例子 ...

  3. Oracle 使用序列、触发器实现自增

    之前项目开发多用mysql,对于id自增长设置,只需要简单修改列属性便好.最近改用ORACLE,头大一圈.ORACLE的相关操作,多用脚本.想短平快,难.最终用sql developer通过UI进行修 ...

  4. 洛谷P1280 尼克的任务 [DP补完计划]

    题目传送门 题目描述 尼克每天上班之前都连接上英特网,接收他的上司发来的邮件,这些邮件包含了尼克主管的部门当天要完成的全部任务,每个任务由一个开始时刻与一个持续时间构成. 尼克的一个工作日为N分钟,从 ...

  5. vue中的锚链接跳转问题

    在vue中的锚链接和普通的html不同,关于vue中的锚链接可以参考vue 中的  scrollBehavior 滚动行为. 在router.js中 //创建 router 实例 const rout ...

  6. 洛谷—— P2562 [AHOI2002]Kitty猫基因编码

    P2562 [AHOI2002]Kitty猫基因编码 题目描述 小可可选修了基础生物基因学.教授告诉大家 Super Samuel 星球上 Kitty猫的基因的长度都是 2 的正整数次幂 ), 全是由 ...

  7. NGUI EventDelagate事件委托

    using System.Collections; using System.Collections.Generic; using UnityEngine; public class BUttonCl ...

  8. bzoj 3203: [Sdoi2013]保护出题人 凸包

    题目大意: http://www.lydsy.com/JudgeOnline/problem.php?id=3203 题解 首先我们考虑对一大波僵尸来袭的情况进行分析 假设来袭的僵尸是\(\{ a_1 ...

  9. [BZOJ5351]Query on a sequence

    [BZOJ5351]Query on a sequence 题目大意: 给定一个长度为\(n(n\le10^5)\)的数列\(P\),满足\(|P_i|\le10^9\),求满足下列约束的不同的四元组 ...

  10. LeetCode 771. 宝石与石头(java)

    给定字符串J 代表石头中宝石的类型,和字符串 S代表你拥有的石头. S 中每个字符代表了一种你拥有的石头的类型,你想知道你拥有的石头中有多少是宝石. J 中的字母不重复,J 和 S中的所有字符都是字母 ...