Skip to content

Instantly share code, notes, and snippets.

View tsmd's full-sized avatar

Shimada Takayuki tsmd

36 followers · 34 following
View GitHub Profile
@tsmd
tsmd / smooth-scroll.css
Last active October 27, 2018 08:34
FLIP implementation of smooth scrolling https://aerotwist.com/blog/flip-your-animations/
.smooth-scroll {
transition: transform .5s ease-out;
}
@tsmd
tsmd / responsive-table.js
Created March 28, 2018 13:19
Basic idea of simple responsive-table
$.fn.responsiveTable = (function() {
var $window = $(window);
return function() {
var $el = this;
var $table = this.find('>table');
var onResize = function() {
var width = $table.outerWidth();
var height = $table.outerHeight();
var $parent = $el.parent();
var containerWidth = $parent.width();
@tsmd
tsmd / measure-scroll-bar-width.js
Last active November 20, 2018 08:10
let scrollbarWidth;
export default function measureScrollBarWidth(opts = {}) {
const { force = false } = opts;
if (force || typeof scrollbarWidth === "undefined") {
const div = document.createElement("div");
div.style.position = "absolute";
div.style.overflowY = "scroll";
div.style.width = div.style.height = "100px";
@tsmd
tsmd / is-standalone.js
Created March 28, 2018 08:49
Detect if the app is executed from the home screen
function isStandalone () {
if ('standalone' in window.navigator) {
return window.navigator.standalone
} else {
return window.matchMedia('(display-mode: standalone)').matches
}
}
@tsmd
tsmd / is-pinch-zooming.js
Last active February 28, 2020 03:18
Detect pinch zooming
function isPinchZooming () {
const clientWidth = document.documentElement.clientWidth
const viewportWidth = window.visualViewport ? window.visualViewport.width : window.innerWidth
return clientWidth > viewportWidth
}
@tsmd
tsmd / emoji.css
Created September 20, 2016 16:36
@font-face {
font-family: Emoji;
src: local('Hiragino Kaku Gothic ProN'),
local(Meiryo);
}
@font-face {
font-family: Emoji;
src: local('Segoe UI Emoji'),
local('Segoe UI Symbol'),
@tsmd
tsmd / hiragana_random.js
Created April 3, 2016 03:23
function hiragana_random(size) {
var str = '';
while (size--) {
str += String.fromCharCode(12353 + Math.floor(Math.random() * 82));
}
return str;
}
@tsmd
tsmd / array_base64.js
Last active December 18, 2015 06:10
非負の数値の配列とBase64を相互変換
function fromIntArray(array) {
var str = '';
var octet = new Uint8Array(new Uint32Array(array).buffer);
for (var i = 0; i < octet.length; i++) {
str += String.fromCharCode(octet[i]);
}
return btoa(str);
}
function toIntArray(ascii) {
@tsmd
tsmd / comment.scss
Last active December 30, 2015 11:09
コメント内見出しやテキストの記法。見栄えが悪くないこと。見た目で見出しレベルが判別できること。CSSとSCSSの記法の相互変換が可能で見栄えがあまり変わらないこと。横幅はインデントを考慮し60文字。H4の場合はその1/1.6くらいの長さ。コメント内でMarkdown記法を強いるStyledoccoみたいなやつは考慮していない。好きじゃないので。 2014-01-09 追記：ブロックコメントのなかの行頭に // があると、Sassがコメントを出力しない模様。2014-05-12 追記：Sass 3.3で修正された模様。
h1 {}
/* ======================================================
//
// ほげほげほげ
// ふがふがふが
//
// ====================================================== */
// ======================================================
@tsmd
tsmd / twitter-text-tweetlength.js
Last active September 23, 2016 14:15
2016-09-23 リポジトリにしました。 https://github.com/tsmd/twitter-text-tweetlength-js
// 2016-09-23 リポジトリにしました。
// https://github.com/tsmd/twitter-text-tweetlength-js