---恢复内容开始---

$(document).ready(function () {
　　$(".jianjie").click(function () {
　　　　$(this).toggleClass("brief");//切换类名，在一个类名上增加、删除类名
　　});
　　$(".jj_v").click(function () {
　　　　$(".none_v").slideToggle("slow");//点击滑动显示、隐藏
　　});
　　$(".jj_v").click(function () {
　　　　$(".none_v").fadeToggle(1000);//点击淡入、淡出
　　});
　　$(".jj_v").click(function () {
　　　　$(".none_v").toggle();//点击显示、隐藏
　　});
});
　　var a = 0;
　　$(".jj_v").click(function () {
　　　　　　a++;
　　　　if(a%2){
 　　　　　　　　$(".none_v").show(1000);//1秒展开
　　　　　　　　$(".none_v").fadeIn("slow");//淡入
 　　　　}else{
　　　　　　　　$(".none_v").hide(1000);//1秒隐藏
　　　　　　　　$(".none_v").fadeOut("1000");//淡出
　　　　 }
});
 

<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function(){
　　$("button").click(function(){
　　　　$("#div1").fadeTo("slow",0.15);//透明度
　　　　$("#div2").fadeTo("slow",0.4);
　　　　$("#div3").fadeTo("slow",0.7);
　　});
});
</script>
</head>

<body>

<p>演示带有不同参数的 fadeTo() 方法。</p>
<button>点击这里，使三个矩形淡出</button>
<br><br>
<div id="div1" style="width:80px;height:80px;background-color:red;"></div>
<br>
<div id="div2" style="width:80px;height:80px;background-color:green;"></div>
<br>
<div id="div3" style="width:80px;height:80px;background-color:blue;"></div>

</body>
</html>

---恢复内容结束---

jq 切换功能toggle的更多相关文章

  1. ViewPager取消左右滑动切换功能

    ViewPager取消左右滑动切换功能 最近做项目要求某种情况下ViewPager不能滑动,那么我们只需要重写这个方法就可以禁止ViewPager滑动 IndexViewPager.java: imp ...

  2. ViewPager撤消左右滑动切换功能

    ViewPager取消左右滑动切换功能 最近做项目要求某种情况下ViewPager不能滑动,那么我们只需要重写这个方法就可以禁止ViewPager滑动 IndexViewPager.java: imp ...

  3. javascript回车完美实现tab切换功能

    javascript通过回车实现tab切换功能,最经有一个项目是给化工厂做的在使用的过程中需要输入大量的数据,使用的都是小键盘区,在以前都是通过excel录入数据的现在, 在网页上需要实现excel ...

  4. JS 实现 Tab标签切换功能

    Tab标签切换 效果图: HTML部分: <div class="wrap">     <ul id="tag">       < ...

  5. 【百度地图API】暑假放假回老家——城市切换功能

    原文:[百度地图API]暑假放假回老家--城市切换功能 任务描述: 酸奶小妹放寒假啦,要从北京呼啦一下飞回重庆呢.现在百度地图API上不能直接切换城市,怎么办呢? 如何实现: 利用API先搜索到要去城 ...

  6. 为JQuery EasyUI 表单组件增加“焦点切换”功能

    1.背景说明 在使用 JQuery  EasyUI 各表单组件时,实际客户端页面元素是由 JQuery EasyUI 生成的,元素的焦点切换,虽然 Tab 键可以正常用,但顺序控制属性 tabinde ...

  7. vue实现tab切换功能

    最近用vue做一个页面的tab功能,经过一查找资料,没用路由,也没用动态组件,完美实现了tab切换功能,效果如下 下面是代码实现,这是模板 <article id="example&q ...

  8. AndroidStudio制作底部导航栏以及用Fragment实现切换功能

    前言 大家好,给大家带来AndroidStudio制作底部导航栏以及用Fragment实现切换功能的概述,希望你们喜欢 学习目标 AndroidStudio制作底部导航栏以及用Fragment实现切换 ...

  9. tabs自动切换功能的实现

    <html><head><!-- Bootstrap 核心 CSS 文件 --> <link rel="stylesheet" href= ...

随机推荐

  1. 浅入浅出JDBC————1分钟了解JDBC

    一.了解基本的几个jdbc需要的类 1.1DriverManager类 DriverManager类是一个jdbc的驱动服务类.通常使用该类获得一个Connection对象,得到一个数据库的链接. 1 ...

  2. Java 错误: 找不到或无法加载主类，问题集合

      正确编译命令: javac Hello.java 正确运行命令: java Hello   错误1:H:\code>java Hello.java 错误: 找不到或无法加载主类 Hello. ...

  3. python中calendar模块的常用方法

    >>> import calendar >>> calendar.isleap(2000) #判断是否是闰年 True >>> calendar. ...

  4. because there was insufficient free space available after evicting expired cache entries

    Tomcat运行的时候哗哗哗的报警告 版本是Tomcat 8.5.15 告警信息关键字如下 because there was insufficient free space available af ...

  5. redis 的备份策略，最好使用：RDB-AOF 混合持久化

    相关资料: Redis 4.0 新功能简介:RDB-AOF 混合持久化:http://blog.huangz.me/2017/redis-rdb-aof-mixed-persistence.html ...

  6. Web Service入门简介(一个简单的WebService示例)

    Web Service入门简介 一.Web Service简介 1.1.Web Service基本概念 Web Service也叫XML Web Service WebService是一种可以接收从I ...

  7. mysql 将行拼接成字符串的方法

    见代码: ;//保证可以拼接足够长的字符串,没它 数据量大时会截断结果1 group by videoType 效果如下:

  8. 【ELK】之Kibana使用

    GET _search { "query": { "match_all": {} } } GET _cat/indices GET elk- GET /elk- ...

  9. UML 序列图详解

    现在是二月,而且到如今你或许已经读到.或听到人们谈论UML 2.0 —— 包括若干进步的 UML 的新规范,所做的变化.考虑到新规范的重要性,我们也正在修改这个文章系列的基础,把我们的注意力从 OMG ...

  10. ylbtech-协议-网络-安全协议：HTTPS

    ylbtech-协议-网络-安全协议:HTTPS HTTPS(全称:Hyper Text Transfer Protocol over Secure Socket Layer 或 Hypertext ...