本月博客排行
-
第1名
龙儿筝 -
第2名
lerf -
第3名
fantaxy025025 - johnsmith9th
- xiangjie88
- zysnba
年度博客排行
-
第1名
青否云后端云 -
第2名
宏天软件 -
第3名
gashero - wy_19921005
- vipbooks
- benladeng5225
- e_e
- wallimn
- javashop
- ranbuijj
- fantaxy025025
- jickcai
- gengyun12
- zw7534313
- qepwqnp
- 解宜然
- ssydxa219
- zysnba
- sam123456gz
- sichunli_030
- arpenker
- tanling8334
- gaojingsong
- kaizi1992
- xpenxpen
- 龙儿筝
- jh108020
- wiseboyloves
- ganxueyun
- xyuma
- xiangjie88
- wangchen.ily
- Jameslyy
- luxurioust
- lemonhandsome
- mengjichen
- jbosscn
- zxq_2017
- lzyfn123
- nychen2000
- forestqqqq
- wjianwei666
- ajinn
- zhanjia
- Xeden
- hanbaohong
- java-007
- 喧嚣求静
- mwhgJava
- kingwell.leng
最新文章列表
AngularJs中ng-repeat指令的默认animate动画
这两天做前端AngularJs开发的时候引了个uib-pagination翻页控件,结果翻页的时候发现旧数据与新数据同时保留的几百毫秒,然后旧数据才消失,感觉体验不太好。但是没想出来时为什么,开始以为数据或数组操作出问题,搞了很长时间没搞明白。结果一步一步删代码发现问题出在引入的animate包身上。
原来ng-repeat指令在引入animate的情况下自动调用ng-enter,n ...
使用angular-ui-bootstrap的collapse的时候,缓动动画无法播放的问题
在使用ui-bootstrap的时候,试用了collapse这个组件,但是发现缓动动画一直无法播放
直接解决问题,可翻至最后,想进行分析调试,可看中间过程。
翻看源码,ui-bootstrap的源码最上就是uibCollapse的源码(我是用的版本是1.0,与之前的0.x版本源码有很大出入)
在源码中,坚挺了uibCollapse的值,当值发生变化,则会分别调用expand()或者collap ...
博弈AngularJS讲义(13) - 动画
动画
AngularJS 1.3版本为常用的指令(ngRepeat,ngSwitch,ngView...)提供了动画支持,另外还可以通过$animate组件为自定义的指令提供动画支持。这些动画钩子(hook)将在指令的生命周期内触发基于CSS变换(Transition), CSS Keyframe,或者js回调的动画。添加动画支持需要引入ngAnimate模块(下载附件angular-an ...
jquery中animate()的用法
.animate( properties [, duration ] [, easing ] [, complete ] )
properties:CSS属性和值,该动画将对应移动的对象。
例:
$( "#clickme" ).click(function() {
$( "#book" ).animate({
left: & ...
jquery animate()背景色渐变的处理
jquery animate函数不能处理背景色渐变,需要使用jquery.color插件
gitHub地址:https://github.com/jquery/jquery-color/
使用代码:
$(function(){
$("#cdiv").animate({
backgroundColor:'#FF0000'
}, 1000) ...
jquery自定义动画
使用jquery实现自定义动画方法
使用animate 实现动画
css样式
//定义图片属性
img{position:relative;}//定位
代码
$(function () {
// $("img").hover(function () {
//
// ...
通过Graphics对象来实现动画效果
通过Graphics对象来实现动画效果
原创不易,转载请注明出处:通过Graphics对象来实现动画效果
package com.zuidaima.animate;
import java.awt.Color;
import java.awt.Graphics;
import java.awt.Insets;
import java.util.Timer;
import ja ...
jQuery animate分页标签按钮鼠标悬停滑动展开分页按钮-20130730
1、效果及功能说明
animate动画分页按钮制作鼠标悬停分页按钮上滑动展开分页按钮,鼠标离开后分页按钮收缩
2、实现原理
主要是靠动画方法,来让原本的箭头图像的长度发生变长,正好可以融入下标题的文字大小,当鼠标离开以后就会让箭头图像触发另一个动画效果让让标题消失和长度变回原来的大小。
主要的方法
$(this).animate({width:90},400,function() ...
jQuery 侧栏与工具提示-20130726
1、效果及功能说明
当鼠标触及到标题就会触发一个侧显示框来告诉基础信息
2、实现原理
主要是靠伪类来触发效果,当提示框从左边出来,让后显示出上面的信息,获得一个定义好的类来修改上面的字体等信息,当鼠标离开后自动回去,并且删除类,当鼠标触及到时多有动画停止,确保了不会有重复的出现
主要的方法
$(this).find("div").stop().animate( ...
jQuery animate或css3制作查看原图按钮收缩隐藏-20130718
1、效果及功能说明
制作两种查看原图按钮收缩展开,隐藏关闭
2、实现原理
定义好伪类让后让伪类来控制显示原图片的标志出现和隐藏,通过css来定义图标出现的位置和多少时间内完成动画的效果,在分别定义鼠标在图片的左右变成左右箭头的鼠标告诉用户往那边滚动
主要的方法
$("#pin-jsbox").mouseenter(function(){
//控制容器里面的按 ...
jQuery 鼠标悬停到图片时浮动高亮透明层滑动到当前图片高亮-20130714
1、效果及功能说明
鼠标悬停到图片时,浮动高亮透明层随着鼠标悬停的图片相应滑动到当前图片高亮显示
2、实现原理
先定义好给图片加透明层的效果但后先去掉,当鼠标移动到图片的上面立即触动一个方法让给透明层的通过一个动画进入到用户的视野里,从高度和宽度都是设定的图片的两倍后在开始缩小直接到和原图片一样大小位置,随着鼠标移动到那张图片而移动
主要的方法
$('.box').bind(' ...
jQuery段落文字内容高亮显示提示-20130712
1、效果及功能说明
段落文字内容高亮显示一段主要文字内容提示。通过设置鼠标滑过段落标签,高亮显示此标签的内容含义信息
2、实现原理
先定义三个伪类事件的触发,然后定义触发伪类的后需要的效果,在把这些效果分别设定当相印的触发条件里面去,效果是让不是主体的文字透明多少,在给主体的文字加上背景颜色和字体颜色的加深让用户更好知道字段文章的主要要说的是什么
主要的方法
maskSourc ...
Jquery简单入门到精通细节 - (十一)Jquery效果之“Chaining”
通过 jQuery,您可以把动作/方法链接起来。
Chaining 允许我们在一条语句中允许多个 jQuery 方法(在相同的元素上)。
jQuery 方法链接
直到现在,我们都是一次写一条 jQuery 语句(一条接着另一条)。
不过,有一种名为链接(chaining)的技术,允许我们在相同的元素上运行多条 jQuery 命令,一条接着另一条。
提示:这样的话,浏览器就不 ...
Jquery简单入门到精通细节 - (十)Jquery效果之“Callback 函数”
jQuery Callback 函数
jQuery 动画的问题
许多 jQuery 函数涉及动画。这些函数也许会将 speed 或 duration 作为可选参数。
例子:$("p").hide("slow")
speed 或 duration 参数可以设置许多不同的值,比如 "slow", "fast" ...