标准布局应用:显示/隐藏侧边栏 [附详细注解]
显示/隐藏
function pr()
{
var L=document.getElementById("left"); // 变量:L代表 id="left" 的标记
var R=document.getElementById("right"); // 变量:R代表 id="right" 的标记
if (L.className=="left") // 判断:如果 id="left" 的class值 等于left的话,将执行下面{}里面的内容
{
L.className="left1"; // 给 id="left" 的标记 加上class:left1
R.className=" "; // id="right" 的标记 加上class:空格,也就是消除class
}
else // 判断:如果 id="left" 的class值 不等于left的话,将执行下面{}里面的内容
{
L.className="left"; // 给 id="left" 的标记 加上class:left
R.className="right"; // 给 id="right" 的标记 加上class:right
}
}
显示/隐藏
俺是个js初学者,献丑了。这段js演示其实很简单,俺在这里只是想跟js大大们说一句:js是行为,不要跟样式表打架。有些事还是该由css来做的,例如:display:none || display:block,简直泛滥成灾了!俺只会玩玩css,拿到js不会改,不敢改,唉。明明一个class就能甩给css做的事,js为啥要抢着做呢?搞得俺们这些会点css滴菜鸟们好是郁闷~难道玩css就一定要会js么?
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
相关推荐
-
标准布局应用:显示/隐藏侧边栏 [附详细注解]
显示/隐藏 function pr() { var L=document.getElementById("left"); // 变量:L代表 id="left" 的标记 var R=document.getElementById("right"); // 变量:R代表 id="right" 的标记 if (L.className=="left") // 判断:如果 id="left" 的
-
显示/隐藏侧边栏
显示/隐藏 function pr() { var L=document.getElementById("left"); // 变量:L代表 id="left" 的标记 var R=document.getElementById("right"); // 变量:R代表 id="right" 的标记 if (L.className=="left") // 判断:如果 id="left" 的
-
Android ListView自动显示隐藏布局的实现方法
借助View的OnTouchListener接口来监听listView的滑动,通过比较与上次坐标的大小,判断滑动方向,并通过滑动方向来判断是否需显示或者隐藏对应的布局,并且带有动画效果. 1.自动显示隐藏Toolbar 首先给listView增加一个HeaderView,避免第一个Item被Toolbar遮挡. View header=new View(this); header.setLayoutParams(new AbsListView.LayoutParams( AbsListView.
-
神奇的listView实现自动显示隐藏布局Android代码
借助View的OnTouchListener接口来监听listView的滑动,通过比较与上次坐标的大小,判断滑动方向,并通过滑动方向来判断是否需显示或者隐藏对应的布局,并且带有动画效果. 1.自动显示隐藏Toolbar 首先给listView增加一个HeaderView,避免第一个Item被Toolbar遮挡. View header=new View(this); header.setLayoutParams(new AbsListView.LayoutParams( AbsListView.
-
Android实现标题显示隐藏功能
本文实例尝试模仿实现Android标题显示隐藏功能,通过给listview设置 mListView.setOnTouchListener 监听 重写ontouch方法 监听手指一动的坐标,当超过ViewConfiguration.get(this).getScaledTouchSlop(); toubar的高度 .当向上滑动超过这个高度显示touba 向下滑动隐藏. 效果图: package com.example.hidetitlebardemo; import android.animati
-
Android中实现EditText密码显示隐藏的方法
在Google发布了support:design:23+以后我们发现有这么一个东西TextInputLayout,先看下效果图: <android.support.design.widget.TextInputLayout android:id="@+id/pwdLayout" android:layout_width="match_parent" android:layout_height="wrap_content" app:passw
-
Android软键盘的显示隐藏功能实现过程
一.软键盘显示的原理 软件盘的本质是什么?软键盘其实是一个Dialog! InputMethodService为我们的输入法创建了一个Dialog,并且将该Dialog的Window的某些参数(如Gravity)进行了设置,使之能够在底部或者全屏显示.当我们点击输入框时,系统对活动主窗口进行调整,从而为输入法腾出相应的空间,然后将该Dialog显示在底部,或者全屏显示. 二.活动主窗口调整 android定义了一个属性,名字为windowSoftInputMode, 用它可以让程序可以控制活动主
-
vue实现密码显示隐藏切换功能
先给大家分享效果图: 具体实现代码如下所示: html: <group> <span>设置密码</span> <x-input :type="this.registration_data.pwdType" placeholder="请填写密码" @on-change="password"></x-input> <img :src="this.registration_da
-
vue实现密码显示隐藏功能的思路详解
效果: 思路: 利用input的type属性,当type值是text的时候展示密码,当type值是password的时候隐藏密码: 于是很容易想到用v-bind来绑定type,同时用一个布尔值来控制,写成三元表达式的形式: 加入一个图片元素,点击图标元素切换这个布尔值,就可以达到切换显示隐藏,切换布尔值的同时也切换图标. 页面布局 <div id='app'> <!--三元表达式 pwdFlag为真则type是password密码隐藏 pwdFlag为假则type是text密码显示 --
-
JavaScript实现星座查询功能 附详细代码
目录 一.题目 二.代码 三.结果 四.总结 一.题目 在文本框中输入一个生日值,点击按钮,可以显示此生日的对应星座.定义一个函数,该函数用来接收一个生日值(月日组成的4位字符串,比如"0210","1225"等),并根据该生日值提示属于的星座. 二.代码 <!doctype html> <html> <head> <meta charset="utf-8"> <title>星座查询&l
随机推荐
- 获取Gridview中ButtonField的text属性
- 微信小程序 动态绑定数据及动态事件处理
- windows下配置php5.5开发环境及开发扩展
- Zend Framework基本页面布局分析
- ASP程序中使用断开的数据记录集的代码
- C与C++ 无参函数的区别解析
- 深入理解js中this的用法
- iOS开发的UI制作中动态和静态单元格的基本使用教程
- PHP 事务处理数据实现代码
- Bootstrap中glyphicons-halflings-regular.woff字体报404错notfound的解决方法
- js 自制滚动条的小例子
- Python使用scrapy抓取网站sitemap信息的方法
- Android访问php取回json数据实例
- sqlserver四舍五入使用round函数及cast和convert函数
- jquery调取json数据实现省市级联的方法
- JQuery获取鼠标进入和离开容器的方向
- Javascript动态伸缩+淡出淡入
- JAVA中读取文件(二进制,字符)内容的几种方法总结
- 利用C语言实现2048小游戏的方法
- 读写XML文件的内容并将其显示在ListView控件上的方法