jQuery字定义动画animate() - 许全通 - 博客园
$(function () {
$("#panel").click(function () {
//三种动画同时进行
//$(this).animate({ left: "+=500px",height:"+=500px",width:"+=500px"}, 2000);
//三种动画顺序执行
$(this).animate({ left: "+=500px"}, 50);
$(this).animate({ height: "+=500px"}, 50);
$(this).animate({ width: "+=500px" }, 50);
});
});
</script>
链式方式（动画队列）：$(function () {
$("#panel").css("opacity", "0.5");
$("#panel").click(function () {
$(this).animate({ left: "400px", height: "400px", opacity: "1" }, 2000)
.animate({ top: "200px", width: "400px" }, 2000)
.fadeOut("slow");
});
});
</script>
动画回调函数（callback）：需要注意的是，css()方法不会加入到动画队列中个，而是立即执行。此时可以使用animate方法的最后一个参数callback；使用回调函数(callback)可以对非动画方法实现队列，只要将css()方法写在某个动画中的回调函数里即可！例如：$(function () {
$("#panel").css("opacity", "0.5");
$("#panel").click(function () {
$(this).animate({ left: "400px", height: "400px", opacity: "1" }, 2000, function () { $(this).css("border", "5px solid blue"); })
.animate({ top: "200px", width: "400px" }, 2000, function () { $(this).css("background-color", "Green"); })
});
});
</script>
注意：callback回调函数适用于jQuery所有的动画效果方法！！停止元素的动画： 方法：stop([clearQueue],[gotoEnd]); 参数：clearQueue：boolean值，表示是否要清空未执行完的动画队列； gotoEnd：代表是否直接将正在执行的动画跳转到末状态； 这两个参数都是可选参数！！判断元素是否处于动画状态： 语法： //如果当前元素(id=panel)没有进行动画，则添加新的动画！
}
延迟动画： 在动画执行的过程中，如果相对动画进行延迟操作，可使用delay()方法；用法如下：$(function () {
$("#panel").css("opacity", "0.5");
$("#panel").click(function () {
$(this).animate({ left: "200px", height: "300px", opacity: "1" }, 2000, function () { $(this).css("border", "5px solid blue"); })
.delay(2000)
.animate({ top: "200px", width: "300px" }, 2000, function () { $(this).css("background-color", "Green"); })
.delay(2000)
.fadeOut("slow");
});
});
</script>
jQuery中的其他动画方法： ->toggle(speed,[callback]); ->slideToggle(speed,[easing],[callback]); ->fadeTo(speed,opacity,[callback]); ->fadeToggle(speed,[easing],[callback]); ①toggle()： toggle方法可以切换元素的可见状态，如果元素当前是可见的，则切换为隐藏的，如果是隐藏的，则切换为可见的； ②slideToggle(): 此方法通过高度变化来切换匹配元素的可见性；效果和toggle相同，不过这个动画是调整元素的高度来显示和隐藏元素的，相当于slideDown和slideUp； ③fadeTo()： 此方法把元素的不透明度以渐进的方式调整到指定的值，值调整不透明度，元素的高度和宽度不变！ ④fadeToggle()： 通过不透明度变化来切换匹配元素的可见性，值调整不透明度，相当于fadeOut和fadeIn；总结：| 方法名 | 说明 |
| hide(),show() | 同时修改多个样式属性：高度、宽度、不透明度 |
| fadeIn(),fadeOut() | 只改变不透明度 |
| slideUp(),slideDown() | 只改变高度 |
| fadeTo() | 只改变不透明度 |
| toggle() | 用来代替hide方法和show方法，同hide，show方法 |
| slideToggle() | 用来代替slideUp和slideDown方法 |
| fadeToggle() | 用来代替fadeIn和fadeOut方法 |
| animate() |
自定义动画的方法，以上各种动画方法实质内部都调用了animate方法，此外，直接使用animate方法
还可以自定义其他样式属性。也就是说，可以用animate代替其他所有的动画方法；
|
定义和用法
animate() 方法执行 CSS 属性集的自定义动画。
该方法通过CSS样式将元素从一个状态改变为另一个状态。CSS属性值是逐渐改变的，这样就可以创建动画效果。
只有数字值可创建动画（比如 "margin:30px"）。字符串值无法创建动画（比如 "background-color:red"）。
注释：使用 "+=" 或 "-=" 来创建相对动画（relative animations）。
语法 1
$(selector).animate(styles,speed,easing,callback)
| 参数 | 描述 |
|---|---|
| styles |
必需。规定产生动画效果的 CSS 样式和值。 可能的 CSS 样式值（提供实例）：
注释：CSS 样式使用 DOM 名称（比如 "fontSize"）来设置，而非 CSS 名称（比如 "font-size"）。 |
| speed |
可选。规定动画的速度。默认是 "normal"。 可能的值：
|
| easing |
可选。规定在不同的动画点中设置动画速度的 easing 函数。 内置的 easing 函数：
扩展插件中提供更多 easing 函数。 |
| callback |
可选。animate 函数执行完之后，要执行的函数。 如需学习更多有关 callback 的内容，请访问我们的 jQuery Callback 这一章。 |
语法 2
$(selector).animate(styles,options)
| 参数 | 描述 |
|---|---|
| styles | 必需。规定产生动画效果的 CSS 样式和值（同上）。 |
| options |
可选。规定动画的额外选项。 可能的值：
|
通过浏览器直接打开iOS/Android App 应用程序 - Cundong's log - 开源中国社区
点击浏览器中的URL链接，启动特定的App。
首先做成HTML的页面，页面内容格式如下：
<a href="[scheme]://[host]/[path]?[query]">启动应用程序</a>
这一句就可以了。
各个项目含义如下所示：
scheme：判别启动的App。 ※详细后述
host：适当记述
path：传值时必须的key ※没有也可以
query：获取值的Key和Value ※没有也可以
作为测试好好写了一下，如下：
<a href="myapp://jp.app/openwith?name=zhangsan&age=26">启动应用程序</a>
接下来是Android端。
首先在AndroidManifest.xml的MAIN Activity下追加以下内容。(启动Activity时给予)
※必须添加项
<intent-filter> <action android:name="android.intent.action.VIEW"/> <category android:name="android.intent.category.DEFAULT" /> <category android:name="android.intent.category.BROWSABLE" /> <data android:scheme="myapp" android:host="jp.app" android:pathPrefix="/openwith"/> </intent-filter>
HTML记述的内容加入<data …/>。
其中必须的内容仅scheme，没有其他内容app也能启动。
※注意事项：intent-filter的内容【android.intent.action.MAIN】和 【android.intent.category.LAUNCHER】这2个，不能与这次追加的内容混合。
所以，如果加入了同一个Activity，请按以下这样做，否则会导致应用图标在桌面消失等问题。
<intent-filter> <action android:name="android.intent.action.MAIN"/> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> <intent-filter> <action android:name="android.intent.action.VIEW"/> <category android:name="android.intent.category.DEFAULT" /> <category android:name="android.intent.category.BROWSABLE" /> <data android:scheme="myapp" android:host="jp.app" android:pathPrefix="/openwith"/> </intent-filter>
这样的话，没有问题。
接下来在Activity中需要取值的地方添加以下代码，我是直接写在OnCreate函数里的：
String action = i_getvalue.getAction();
if(Intent.ACTION_VIEW.equals(action)){
Uri uri = i_getvalue.getData();
if(uri != null){
String name = uri.getQueryParameter("name");
String age= uri.getQueryParameter("age");
}
}
这样就能获取到URL传递过来的值了。
——————————————————————————————————我是分割线————————————————————————————————————
代码copy完了，是不是很惊奇的发现用浏览器输入
myapp://jp.app/openwith?name=zhangsan&age=26
是不是404，打不开？
楼主你这不是骗人么！楼主你个混蛋啊。
客官，稍安勿躁啊，你看看你用的浏览器是什么？UC，猎豹，欧朋？放弃吧，试试系统自带浏览器或者谷歌浏览器吧。肯定能成功的，不能成功的话再来坑我。哈哈。
——————————————————————————————————我是分割线————————————————————————————————————
突然觉得好悲哀，好不容易get了这个技能，却不能被第三方浏览器使用。在这个android浏览器大部分被第三方占据着的时代不得不说是个悲剧啊。
接下来还是说说为什么第三方浏览器不能成功吧。首先，我发现的是UC浏览器，如果你使用了自己的scheme，而不是http的话，uc会默认在你的scheme前面添加http://。这太坑爹了。其他浏览器没看是不是同样的情况。发现这个问题后我就试着把自己的scheme换成http。然后满怀期待的又跑了一遍，结果还是坑爹了。所以我想会不会是第三方浏览器对url做了处理。到这里，我也无可奈何了。我测试了UC,猎豹，欧朋，这3个都不支持。系统自带的和谷歌浏览器是支持的。
最后再补充个线索吧，在浏览器里搜索百度应用。进了他们的页面后，他们是可以实现在各种浏览器启动已经安装好的本地app的。看到这个后我就看了下他们页面的源码。
在这里他们页面添加了个data-sentintent的标签，看到这里，应该能确定第三方浏览器应该是默认都不支持发intent的，只能自己起一个。根据前端说，这个标签应该是自定义的。我们前端看源码的时候发现是这样的
所以最后的结果应该是百度这边是起了个端口，然后在应用里启用了一个服务，来监听这个端口，来获取这个intent。大概就这个思路了。不过楼主没有实际去操作。项目时间紧，太麻烦了。对了，百度这个是有集成他们inapp这个sdk的。
再附上stackoverflow两个相关链接：http://stackoverflow.com/questions/3469908/make-a-link-in-the-android-browser-start-up-my-app
http://stackoverflow.com/questions/2958701/launch-custom-android-application-from-android-browser
最近遇到这么一个需求：
当用户在手机浏览器中点击一个按钮时，如果手机上已经该应用程序，则直接打开，如果没有安装，则转向应用下载页面。 再详细一点就是：通过点击网页中一个按钮，打开本地某个Activity（如果有的话）或用浏览器打开某个url。
查了一下文档，Android是支持这个的：
http://developer.android.com/guide/topics/manifest/data-element.html
解释一下文档中的描述：scheme://host:port/path or pathPrefix or pathPattern
这里面定义的schema+host+port+(path or pathPrefix or pathPattern)能拼凑出一个http链接，包含这个filter的Activity，能处理这个http链接。
实现：
- 网页代码
点击这个按钮：
|
1
|
<a id="applink1" href="http://test.xx.com/demo/test.php">打开</a> |
在 http://test.xx.com/demo/test.php中，直接请求xxxx.apk下载。
- Activity代码
给目标Activity增加以下filter：
|
1
2
3
4
5
6
7
8
9
10
11
|
<intent-filter> <action android:name="android.intent.action.VIEW" /> <category android:name="android.intent.category.DEFAULT" /> <category android:name="android.intent.category.BROWSABLE" /> <data android:host="test.xx.com " android:path="/demo/test.php" android:scheme="http" /> </intent-filter> |
增加该filter后，该Activity就能处理 http://test.xx.com/demo/test.php。在浏览器中点击“开始”，发起对该URL的请求时，如果本机安装了这个应用，系统就会弹出一个选择，询问你想使用浏览器打开，还是使用该应用打开，如下图：
如果本机没有安装这个应用，则直接会使用浏览器打开 http://test.xx.com/demo/test.php，又因为该页面中直接请求了XX.apk，浏览器会提示你下载应用，如下图：
构建高可用的缓存集群的开源解决方案
很多应用都通过使用缓存来避免所有的请求都查询数据库，以加快系统的响应速度，Memcached是常用的缓存服务器（现在比较流行的还有Redis），它一个高性能的分布式内存对象缓存系统，旨在通过缓存数据库查询结果，减少数据库的访问次数。但是在运行多个Memcached服务器时，往往还需要考虑其它的问题，比如缓存一致性、缓存失效等，缓存一致性是指要保证多个Memcached服务器中数据的一致，缓存失效的后果相对来说比较严重，当在大并发访问的场景下，如果Memcached缓存失效，所有请求会在同一瞬间并发访问数据库，可能会导致数据库宕机。为了保证缓存系统的稳定和高可用，很多公司都研发了相应的系统。本文汇总了Twitter、Facebook、Youtube在缓存方面的解决方案，供读者参考。
-
Twitter的Redis/Memcached代理服务：Twemproxy
Twemproxy是一个使用C语言编写的Redis 和 Memcache 代理服务器，通过引入一个代理层，将应用程序后端的多台Redis或Memcached实例进行统一管理，使应用程序只需要在Twemproxy上进行操作，而不用关心后面具体有多少个真实的Redis或Memcached实例。当某个节点宕掉时，Twemproxy可以自动将它从集群中剔除，而当它恢复服务时，Twemproxy也会自动连接。由于是代理，所以Twemproxy会有微小的性能损失。 -
Facebook的Memcached协议路由器：McRouter
McRouter是一个使用C++（主要语言，使用了大量的C++ 11特性）开发的基于Memcached协议的路由器，它是Facebook和Instagram缓存架构的核心组件，在高峰时期可以处理近50亿请求。McRouter中客户端可以共享连接池，这样能减少连接的数量。McRouter可以根据key前缀把客户端分配到不同的Memcached池中，允许以主机、池或者集群为单位设置任何请求的速率的阀值,同时也支持限制请求的速度以减缓请求的发送速度，以保障服务质量。 -
Youtube的Mysql中间件：Vitess
缓存层存在的初衷是减少应用与数据库的交互，以提高响应时间，与其将缓存与数据库分离，不如直接将缓存嵌入数据库中。Vitess是Youtube的开源分布式MySQL工具集，主要使用Go语言编写，已经用于Youtube生产环境。Vitess支持行级缓存，并与Memcached进行了集成，可以有效提高带主键查询的速率，查询只有在Memcached中查询不到时才会进入数据库查询，而当数据被修改或者数据库表结构发生变化时，缓存数据会被删除。
另外，还有一些未开源的解决方案，比如Box的Tron。同时，InfoQ也非常关注国内相关问题的解决方案，欢迎读者在评论中留言与我探讨。