<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <style>

        .hide{

            display: none;

        }

        .header{

            background-color: #eeeeee;

            height: 40px;

            width: 600px;

            margin: 0 auto;

        }

        .header .menu{

            float: left;

            border-right: 1px solid black;

            padding: 0 5px;

            line-height: 40px;

            cursor: pointer;

        }

        .content{

            height: 100px;

            border: 1px solid black;

            width: 600px;

            margin: 0 auto;

        }

        .active{

            background-color: #dddddd;

        }

    </style>

</head>

<body>

     <div class="header">

         <div class="menu" a="1">菜单一</div>

         <div class="menu" a="2">菜单二</div>

         <div class="menu" a="3">菜单三</div>

     </div>

     <div class="content">

          <div class="hide" b="1">内容一</div>

          <div class="hide" b="2">内容二</div>

          <div class="hide" b="3">内容三</div>

     </div>

<script src="../jquery-2.12.4.js"></script>

<script>

    $('.menu').click(function () {

        $(this).addClass('active');

        var tag = $(this).attr('a');

        target = '.content [b=' + tag +']';

        $(target).removeClass('hide').siblings().addClass('hide')

    })

</script>

</body>

</html>

横向文本框 cursor:pointer 出现手型的更多相关文章

  1. <a>标签缺少href 属性，鼠标经过不会出现手型

    声明: web小白的笔记,欢迎大神指点.联系QQ:1522025433. 直接看实例吧! <!doctype html> <html> <head> <met ...

  2. 横向文本框 index获取索引 和 eq 实现

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. 限制文本框只能输入数字或浮点数的JS脚步

    1.oninput,onpropertychange,onchange的用法 l          onchange触发事件必须满足两个条件: a)当前对象属性改变,并且是由键盘或鼠标事件激发的(脚本 ...

  4. 手机浏览器浏览WebApp弹出的键盘遮盖住文本框的解决办法

    手机浏览器浏览WebApp弹出的键盘遮盖住文本框的解决办法 最近碰到Android微信内置浏览H5页面,因为其中的文本输入框(input)放置在靠近页面的中下方,点击文本框以后,则输入框会被弹出的手机 ...

  5. android 弹出的软键盘遮挡住EditText文本框的解决方案

    1.android 弹出的软键盘遮挡住EditText文本框的解决方案: 把Activit对应的布局文件filename.xml文件里的控件用比重设置布局.(例如:android:layout_wei ...

  6. 原生js日期时间插件鼠标点击文本框弹出日期时间表格选择日期时间

    原文出处 (这是我从互联网上搜来的,感觉能满足各方面的需求.个人感觉挺不错的,所以后期修改了一下向大家推荐!) 效果图: html代码: <!DOCTYPE html PUBLIC " ...

  7. 微信内置浏览器浏览H5页面弹出的键盘遮盖文本框的解决办法（转）

    最近在做微信公众号的内嵌页面,发现点击输入框时键盘盖住文本框,找到一段代码解决了这个问题. iOS和android手机都已亲测,需要的可以直接拷贝到代码中使用. js代码如下: $(function ...

  8. bootstrap中使用modal加载kindeditor时弹出层文本框不能输入的问题

    答案来自老外http://stackoverflow.com/questions/14795035/twitter-bootstrap-modal-blocks-text-input-field $( ...

  9. JS轻松实现单击文本框弹出选择日期

    我的开发工具是vs2005,你们可选择自己合适的开发工具 首先创建个文本框<input id="txFDate" name="txFDate" type= ...

随机推荐

  1. UVA-12118 Inspector's Dilemma （欧拉回路）

    题目大意:一个有v个顶点的完全图,找一条经过m条指定边的最短路径. 题目分析:当每条边仅经过一次时,路径最短.给出的边可能构成若干棵树.在一棵树中,奇点个数总为偶数,若一棵树的奇点个数为0,则这棵树可 ...

  2. 水晶报表VS2010防止出现用户登录问题

    1.联合查询,采用视图办法 2.借用如下语句 using CrystalDecisions.CrystalReports.Engine; using CrystalDecisions.Shared; ...

  3. 牛客网——F求最大值

    链接:https://www.nowcoder.net/acm/contest/29/F来源:牛客网 时间限制:C/C++ 1秒,其他语言2秒 空间限制:C/C++ 32768K,其他语言65536K ...

  4. WebLogic发布S2SH应用时提示ClassNotFoundException: org.hibernate.hql.ast.HqlToken异常

    使用Spring+hibernate如下 <properties> <!--定义方言.fetch深度.是否显示sql--> <property name="hi ...

  5. 判断一颗二叉树是否为二叉平衡树 python 代码

    输入一颗二叉树,判断这棵树是否为二叉平衡树.首先来看一下二叉平衡树的概念:它是一 棵空树或它的左右两个子树的高度差的绝对值不超过1,并且左右两个子树都是一棵平衡二叉树.因此判断一颗二叉平衡树的关键在于 ...

  6. c/c++ socket函数详解

    c/c++ socket函数详解 注意: 使用socketAPI前,要先将相关链接库(Ws2_32.lib)加入链接,并使用WSAStartUp函数初始化.每个socket函数都可能失败(返回-1), ...

  7. Python ImportError: No module named Image

    /********************************************************************************* * Python ImportEr ...

  8. HDU2870 最大窗口面积（单调队列优化）

    HDU1506 HDU2870 HDU4328 以前做的是单调队列的方法,现在试一试DP 注意的是对于i,向左延伸的L[i]到i不一定是单调的,比如1 3 2 1 2,对于i=4,L[i]=1而是2所 ...

  9. 前后端分离之让前端开发脱离接口束缚（mock）

    情景:     领导:小吴啊,最近在忙什么啊?     前吴:(心想:我擦勒,难道划水被领导发现了?也不能怪我啊,后台的哥们接口还没给呢,但要是实话实说不就对不起后台哥们了吗?)           ...

  10. 打造基于jQuery的日期选择控件

    终于把jQuery拼写正确了哈,哈哈javascript也是区分大小写的,所以确实不能写错,今天我来和大家分享的是日期选择控件的实现,功能也许不够强大,但是能够满足需求. 我之前也写过(正确的说是改过 ...