//点击菜单时箭头旋转
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控件)的更多相关文章

  1. 旋转动画用控件RotateView

    旋转动画用控件RotateView 最终效果: 源码: RotateView.h 与 RotateView.m // // RotateView.h // RotateAnimationView // ...

  2. QTP 自动化测试桌面程序--笔记(下拉选择、右键菜单、在控件仓库中查找对应的控件)

    0 在收集窗口控件信息时-最好将可输入的文字去掉,不然控件的名称按输入的文字标记 1 编辑时录制脚本-默认按当前显示的填入的数据标记控件 可以使用 tool-spy-查看控件的x,y 坐标,按坐标在学 ...

  3. dev下拉框选择不同值显示不同控件

    单列的ASPxFormLayout直接前台控制就可以了,多列的前台控制后会出现空白 <dx:LayoutItem Caption="内容类型" Height="40 ...

  4. extjs combobox 设置下拉时显示滚动条 设置显示条数

    extjs在点击下拉时如果没有限制它的高度,那么它的默认最大高度是300,显示的时候就会显示300的高度,知道选项内容超过这个高度时才会自动显示滚动条,往往在有些时候我们希望让combobox显示一个 ...

  5. 定制自己的动画 View 控件(Canvas 使用)

    定制自己的动画 View 控件(Canvas 使用) 如果要定义自己的 View 控件,则需要新建一个类继承 android.view.View.然后在 onDraw 中写自己需要实现的方式. 这里定 ...

  6. C#TreeView控件遍历文件夹下所有子文件夹以及文件

    一直对递归的理解不深刻,有时候觉得很简单,可是用起来总会出错.这里需要在TreeView控件里显示一个文件夹下的所有目录以及文件,毫无意外的需要用到递归. 一开始,想到用递归写一个生成每一个节点(Tr ...

  7. [转] C#2010 在TreeView控件下显示路径下所有文件和文件夹

    原文 张丹-小桥流水,C#2010 在TreeView控件下显示路径下所有文件和文件夹 C#2010学习过程中有所收获,便总结下来,希望能给和我一样在学习遇到困难的同学提供参考. 本文主要介绍两个自定 ...

  8. Delphi下Treeview控件基于节点编号的访问

    有时我们需要保存和重建treeview控件,本文提供一种方法,通过以树结构节点的编号访问树结构,该控件主要提供的方法如下:      function GetGlobeNumCode(inNode:T ...

  9. Delphi下Treeview控件基于节点编号的访问1

    有时我们需要保存和重建treeview控件,本文提供一种方法,通过以树结构节点的编号访问树结构,该控件主要提供的方法如下:      function GetGlobeNumCode(inNode:T ...

随机推荐

  1. Jmeter_请求原件之参数化txt

    把数据存放在TXT上进行参数化,然后运行 用于注册,登录等不同的用例 1.登录接口地址: http://test.lemonban.com/futureloan/mvc/api/member/logi ...

  2. Ubantu 固定IP

    ubantu固定IP设置 1.以root身份登录 2. vi /etc/network/interfaces 参照截图修改,保存退出 3.刷新接口,重启服务 /etc/init.d/networkin ...

  3. SpringBoot常用注解解析

    @RestController 将返回的对象数据直接以 JSON 或 XML 形式写入 HTTP 响应(Response)中.绝大部分情况下都是直接以 JSON 形式返回给客户端,很少的情况下才会以 ...

  4. 并发队列之ArrayBlockingQueue

    上一篇我们说了并发队列中的LinkedBlockingQueue队列,这次我们看看ArrayBlockingQueue,看看名字,我们想象一下LinkedList和ArrayList的区别,我们可以知 ...

  5. JavaScript 引擎「V8」发布 8.0 版本,内存占用量大幅下降

    上周,JavaScript 引擎「V8」的开发团队在该项目官方网站上正式宣布推出最新的 8.0 版本.这次更新的重点主要集中在错误修复及性能改善上,正式的版本将在数周后随着谷歌 Chrome 80 稳 ...

  6. WKWebView单个界面添加请求头

    https://www.jianshu.com/p/14b9ea4bf1d4 https://github.com/Yeatse/NSURLProtocol-WebKitSupport/blob/ma ...

  7. twisted 模拟scrapy调度循环

    """模拟scrapy调度循环 """from ori_test import pr_typeimport loggingimport ti ...

  8. Spark教程——(11)Spark程序local模式执行、cluster模式执行以及Oozie/Hue执行的设置方式

    本地执行Spark SQL程序: package com.fc //import common.util.{phoenixConnectMode, timeUtil} import org.apach ...

  9. 【PAT甲级】1030 Travel Plan (30 分)(SPFA,DFS)

    题意: 输入N,M,S,D(N,M<=500,0<S,D<N),接下来M行输入一条边的起点,终点,通过时间和通过花费.求花费最小的最短路,输入这条路径包含起点终点,通过时间和通过花费 ...

  10. Android编程实现点击链接打开APP功能示例

    本文实例讲述了Android编程实现点击链接打开APP功能.分享给大家供大家参考,具体如下: 在Android中点击链接打开APP是一个很常见的需求.例如,电商为用户发送优惠券之后经常会下发一条短信: ...