matori

"use strict"

normalize = ->

    nomalizedEvents = ["start", "move", "end", "cancel"]
    touchEvents = ["touchstart", "touchmove", "touchend", "touchcancel"]
    MSPointerEvents = ["MSPointerDown", "MSPointerMove", "MSPointerUp", "MSPointerCancel"]
    pointerEvents = ["pointerdown", "pointermove", "pointerup", "pointercancel"]
    mouseEvents = ["mousedown", "mousemove", "mouseup", null]

matori

@charset "UTF-8";

$state-chain-mixin-pseudo-syntax-legacy: false !default;

@mixin state-chain($state-change-target, $state) {
    $selector: selector-append($state-change-target, ".st-#{$state}");
    $self: false;

    $state-chain-before-pseudo: "::before";
    $state-chain-after-pseudo: "::after";

matori

mixin sprite(name, title, titleId, desc)

    - var svgAttrObj = {};
    - var titleAttrObj = {};

    if titleId
        - svgAttrObj['aria-labelledby'] = titleId;
        - titleAttrObj['id'] = titleId;

    svg&attributes(svgAttrObj)&attributes(attributes)

matori

'use strict'

el = document.createElement 'div'
detectionTargets =
    transitionend:
        'WebkitTransition': 'webkitTransitionEnd'
        'transition': 'transitionend'
    animationend:
        'WebkitAnimation': 'webkitAnimationEnd'
        'animation': 'animationend'

matori

'use strict'

# http://stackoverflow.com/a/7557433
# https://gist.github.com/anonymous/f09b5cd487b5ad55c46e
module.exports = (element, partial = false, position = 0.85)->
    rect = element.getBoundingClientRect()
    windowHeight = window.innerHeight or document.documentElement.clientHeight
    windowWidth = window.innerWidth or document.documentElement.clientWidth
    unless partial
        rect.top >= 0 and

matori

// @link http://stackoverflow.com/a/5298684
var hashString = location.hash.substr(1); // remove '#'
history.replaceState('', document.title, window.location.pathname);

matori

プリンより滑らか スムーズなアニメーションの作り方 HTML5 Conference 2015 1.25

スピーカー

Brian Birtles - Working on Web Animations and Firefox at Mozilla Japan https://twitter.com/brianskold

はじめに

• 滑らかといえばプリン

matori

// ----
// Sass (v3.4.9)
// Compass (v1.0.1)
// ----

@function selector-to-string($selector: "") {
  @if $selector == "" {
    $selector: &;
  }
  $selector-length: str-length(#{$selector});

matori

@charset "UTF-8";

/// `$use-before` は `$collapse-margin` が `false` の場合のみ意味を持つ。引数なし（初期値）だと micro clearfix が生成される。
/// @group util
/// @param {Bool} $collapse-margin (false) - マージンの相殺を許可するかどうか
/// @param {Bool} $use-before (true) - `:before` 擬似要素を出力するかどうか
/// @link http://nicolasgallagher.com/micro-clearfix-hack/ A new micro clearfix hack – Nicolas Gallagher
/// @link http://kojika17.com/2013/06/clearfix-2013.html floatを解除する手法のclearfix と 次世代のレイアウトの話｜Web Design KOJIKA17
@mixin clearfix($collapse-margin: false, $use-before: true) {

matori

mixin meta(name, content)
    if name.match(/content-(encoding|length|language|type|style-type|script-type)|default-style|refresh|set-cookie|pragma|cache-control|expires|allow|date|last-modified|location|www-authenticate|x-ua-compatible|x-dns-prefetch-control/i)
        meta(http-equiv="#{name}", content="#{content}")
    else
        meta(name="#{name}", content="#{content}")