FRAMER.JSはスマフォサイトにも対応したプロトタイプ作成の為のフレームワークです。アニメーションを取り入れることでインタラクティブなプロトタイプを作成できる、という事を目的としているようです。使い慣れるまで少し掛かるかもしれませんが、慣れれば便利かも。 FRAMER.JS
スマフォサイトにも対応可能の、インタラクティブなプロトタイプを作成する為のツールキット・「FRAMER.JS」
FRAMER.JSはスマフォサイトにも対応したプロトタイプ作成の為のフレームワークです。アニメーションを取り入れることでインタラクティブなプロトタイプを作成できる、という事を目的としているようです。使い慣れるまで少し掛かるかもしれませんが、慣れれば便利かも。 FRAMER.JS
jQueryのanimateを高速化した「Velocity.js」:phpspot開発日誌
Velocity.js jQueryのanimateを高速化した「Velocity.js」 7kbと軽量でCSSアニメーションよりも高速に動作し、標準のanimate全ての互換性があるそうです スマホやタブレットではまだ非力なCPUも存在するので、そういった端末でもスムースにアニメーションできるかも。 関連エントリ タイピングアニメーションを作れるjQueryプラグイン「Typed.js」 CSS3アニメーションがいい感じのモーダルダイアログ実装jQueryプラグイン「Custombox」 美しいアニメーションを使ったフィルタ＆ソートが可能なjQueryプラグイン「MixItUp」 html要素をプロペラ風になめらかに回転させるjQueryプラグイン「Propeller.js」 アイテムをクールにアニメーションしつつフィルタ・ソートが出来るjQueryプラグイン「MixItUp」
tmlib.jsで簡単アニメーション - Qiita
tmlib.jsで簡単アニメーション tmlib.jsには、オブジェクトを簡単にアニメーションさせるtweener機能がついてます。 tweener 連続で指定すると、アニメーション終了後に次のアニメーションにすすみます。 tm.display.RectangleShape(100,100) .addChildTo(this) .setPosition(0, 0) .tweener.clear() .to({x: 300, y: 200, alpha: 0.5}, 1000) .to({x: 500, y: 600, alpha: 1.0}, 1000) ; // 変化させる値,アニメーションする時間(ミリ秒),イージングの順番で指定する tm.display.RectangleShape(100,100) .addChildTo(this) .setPosition(0, 0) .tim
JavaScriptの継承イディオム coffeescriptとtypescriptの比較 - mizchi's blog
coffeescriptのclass syntaxで生成されたコードと、typescriptのそれは、お互いに継承でき、互換があると言われている。 本当に互換があるのかちゃんと調べないといけないなーと常々思ってたので、確認する。 検証コード coffeescript class A f: -> console.log 'super' class B extends A f: -> super console.log 'sub' b = new B b.f() typescript class A{ f() { console.log('super'); } } class B extends A { f(){ super.f(); console.log('sub'); } } var b = new B; b.f() やってることは全く一緒 ヘッダー 継承を行うとどちらもヘッダに継承用ユ
CSS Transitionsを使った3Dロールオーバーのアイデア (2/2)
STEP 3：動きをつけてみる STEP 2で立方体が完成したので、マウスオーバーによって立方体が回転するように、動きを付けてみよう。 立方体の回転は、.cubeに対してtransform-style: preserve-3d;を指定し、子要素を3Dで描画するように設定してから、transitionプロパティでアニメーションの種類と時間を指定している。 マウスオーバー（.stage:hover .cube）のスタイルには、横方向へ回転させる場合は、Y軸を基準にするためtransform: rotateY(360deg);を指定する。縦方向へ回転させる場合は、X軸を基準にするためtransform: rotateX(-360deg);を指定する。 ■横回転のソースコード（CSS） .stage{ -webkit-perspective: 400; -ms-perspective: 400;
HTML5初心者でもWebアニメーションの簡単な作り方が分かる記事11選
HTML5初心者でもWebアニメーションの簡単な作り方が分かる記事11選：Webサイト作成手順を勉強するまとめ（3）（1/3 ページ） 新社会人のWeb制作者／デザイナー向けにAdobe Creative Cloudの使い方を例に、現場で使える具体的な制作手順とテクニックを学んでいく入門まとめ連載。今回はWebアニメーション制作に役立つEdge AnimateやFlash の使い方について。エレメント、シンボル、モーションパスの使い方から、パブリッシュ方法、レスポンシブ対応、音の付け方、Flashからの変換まで、さまざまなテクニックを紹介します。 前々回の「初心者でもPhotoshopの基本的な使い方が分かる入門記事9選」、前回の「HTML・CSS・WordPress初心者のためのDreamweaverの基本的な使い方が分かる記事10選」でWebサイトを作れるようになったら、Webサイトに
新人プログラマに知ってもらいたいメソッドを読みやすく維持するいくつかの原則 - Qiita
エンジニア組織を強くするための本を出版しました Qiitaでエンジニアリングをめぐる様々なコミュニケーションの問題とその解決策や考え方を書いてきた。それらの背後にあるエッセンスをこの度書籍として出版するに至りました。 エンジニアリング組織論への招待 ～不確実性に向き合う思考と組織のリファクタリング この書籍は、エンジニアリングを「不確実性を削減する」という第一原理で捉え直し、様々なエンジニアリングとその間のコミュニケーションをめぐる現象を説明していくものです。 あわせて読みたい 新人プログラマに知ってもらいたいメソッドを読みやすく維持するいくつかの原則 新人プログラマに知っておいてもらいたい人類がオブジェクト指向を手に入れるまでの軌跡 ペアプログラミングして気がついた新人プログラマの成長を阻害する悪習 #この記事について この記事は、新人向けの研修内容を再編集してお送りします。 この記事の
AngularJS の ngRoute でコントローラー切り替え時に値を受け渡す - Qiita
$location.path で ngRoute のルートを変更してコントローラーが切り替わるときに遷移前のコントローラーから遷移後のコントローラーに値を受け渡す方法。 遷移前を A、遷移後を B とすると、A で $location.path() を呼んだときに A の $scope で $routeChangeStart イベントを拾って遷移先のルート（イベントハンドラの第２引数）の params に値を設定し、B のコンストラクタで $routeParams から値を取り出します。 <!doctype html> <html ng-app="app"> <head> <meta charset="utf-8"> <meta name="description" content="qiita route forward value" /> <link href="//getbootst
Dockerイメージをchef-soloでプロビジョニングする | DevelopersIO
はじめに DockerでコンテナイメージをbuildするときにはDockerfileにOSイメージの指定や導入パッケージ、実行したいコマンドなどを記述してパッケージングします。 このDockerfileはほぼコマンドべた書きのような形なので難しいわけでは無いのですが、実行処理が多くなればなるほど長く読みづらくしまうし、テストも大変です。また既にChefやPuppet、Ansibleなどの構成管理ツールを用いているのであれば、既存の資産をうまく流用したほうが楽が出来ます。 ということで、Dockerfileにはほとんど仕事をさせずに、Dockerfileからchef-soloをキックしてコンテナをプロビジョニングしてみました。 やってみた ファイル構成は以下のような形です。今回はopscode謹製のbuild-essentialをレシピとして用意しました。 . ├── Dockerfile
【デザインまとめ】綺麗なデザインの管理画面 40種類
今日は管理画面のデザインを、まとめてみました。いつもより多めな40種類です。トレンドを反映してか、フラットデザインが多いですね。 通常の静的なサイトのデザインとは異なり、投稿がある場合無い場合とたくさんのパターンを考えながら制作しなければならないので、デザイン力が問われます。これらを日本語に置き換えるとまた違って見えたりするのですが、ひとまず、ご参考になればと思います。 ▼ The Kamarel デモサイト ▼ Apricot Bootstrap デモサイト ▼ The Vira デモサイト ▼ Cameo デモサイト ▼ DefOne デモサイト ▼ Pixit デモサイト ▼ AdminEx デモサイト ▼ Odin デモサイト ▼ Minimal デモサイト ▼ Delighted Flat デモサイト ▼ Tisa Premium デモサイト ▼ Adminre デモサイト ▼
Excel方眼紙をきめ細かい設定で簡単に作り印刷するには
今回からVBA／マクロの便利なTipsを解説していく。できるだけ、日常の業務に即役立ちそうな実践的なTipsの紹介をしたいと思う。その前に筆者の環境を書いておこう。Windows 8.1 Enterprize（64ビット）＋Excel 2013（以下、Excel）の環境だ。 なお本Tips連載はある程度VBA／マクロが使える方を対象にしている。Excelマクロ／VBAの初心者の方は、「Excelマクロ／VBAリファレンス用途別・キーワード別一覧超まとめ」を参照しながら本稿を読んでいただきたい。 Excel方眼紙作成マクロの仕様 初回は、きめ細かい設定でExcel方眼紙を簡単に作るためのTipsを紹介する。どのような方眼紙を作るかを設定できる入力フォームを作成し、そこで「範囲」「列幅」「行高」を指定するようにする。指定した範囲に「けい線」を引き、「けい線の色」も任意の色を選択できるようにして
[VirtualBox] ホストキーの変更 : Mac・iPhone・iPad を使い倒したい
Mac・iPhone・iPad を使い倒したい Apple 製品の Mac, iPhone, iPad などを使い倒すための使い方や Tips の紹介 VirtualBox を Mac にインストールして使用しています。 VirtualBox には「ホスト(HOST)キー」というのがあり、これを使うことで VirtualBox の画面上から ホストOS へ制御を移したり、Windows ゲストOS へ "Ctrl + Alt + Del" の送信をできるようになったりします。 しかし、Mac OS X ではデフォルトでホストキーが 左コマンドキー となっており、コピペしようとしてホストキーを押してしまい思わぬ動作となってしまう・・・ そこで！ では、ホストキーを別のキーに変えればよいな ということで、変更することにします。 VirtualBox ホストキーの変更方法 VirtualBox
![[VirtualBox] ホストキーの変更 : Mac・iPhone・iPad を使い倒したい](https://cdn-ak-scissors.b.st-hatena.com/image/square/23f9d9777e64936f0a3e68e40de389cc17a20459/height=288;version=1;width=512/https%3A%2F%2Flivedoor.blogimg.jp%2Ftaihomac%2Fimgs%2F5%2Fa%2F5a342d4d-s.png)
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Flipsblog.jp
grunt-remove-logging