<style>

#d1{

width:200px;

height:200px;

border:1px solid #000;

transition:background 4s linear,transform 5s linear;

}

//当鼠标移入div上时

#d1:hover{

background:#ddd;

transform:rotate(45deg)  scale(0.5);

}

</style>

<body>

//页面中有一个div

<div id="d1"></div>

</body>

当鼠标移入div上时,div的背景色在4s之内渐变为灰色,同时在5s之内顺时针旋转45度,且尺寸缩小一半;当鼠标移走时,再渐变恢复初始样式的更多相关文章

  1. js(jquery)鼠标移入移出事件时,出现闪烁、隐藏显示隐藏显示不停切换的情况

    <script> $(".guanzhu").hover(function(){ $(".weixinTop").show(); },functio ...

  2. jquery自定义滚动条 鼠标移入或滚轮时显示 鼠标离开或悬停超时时隐藏

    一.需求: 我需要做一个多媒体播放页面,左侧为播放列表,右侧为播放器.为了避免系统滚动条把列表和播放器隔断开,左侧列表的滚动条需要自定义,并且滚动停止和鼠标离开时要隐藏掉. 二.他山之石: 案例来自h ...

  3. angularjs 怎么获取鼠标焦点 鼠标移入显示浮动的div提示框

    首先,我们要清楚几个基础的知识,angular的两个鼠标移入移出的指令------ng-mouseover(鼠标移入)ng-mouseleave(鼠标移出)--------还有就是window.eve ...

  4. Tooltip鼠标hover放上时文字提示

    使用content属性来决定hover时的提示信息. 由placement属性决定展示效果: placement属性值为:                 方向-对齐位置: 四个方向:top.left ...

  5. 转:zTree树控件key配置之title:zTree树节点名称过长如何省略显示且鼠标移入节点上能够显示全称

    当树节点的名称有些很长时,全部显示出来显得很拥挤的情况下,我们会想到用省略节点名称来代替,当鼠标移入节点时能够显示该节点的全称.这样我们应该如何做呢? 首先,我们要在树的节点内多增加一个属性用于设置该 ...

  6. 鼠标悬浮到div上,div进行360°旋转

    <!DOCTYPE html> <html> <head> <title>旋转</title> </head> <styl ...

  7. div滚动条时div内容显示一半

    本文为博主原创,未经允许不得转载 今天在做页面浏览器适配时,将页面中的一个div进行放大时,出现了滚动条,但滚动条对应div中的 内容只能显示一半. 仔细对应属性样式时,div具有overflow:h ...

  8. JS鼠标移入,移出事件

    该事件的效果就像百度首页的设置选项,当鼠标移入,移出时的效果,废话不多说了,直接上码. <!DOCTYPE html><html lang="en">< ...

  9. marquee 滚动到文字上时停止滚动,自定义停止方法

    我要实现的效果如下图:当鼠标移到续费提醒文字上时,文字滚动停止,并出现后面的关闭按钮:当鼠标移出文字时,文字继续滚动,后面的关闭按钮不显示. 在网上查到的marquee停止滚动的的代码是这样的: &l ...

随机推荐

  1. Windows7 如何添加excel,word到鼠标右键

    1.添加word到鼠标右键新建 首先Windows键+R---->输入regedit并回车------>看到HKEY_CLASSES_ROOT展开------>找到.doc展开--- ...

  2. 大数据初级sy

    1.spark 是用以下哪种编程语言实现的? A.C             B  C++       C   JAVA               D.Scala (正确答案) 2.FusionIn ...

  3. Pytest学习笔记8-参数化

    前言 我们在实际自动化测试中,某些测试用例是无法通过一组测试数据来达到验证效果的,所以需要通过参数化来传递多组数据 在unittest中,我们可以使用第三方库parameterized来对数据进行参数 ...

  4. excel函数提取身份证出生日期,分离日期时间的日期和时间

    1.提取身份证出生日期 =1*TEXT(MID(H13,7,8),"0-00-00")用MID函数提取表示日期的位数,再用text函数转换为格式1998-6-21格式的文本,再通过 ...

  5. Salesforce LWC学习(三十五) 使用 REST API实现不写Apex的批量创建/更新数据

    本篇参考: https://developer.salesforce.com/docs/atlas.en-us.224.0.api_rest.meta/api_rest/resources_compo ...

  6. 流程自动化RPA,Power Automate Desktop系列 - 构建VuePress文档中心脚手架

    一.背景 笔者曾基于VuePress搭建过一个文档中心,但是在实现在线管理功能之前,很多时候,新建文档需要手动处理很多数据,看有没有可能实现一个脚手架来处理这些问题,所谓脚手架,就是进行文档初始化的一 ...

  7. 15、mysql事物和引擎

    15.1.数据库事物介绍: 1.什么是数据库事物:

  8. CentOS-磁盘扩容挂载目录

    挂载 查看存储情况 $ df -kh 查看磁盘情况 $ fdisk -l fdisk创建分区(注:可操作存储上限为2TB)$ fdisk /dev/sdb根据提示,依次输入"n", ...

  9. 因为它,我差点删库跑路:js防抖与节流

    前言 前端踩雷:短时间内重复提交导致数据重复. 对于前端大佬来说,防抖和节流的技术应用都是基本操作.对于"兼职"前端开发的来说,这些都是需要躺平的坑. 我们今天就来盘一盘js防抖与 ...

  10. ESP32S2获取sht30温湿度

    static const char *TAG = "i2c-temp"; static unsigned char sht30_buf[6]={0}; static float g ...