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(/([-\.]+)(\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的更多相关文章
- Jenkins 安装的HTML Publisher Plugin 插件无法展示ant生成的JunitReport报告
最近在做基于jenkins ant junit 的测试持续集成,单独ant junit生成的junitreport报告打开正常,使用Jenkins的HTML Publisher Plugin 插件无 ...
- [转]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 ...
- MySQL: Table 'mysql.plugin' doesn't exist的解决
安装解压版MySQL以后,不能启动,日志里面出现了这个错误: MySQL: Table 'mysql.plugin' doesn't exist 这是因为mysql服务启动时候找不到内置数据库&quo ...
- JQuery plugin ---- simplePagination.js API
CSS Themes "light-theme" "dark-theme" "compact-theme" How To Use Step ...
- 学习Maven之Maven Clean Plugin
1.maven-clean-plugin是个什么鬼? maven-clean-plugin这个插件用maven的人都不陌生.我们在执行命令mvn clean时调用的就是这个插件. 这个插件的主要作用就 ...
- 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 ...
- 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 ...
- 创建Unity3D的MacOS Plugin的正确姿势
http://www.tedlindstrom.se/how-to-link-dylibs-into-unity3d/ I was roaming around the net looking for ...
- Jetty Maven Plugin配置
官方文档:http://www.eclipse.org/jetty/documentation/current/jetty-maven-plugin.html#maven-config-https 1 ...
- Service Plugin / Agent - 每天5分钟玩转 OpenStack(73)
Core Plugin/Agent 负责管理核心实体:net, subnet 和 port.而对于更高级的网络服务,则由 Service Plugin/Agent 管理.Service Plugin ...
随机推荐
- windows命令启动mysql
找到mysql的安装位置,进入bin目录 dos输入 mysql -h localhost -uroot -p ,在输入密码
- Python和xml简介
python提供越来越多的技术来支持xml,本文旨在面向初学利用Python处理xml的读者,以教程的形式介绍一些基本的xml出来概念.前提是读者必须知道一些xml常用术语. 先决条件 本文所有的例子 ...
- Oracle 使用序列、触发器实现自增
之前项目开发多用mysql,对于id自增长设置,只需要简单修改列属性便好.最近改用ORACLE,头大一圈.ORACLE的相关操作,多用脚本.想短平快,难.最终用sql developer通过UI进行修 ...
- 洛谷P1280 尼克的任务 [DP补完计划]
题目传送门 题目描述 尼克每天上班之前都连接上英特网,接收他的上司发来的邮件,这些邮件包含了尼克主管的部门当天要完成的全部任务,每个任务由一个开始时刻与一个持续时间构成. 尼克的一个工作日为N分钟,从 ...
- vue中的锚链接跳转问题
在vue中的锚链接和普通的html不同,关于vue中的锚链接可以参考vue 中的 scrollBehavior 滚动行为. 在router.js中 //创建 router 实例 const rout ...
- 洛谷—— P2562 [AHOI2002]Kitty猫基因编码
P2562 [AHOI2002]Kitty猫基因编码 题目描述 小可可选修了基础生物基因学.教授告诉大家 Super Samuel 星球上 Kitty猫的基因的长度都是 2 的正整数次幂 ), 全是由 ...
- NGUI EventDelagate事件委托
using System.Collections; using System.Collections.Generic; using UnityEngine; public class BUttonCl ...
- bzoj 3203: [Sdoi2013]保护出题人 凸包
题目大意: http://www.lydsy.com/JudgeOnline/problem.php?id=3203 题解 首先我们考虑对一大波僵尸来袭的情况进行分析 假设来袭的僵尸是\(\{ a_1 ...
- [BZOJ5351]Query on a sequence
[BZOJ5351]Query on a sequence 题目大意: 给定一个长度为\(n(n\le10^5)\)的数列\(P\),满足\(|P_i|\le10^9\),求满足下列约束的不同的四元组 ...
- LeetCode 771. 宝石与石头(java)
给定字符串J 代表石头中宝石的类型,和字符串 S代表你拥有的石头. S 中每个字符代表了一种你拥有的石头的类型,你想知道你拥有的石头中有多少是宝石. J 中的字母不重复,J 和 S中的所有字符都是字母 ...