1. if (!Element.prototype.scrollIntoViewIfNeeded) {
  2. Element.prototype.scrollIntoViewIfNeeded = function (centerIfNeeded) {
  3. function withinBounds(value, min, max, extent) {
  4. if (false === centerIfNeeded || max <= value + extent && value <= min + extent) {
  5. return Math.min(max, Math.max(min, value));
  6. } else {
  7. return (min + max) / 2;
  8. }
  9. }
  10.  
  11. function makeArea(left, top, width, height) {
  12. return { "left": left, "top": top, "width": width, "height": height
  13. , "right": left + width, "bottom": top + height
  14. , "translate":
  15. function (x, y) {
  16. return makeArea(x + left, y + top, width, height);
  17. }
  18. , "relativeFromTo":
  19. function (lhs, rhs) {
  20. var newLeft = left, newTop = top;
  21. lhs = lhs.offsetParent;
  22. rhs = rhs.offsetParent;
  23. if (lhs === rhs) {
  24. return area;
  25. }
  26. for (; lhs; lhs = lhs.offsetParent) {
  27. newLeft += lhs.offsetLeft + lhs.clientLeft;
  28. newTop += lhs.offsetTop + lhs.clientTop;
  29. }
  30. for (; rhs; rhs = rhs.offsetParent) {
  31. newLeft -= rhs.offsetLeft + rhs.clientLeft;
  32. newTop -= rhs.offsetTop + rhs.clientTop;
  33. }
  34. return makeArea(newLeft, newTop, width, height);
  35. }
  36. };
  37. }
  38.  
  39. var parent, elem = this, area = makeArea(
  40. this.offsetLeft, this.offsetTop,
  41. this.offsetWidth, this.offsetHeight);
  42. while ((parent = elem.parentNode) instanceof HTMLElement) {
  43. var clientLeft = parent.offsetLeft + parent.clientLeft;
  44. var clientTop = parent.offsetTop + parent.clientTop;
  45.  
  46. // Make area relative to parent's client area.
  47. area = area.
  48. relativeFromTo(elem, parent).
  49. translate(-clientLeft, -clientTop);
  50.  
  51. parent.scrollLeft = withinBounds(
  52. parent.scrollLeft,
  53. area.right - parent.clientWidth, area.left,
  54. parent.clientWidth);
  55.  
  56. parent.scrollTop = withinBounds(
  57. parent.scrollTop,
  58. area.bottom - parent.clientHeight, area.top,
  59. parent.clientHeight);
  60.  
  61. // Determine actual scroll amount by reading back scroll properties.
  62. area = area.translate(clientLeft - parent.scrollLeft,
  63. clientTop - parent.scrollTop);
  64. elem = parent;
  65. }
  66. };
  67. }

  

input 虚拟键盘的更多相关文章

  1. 关于iphone点击readonly的input虚拟键盘不消失的情况

    今天遇到了一个比较棘手的问题,事情是这样的: 咱有一个添加地址的页面,大概长这样: 收货地址后那个"请选择收货地址"是一个readonly的input, 咱一进页面,直接点击这个& ...

  2. 移动端ios针对input虚拟键盘挡住的问题

    写移动端的时候发现input的虚拟键盘对Ios的手机不是很友好 我的是苹果6 点击的时候经常会挡住input框 针对这个问题找了很多发现都没效果 最后发现用下面这段js就可以解决了 $("i ...

  3. 移动H5页面,Android手机下,input获取焦点弹出系统虚拟键盘时,挡住input解决方法

    最近在写移动端页面的时候,遇到一个问题,在Android手机下,虚拟键盘会将input框遮挡住,具体情况如下图所示: 正常页面显示  IOS端显示情况 Android端显示情况 解决方式: <t ...

  4. 移动端H5页面 input 获取焦点时,虚拟键盘挡住input输入框解决方法

    在移动端h5开发的时候,发现如果input在页面底部,当触发input焦点的时候会弹出系统虚拟键盘,虚拟键盘会遮挡input输入框.这会很影响用户体验,于是在网上找到了如下的解决办法: 方法一:使用w ...

  5. 移动端H5页面_input获取焦点时,虚拟键盘挡住input输入框解决方法

    在移动端h5开发的时候,发现如果input在页面底部,当触发input焦点的时候会弹出系统虚拟键盘,虚拟键盘会遮挡input输入框.这会很影响用户体验,于是在网上找到了如下的解决办法: 方法一:使用w ...

  6. Android开发案例 - 自定义虚拟键盘

    所有包含IM功能的App(如微信, 微博, QQ, 支付宝等)都提供了Emoji表情之类的虚拟键盘,  如下图:    本文只着重介绍如何实现输入法键盘和自定义虚拟键盘的流畅切换, 而不介绍如何实现虚 ...

  7. 039. asp.netWeb用户控件之七实现具有虚拟键盘的功能的用户控件

    用户控件ascx代码: <%@ Control Language="C#" AutoEventWireup="true" CodeFile="K ...

  8. JS虚拟键盘

    由于是触摸屏,所以需要一款JS虚拟键盘.上网找了一个好用的VirtualKeyboard,作了修改. 修改该插件参考的博客文章:http://www.cnblogs.com/xinggong/arch ...

  9. 【小贴士】虚拟键盘与fixed带给移动端的痛!

    前言 今天来公司的主要目的就是研究虚拟键盘与fixed的问题,期间因为同事问起闭包与事件委托(阻止冒泡)相关问题,便穿插了一篇别的: [小贴士]工作中的”闭包“与事件委托的”阻止冒泡“,有兴趣的朋友可 ...

随机推荐

  1. xc_domain_save.c

    /****************************************************************************** * xc_linux_save.c * ...

  2. kotlin 遇到的问题

    转载请表明 https://i.cnblogs.com/EditPosts.aspx?opt=1 从5月18号goole正式公布用kotlin做为android的新语言,做为android也很庆幸可以 ...

  3. C语言基础之水仙花数

    题目:打印出所有的“水仙花数”,所谓“水仙花数”是指一个三位数,其各位数字立方和等于该数本身. 例如:153是一个“水仙花数”,因为153=1的三次方+5的三次方+3的三次方. 程序分析:利用for循 ...

  4. android高仿微信UI点击头像显示大图片效果, Android 使用ContentProvider扫描手机中的图片,仿微信显示本地图片效果

    http://www.cnblogs.com/Jaylong/archive/2012/09/27/androidUI.html http://blog.csdn.net/xiaanming/arti ...

  5. 安装dede UTF_8时报出了一个致命错误和警告,最后不能显示网站后台和首页了

    安装dede UTF_8时报出了一个致命错误和警告,最后不能显示网站后台和首页了.报错如下: 登陆首页显示:Fatal error: Call to undefined function ParCv( ...

  6. git--简单操作

    Git简介 一.      安装 下载地址: https://git-scm.com/downloads: https://pan.baidu.com/s/1kU5OCOB#list/path=%2F ...

  7. Windows7 x64系统下安装Nodejs并在WebStorm下搭建编译less环境

    1. 打开Nodejs官网http://www.nodejs.org/,点“DOWNLOADS”,点64-bit下载“node-v0.10.33-x64.msi”. 2. 下载好后,双击“node-v ...

  8. ubuntu squid 代理服务器安装配置

    安装: 下载安装包 http://pan.baidu.com/s/1mitvwpE 解压 tar -xzvf file.tar.gz 编译: 进入sbin目录  执行 ./configure --pr ...

  9. Android Handler 的使用

    Android UI 操作是线程不安全的.我们只能在UI线程或者说主线程中修改UI.试想多个Thread操作同一个UI,可能引起不一致.UI 线程的主要工作是:UI界面更新显示,各个控件的交互等等.一 ...

  10. However, a general purpose protocol or its implementation sometimes does not scale very well.

    https://netty.io/wiki/user-guide-for-4.x.html The Problem Nowadays we use general purpose applicatio ...