input固定在底部
// 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固定在底部的更多相关文章
- 移动端ios 输入框fixed固定在底部 焦点时乱跳加遮盖问题的解决 转自zhangyunling 加个人项目解决方案
如果您有过移动端的开发经验,那么您是否碰到过这样的问题,一个页面有输入框,当这个输入框聚焦时,输入框在IOS下,被移动到手机屏幕的当中去了,而在Android端,有些浏览器的输入框,会被键盘盖住. 1 ...
- 解决 scroll() position:fixed 抖动、导航菜单固定头部(底部)跟随屏幕滚动
一.导航栏或者页脚正常情况下固定在页面的相应位置,当页面滚动后,导航栏或者页脚固定在页面的顶部或者底部的情景 一般就是将该块的代码样式的position设置为fixed.固定在顶部的话,将top设置为 ...
- CSS布局:让页底内容永远固定在底部
我们在设计一些页面内容甚少的网页时(典型应用就是登陆页面),由于显示器的分辨率大,在正常情况下,假如页面内容高度小于浏览器高度时,页面底部以下会留下很大的空间... 先看示例:http://www.h ...
- 内容高度小于窗口高度时版权div固定在底部
<!doctype html><html><head><meta charset="utf-8"><title>文档内容 ...
- [Android] Android 让UI控件固定于底部的几种方法
Android 让UI控件固定于底部的几种方法1.采用linearlayout布局:android:layout_height="0dp" <!-- 这里不能设置fill_p ...
- HTML5+CSS把footer固定在底部
在刚开始给网页写footer的时候,我们会碰到一个让人烦躁的问题:当页面内容太少时,footer显示在了页面中间,这是我们不希望出现的,我们希望它能够永远呆在底部,不管网页的内容是多还是少.下面的代码 ...
- Android 底部菜单固定到底部
今天搞了很久的一个问题,导航菜单没有固定到底部,因为上面是ListView,可是没内容,于是就浮动上去了. 效果如下: 这里采用的是一个碎片,代码是: <LinearLayout xmlns:a ...
- css样式控制元素固定在底部
回复固定在底部:css样式用到了 box-sizing属性 box-sizing:border-box; -moz-box-sizing:border-box; /* Firefox */ -webk ...
- 解决input获取焦点时底部菜单被顶上来问题
<div class="search-box"> <input class="search-input" type="text&qu ...
随机推荐
- 弹性布局flex-兼容问题
这里弹性布局的用法就不说了 用过的都知道很方便 虽然现在弹性布局已经实现标准了 但是还是存在一些兼容问题 旧版本 (一些低版本的浏览器) display:-webkit-box; 新版本(目前的标准版 ...
- Linux学习笔记(2)-开机
今天开始学习Linux系统. 打开虚拟机,输入密码后,令人激动的画面就蹦出来了-- Ubuntu的主要基调是橙色,给人一种蠢萌蠢萌的感觉,和Windows不同,它只在左边有一条任务栏,上面有些东西,搜 ...
- linq in not in
class A { public int B { get; set; } public string C { get; set; } } class Program { static void Mai ...
- RabbitMQ 实例
转载地址:http://www.cnblogs.com/yangecnu/p/4227535.html .NET 环境中使用RabbitMQ 在企业应用系统领域,会面对不同系统之间的通信.集成与整 ...
- HLG1116-选美大赛
Description 一年一度的哈理工选美大赛开始了.来自各个院系的N个美女们都在一起排成一排,然后从左到右给他们标号(1-N),评委叫兽开始观摩,由于身高高低都不同, 叫兽想从中选出尽可能多的人使 ...
- 在list_*页面显示出一级栏目下的所有二级栏目
<ul class="nav nav-pills nav-stacked"> {dede:channelartlist typeid='1,1'} <div cl ...
- ADT Ubuntu X64 下ia32-libs替换等【待编辑】
sudo apt-get install ia32-libs apt-get install libglib2.0-0:i386 libpng12-0:i386 libsm6:i386 libxren ...
- *HDU3635 并查集
Dragon Balls Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Tota ...
- 设计模式之六大原则——接口隔离原则(ISP)
设计模式之六大原则——接口隔离原则(ISP) 转载于:http://www.cnblogs.com/muzongyan/archive/2010/08/04/1792528.html 接口隔离原则 ...
- React Native 中 CSS 的使用
首先声明,此文原作者为黎 跃春 React Native中CSS 内联样式 对象样式 使用Stylesheet.Create 样式拼接 导出样式对象 下面的代码是index.ios.js中的代码: / ...