侧边栏下拉时箭头的旋转动画(treeView控件)
//点击菜单时箭头旋转
let treeView = document.getElementsByClassName("treeview");//let解决闭包问题
let last=document;
for (let i = 0; i <treeView.length ; i++) {
treeView[i].addEventListener("click",function(){
let that = treeView[i];
if (that.classList.contains("menu-open")){
last.getElementsByTagName("i")[1].style.transform="rotateZ(180deg)";
that.getElementsByTagName("i")[1].style.transform="rotateZ(0deg)";
that.getElementsByTagName("i")[1].style.transition="0.5s";
}else{
last.getElementsByTagName("i")[1].style.transform="rotateZ(0deg)";
that.getElementsByTagName("i")[1].style.transform="rotateZ(180deg)";
that.getElementsByTagName("i")[1].style.transition="0.5s";
}
//把上次点击事件的元素保存
last = that;
})
}
<!--网页源代码-->
侧边栏下拉时箭头的旋转动画(treeView控件)的更多相关文章
- 旋转动画用控件RotateView
旋转动画用控件RotateView 最终效果: 源码: RotateView.h 与 RotateView.m // // RotateView.h // RotateAnimationView // ...
- QTP 自动化测试桌面程序--笔记(下拉选择、右键菜单、在控件仓库中查找对应的控件)
0 在收集窗口控件信息时-最好将可输入的文字去掉,不然控件的名称按输入的文字标记 1 编辑时录制脚本-默认按当前显示的填入的数据标记控件 可以使用 tool-spy-查看控件的x,y 坐标,按坐标在学 ...
- dev下拉框选择不同值显示不同控件
单列的ASPxFormLayout直接前台控制就可以了,多列的前台控制后会出现空白 <dx:LayoutItem Caption="内容类型" Height="40 ...
- extjs combobox 设置下拉时显示滚动条 设置显示条数
extjs在点击下拉时如果没有限制它的高度,那么它的默认最大高度是300,显示的时候就会显示300的高度,知道选项内容超过这个高度时才会自动显示滚动条,往往在有些时候我们希望让combobox显示一个 ...
- 定制自己的动画 View 控件(Canvas 使用)
定制自己的动画 View 控件(Canvas 使用) 如果要定义自己的 View 控件,则需要新建一个类继承 android.view.View.然后在 onDraw 中写自己需要实现的方式. 这里定 ...
- C#TreeView控件遍历文件夹下所有子文件夹以及文件
一直对递归的理解不深刻,有时候觉得很简单,可是用起来总会出错.这里需要在TreeView控件里显示一个文件夹下的所有目录以及文件,毫无意外的需要用到递归. 一开始,想到用递归写一个生成每一个节点(Tr ...
- [转] C#2010 在TreeView控件下显示路径下所有文件和文件夹
原文 张丹-小桥流水,C#2010 在TreeView控件下显示路径下所有文件和文件夹 C#2010学习过程中有所收获,便总结下来,希望能给和我一样在学习遇到困难的同学提供参考. 本文主要介绍两个自定 ...
- Delphi下Treeview控件基于节点编号的访问
有时我们需要保存和重建treeview控件,本文提供一种方法,通过以树结构节点的编号访问树结构,该控件主要提供的方法如下: function GetGlobeNumCode(inNode:T ...
- Delphi下Treeview控件基于节点编号的访问1
有时我们需要保存和重建treeview控件,本文提供一种方法,通过以树结构节点的编号访问树结构,该控件主要提供的方法如下: function GetGlobeNumCode(inNode:T ...
随机推荐
- SearchRequest用于与搜索文档、聚合、定制查询有关的任何操作
SearchRequest用于与搜索文档.聚合.定制查询有关的任何操作,还提供了在查询结果的基于上,对于匹配的关键词进行突出显示的方法. 1,首先创建搜索请求对象:SearchRequest sear ...
- 在visual studio中快速添加代码段
昨天我在网课上,看到老师输入#2之后,立马就出现了一堆代码. 我于是赶紧打开自己的visual studio尝试一下,并没有任何反应. 上网查找,发现visual studio有自定义代码段的功能. ...
- golang数据库操作初体验
在golang中,提供了标准的数据库接口database/sql包,做过数据库开发的应该知道,不同的数据库有不同的数据库驱动.比如mysql等,我们可以去找 https://golang.org/s/ ...
- 国外电商网站snapdeal爬取流程
首页爬取 1.首页获取各个目录的url 如所有优惠all_offers的其中urlhttps://www.snapdeal.com/products/men-apparel-shirts?sort=p ...
- JavaScript - __proto__和prototype,原形
参考 https://stackoverflow.com/questions/9959727/proto-vs-prototype-in-javascript 区别 构造函数中的prototype创建 ...
- AT指令之 TCP/IP 命令
BC26 还有一组专用于 TCP 通信的 AT 指令:<BC26_TCP/IP_AT_Commands_Manual_V1.1>,之前已经有了 Socket 可以进行 TCP 通信,现在又 ...
- 误删Django的model中的表解决办法
误删Django的model中的表解决办法 1.model里面的表格实际的操作都在migrations文件夹中,里面记录了操作过程,当在database和model中删除表格时要注意初始化数据库时会报 ...
- 不高兴的津津(0)<P2004_1>
不高兴的津津(unhappy.pas/c/cpp) [问题描述] 津津上初中了.妈妈认为津津应该更加用功学习,所以津津除了上学之外,还要参加妈妈为她报名的各科复习班.另外每周妈妈还会送她去学习朗诵. ...
- 「快学springboot」集成Spring Security实现鉴权功能
Spring Security介绍 Spring Security是Spring全家桶中的处理身份和权限问题的一员.Spring Security可以根据使用者的需要定制相关的角色身份和身份所具有的权 ...
- flask exception
flask exception 1.1. abort 概念:flask中的异常处理语句,功能类似于python中raise语句,只要触发abort,后面的代码不会执行,abort只能抛出符合ht ...