// input固定在底部
//isFocusing获取焦点:true 失去焦点:false
_onTouchInput(isFocusing){
this.phone_width = screen.width;
let Boxbottom = this.refs['InputBoxBottom'];
let bottom_top = this.refs['bottom_top'];
if(Boxbottom) {
if (isFocusing) {
Boxbottom.style.position = 'static';
Boxbottom.style.width = (this.phone_width - 20) + 'px';
Boxbottom.style.bottom = 0;
bottom_top.style.paddingBottom = 0; } else {
Boxbottom.style.position = 'fixed';
bottom_top.style.paddingBottom = 64 + 'px';
Boxbottom.style.width = (this.phone_width - 20) + 'px';
}
}
}

input固定在底部的更多相关文章

  1. 移动端ios 输入框fixed固定在底部 焦点时乱跳加遮盖问题的解决 转自zhangyunling 加个人项目解决方案

    如果您有过移动端的开发经验,那么您是否碰到过这样的问题,一个页面有输入框,当这个输入框聚焦时,输入框在IOS下,被移动到手机屏幕的当中去了,而在Android端,有些浏览器的输入框,会被键盘盖住. 1 ...

  2. 解决 scroll() position:fixed 抖动、导航菜单固定头部(底部)跟随屏幕滚动

    一.导航栏或者页脚正常情况下固定在页面的相应位置,当页面滚动后,导航栏或者页脚固定在页面的顶部或者底部的情景 一般就是将该块的代码样式的position设置为fixed.固定在顶部的话,将top设置为 ...

  3. CSS布局:让页底内容永远固定在底部

    我们在设计一些页面内容甚少的网页时(典型应用就是登陆页面),由于显示器的分辨率大,在正常情况下,假如页面内容高度小于浏览器高度时,页面底部以下会留下很大的空间... 先看示例:http://www.h ...

  4. 内容高度小于窗口高度时版权div固定在底部

    <!doctype html><html><head><meta charset="utf-8"><title>文档内容 ...

  5. [Android] Android 让UI控件固定于底部的几种方法

    Android 让UI控件固定于底部的几种方法1.采用linearlayout布局:android:layout_height="0dp" <!-- 这里不能设置fill_p ...

  6. HTML5+CSS把footer固定在底部

    在刚开始给网页写footer的时候,我们会碰到一个让人烦躁的问题:当页面内容太少时,footer显示在了页面中间,这是我们不希望出现的,我们希望它能够永远呆在底部,不管网页的内容是多还是少.下面的代码 ...

  7. Android 底部菜单固定到底部

    今天搞了很久的一个问题,导航菜单没有固定到底部,因为上面是ListView,可是没内容,于是就浮动上去了. 效果如下: 这里采用的是一个碎片,代码是: <LinearLayout xmlns:a ...

  8. css样式控制元素固定在底部

    回复固定在底部:css样式用到了 box-sizing属性 box-sizing:border-box; -moz-box-sizing:border-box; /* Firefox */ -webk ...

  9. 解决input获取焦点时底部菜单被顶上来问题

    <div class="search-box"> <input class="search-input" type="text&qu ...

随机推荐

  1. 使用Flexible实现手淘H5页面的终端适配

    拿到设计师给的设计图之后,剩下的事情是前端开发人员的事了.而手淘经过多年的摸索和实战,总结了一套移动端适配的方案--flexible方案. 这种方案具体在实际开发中如何使用,暂时先卖个关子,在继续详细 ...

  2. linux shell 常用指令

    1. man 对你熟悉或不熟悉的命令提供帮助解释 eg:man ls 就可以查看ls相关的用法 注:按q键或者ctrl+c退出,在linux下可以使用ctrl+c终止当前程序运行. 2. ls 查看目 ...

  3. 分布式缓存技术memcached学习(五)—— memcached java客户端的使用

    Memcached的客户端简介 我们已经知道,memcached是一套分布式的缓存系统,memcached的服务端只是缓存数据的地方,并不能实现分布式,而memcached的客户端才是实现分布式的地方 ...

  4. block fomating context

    http://www.w3help.org/zh-cn/kb/010/ 它与普通的块框类似,不同之处在于: 1可以包含浮动元素 2可以阻止外边距折叠 3可以防止元素被浮动元素覆盖 placeholde ...

  5. 常见的几个Python面试题

    str = "abcdaab" #字符串反转 print str[::-1] #统计str字符串中出现'a'的次数 print str.count('a') #pyhon可以用+作 ...

  6. HDU5900 QSC and Master(区间DP + 最小费用最大流)

    题目 Source http://acm.hdu.edu.cn/showproblem.php?pid=5900 Description Every school has some legends, ...

  7. 网站开发常用cmd命令

    一.Windows服务安装: framework 4.0 : cd C:\Windows\Microsoft.NET\Framework\v4.0.30319 framework 2.0 :  cd ...

  8. 随鼠标轮动翻动层————jquery小练习

    闲来无事在网站上看见一个网页制作的不错,就仿照做来看看.特此记录下来. 亮点:随鼠标上下滚动,展示页面随之不同,翻动效果. 功能点:鼠标向上,向下判断事件. css 代码 html { overflo ...

  9. MySQL黑科技用法总结(持续更新)

    1.利用set插入数值 insert [into] 表名 set 列=值.  2.利用select对字段进行测试 ) ,并且有2条记录 ',num1+1的计算结果 tips:相等返回1,否则返回0 f ...

  10. 如何获取hibernate代理类代理的实际对象实例?

    在hibernate中,通过sql语句查询带clob字段的记录,查出来的结果集是List<HashMap<String,Object>>类型,在调用jackson的接口转为js ...