css

.category > div.active {
animation: servicetobig 0.5s ease 1 forwards;
}
@keyframes servicetobig {
100% {
transform: scale(1.1);
box-shadow: 0px 0px 10px #ccc;
z-index: 1000;
}
}

js

 $(".categoryDiv").mouseenter(function(){
$(this).addClass("active").siblings().removeClass("active")
}).mouseleave(function(){
$(this).removeClass("active")
})

一排盒子,jq鼠标移入的盒子动画移出停止动画,css动画的更多相关文章

  1. JavaScript--获取页面盒子中鼠标相对于盒子上、左边框的坐标

    分析: 外层边框是浏览器边框,内部盒子是页面的一个盒子,绿点是盒子中鼠标的位置.鼠标相对盒子边框的坐标=页面中(注意不是浏览器)鼠标坐标-盒子相对于浏览器边框的偏移量 第一步:求浏览器边框位置 x=e ...

  2. jq鼠标移入和移出事件

    前几天帮朋友做了一个单页面,其中有个效果就是鼠标移动到头像上变换头像样式,当鼠标移出时恢复头像样式.当时没多想,脑子就蹦出了mouseover,mouseout两个方法. 但是在编写页面的过程中,无论 ...

  3. checkbox下面的提示框 鼠标移入时显示,移出时隐藏

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...

  4. jq鼠标移入移除事件

    mouseover与mouseenter 不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件.只有在鼠标指针穿过被选元素时,才会触发 mouseenter 事件. mouseout ...

  5. jq鼠标移入移除

    ele.on({ mouseover : function(){ } , mouseout : function(){ } })

  6. CSS3动画效果——js调用css动画属性并回调处理详解

    http://www.jb51.net/css/258407.html 这篇文章主要详细介绍了CSS3动画效果回调处理,需要的朋友可以参考下 我们在做js动画的时候,很多时候都需要做回调处理,如在一个 ...

  7. 盒子端 CSS 动画性能提升研究

    不同于传统的 PC Web 或者是移动 WEB,在腾讯视频客厅盒子端,接大屏显示器(电视)下,许多能流畅运行于 PC 端.移动端的 Web 动画,受限于硬件水平,在盒子端的表现的往往不尽如人意. 基于 ...

  8. CSS动画效果的回调

    用纯JS实现动画效果代码量大,计算复杂.因此现在前端页面的动画效果一般都采用CSS来实现. CSS动画实现简单高效,但是在处理动画,控制动画过程上却缺少一些有效手段. 例如我们想在动画效果完成时调用回 ...

  9. vue中css动画原理

    显示原理: <transition name='fade'> <div v-if='show'>hello world</div> </transition& ...

随机推荐

  1. VOIP开源项目源码地址

    http://blog.csdn.net/hwz119/article/details/1781482     VoIP bookmarks from Klaus Darilion Below you ...

  2. 【数论】不定方程&逆元&中国剩余定理

    一.不定方程 要求逆元,首先要知道什么是不定方程. 已知a,b,c,求解x,y,形如ax + by = c 的方程就是不定方程. 不定方程有两种解的情况: 1.无解 2.存在且有无限的解 那么,如何判 ...

  3. jQuery打飞机游戏

    在线演示 本地下载

  4. objectarx之两条曲线最短距离

    double CCommonFuntion::GetLineDistance(AcDbObjectId& Line1, AcDbObjectId& Line2){ AcGeLineSe ...

  5. iOS将image转90,180,270度的方法

    http://blog.sina.com.cn/s/blog_6602ffbc0101ckx3.html 这里要分享的是将image旋转,而不是将imageView旋转,原理就是使用quartz2D来 ...

  6. AtCoder Beginner Contest 084 C - Special Trains

    Special Trains Problem Statement A railroad running from west to east in Atcoder Kingdom is now comp ...

  7. Gartner:阿里云位列全球云数据库市场份额前三,数据库未来需上云

    近日,国际权威研究机构Gartner发布 <The Future of the Database Management System (DBMS) Market Is Cloud>报告,鲜 ...

  8. [***]沙雕低错集(算起来因为低错挂掉的分快够我AK三场了……)

    由于沙雕错太多了所以不想写了,看着就难受…… 各种沙雕错(自从上次考试开始各种犯沙雕低错……): !!!sort是不稳定的排序,如果排序结构题只按其中一个关键字排序,那么在关键字相等时,排序多次的结果 ...

  9. 25-3 requests模块的cookie和代理操作

    一.基于requests模块的cookie操作 引言:有些时候,我们在使用爬虫程序去爬取一些用户相关信息的数据(爬取张三“人人网”个人主页数据)时,如果使用之前requests模块常规操作时,往往达不 ...

  10. this 、静态变量

    /*作者:qingfeng日期:2017/2/18功能:this,静态变量(类变量)*/class Demo3_2{    public static void main(String args[]) ...