inline

inline

ios&android弹数字键盘

<input type="number" name='hello' pattern="[0-9]*">

获取cookie

var wechat = (wechat = (' ' + document.cookie).match(/[; ]?wechat=([^;]*)/)) && wechat[1];

设置cookie(设置50分钟超时)

document.cookie = 'key=value; domain=.abc.com; path=/; expires=' + (new Date(Date.now() + 60 * 1000 * 50)).toUTCString();

删除cookie

document.cookie = 'key=; domain=.abc.com; path=/; expires=' + (new Date(0)).toUTCString();

获取url路径中的值

var key = (key = location.pathname.match(/\/path\/([^\/]*)$/)) && key[1]

获取url参数中的值

var key = (key = location.search.match(/key=([^&=]*)/)) && key[1];

调试动态js

//@ sourceURL=dynamicScript.js

上下移动元素

1
2
3
4
5
6

window.moveUp = function() {
  this.parentNode.insertBefore(this, this.previousElementSibling || this);
}
window.moveDown = function() {
  this.parentNode.insertBefore(this, this.nextElementSibling && this.nextElementSibling.nextElementSibling || null);
}

滚动条

::-webkit-scrollbar {
  width: 2px;
}

/* Track */
::-webkit-scrollbar-track {
  border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: rgba(188, 188, 188, 1);
}

多行文本超出省略

p {
  line-height: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 4; // 文本显示行数
  display: -webkit-box;
  -webkit-box-orient: vertical;
  white-space: pre-wrap;
}

元素是否在当前可见范围

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

  function elementInViewport(el) {
    var rect = el.getBoundingClientRect()

    // For invisible element.
    if (rect.top + rect.bottom + rect.left + rect.right + rect.height + rect.width === 0) {
      return false;
    }

    return (
       rect.top   >= 0
    // Pre load.
    && rect.top   <= ((window.innerHeight || document.documentElement.clientHeight) + 100)
    && rect.left  >= 0
    // Hide carousel except first image. Do not add equal sign.
    && rect.left  < (window.innerWidth || document.documentElement.clientWidth)
    )
  }