タグ

関連タグで絞り込む (2)

タグの絞り込みを解除

cssとvuejsに関するwakuworksのブックマーク (3)

  • CSS Architecture on Vue.js

    Open standards for building event-driven applications in the cloud

    CSS Architecture on Vue.js
  • CSS in JS でメリットも。 window.matchMedia を使う - DeNA Design

    実装の Demo が確認できます。 ソースコードを見ると、 matchMedia メソッドの引数には、CSS のメディアクエリと同じ記述が入ります。 var mql = window.matchMedia("(max-width: 600px)"); これは、CSS in JS の環境において、 変数として再利用できるメリット があり、ブレイクポイントの記述が一元管理できます。 Vue.js で実装してみましたのでご確認ください。 <style lang="postcss" module> @value breakpoint: (max-width: 600px); .hello { background: #ccc; } @media breakpoint { .hello { background: #f00; } } </style> <template> <div :class="

    CSS in JS でメリットも。 window.matchMedia を使う - DeNA Design
  • 連番の静止画をコマ送りでアニメーションさせた話

    問題です。とあるアニメーションデータの各フレームを静止画として書き出した200枚前後のPNGファイルがあったとします。この連番の静止画を秒間30コマでアニメーションさせてください。さあ、どうしますか? この問題にたいして、自作の画像生成ツールを作って解決したというお話です。 先日の案件にて、そんなお仕事がわたしに課せられました。そのときの課題と制約は以下のような感じでした。 IE8以上のブラウザに対応すること iOSデバイスで専用の再生画面を表示することなく再生できること 閲覧時、画面内にスクロールインしたタイミングで自動再生すること 任意のタイミングで再生開始・停止できること 可能な限りファイルサイズを削減すること IE8対応が必要なので、Canvasは使えません。<video>タグはiOSで自動再生できないし、再生ボタンをタップすると画面が変わってしまうのでダメ。好きなタイミングで再生

    連番の静止画をコマ送りでアニメーションさせた話
    wakuworks
    wakuworks 2014/11/13
    パイセン素敵
  • 1