この記事は、連載「基礎からわかる Web Components 徹底解説 〜仕様から実装まで理解する〜」の第2回目になります。 カルーセルギャラリーをコンポーネント化する Web Componentsによってスコープが実現したものの、コンポーネント化する難しさは変わりません。分割しすぎればHTML ImportsによるHTTPリクエストが必然的に増加し、パフォーマンスへ懸念が残ります。コンポーネント化した要素のどの部分を変更可能にするかなどの、汎用性についても悩ましいところです。 複数の写真をコンパクトなスペースで表示するUIとして、カルーセルギャラリーはよく見かけるUIです。これを実装するには、例えばカルーセルを構築するためのJavaSciriptの処理、及びそのCSSを既存のHTMLに追加する必要があります。 カルーセルギャラリーを構成するためのjQueryのプラグインなどは多数配布さ
はじめまして。佐藤竜之介(@tricknotes)と申します。本連載では、ユニークな特徴を持つJavaScriptフレームワークであるEmber.jsの仕組みと、実践での活用方法について解説させていただきます。 なぜEmber.jsか ここ数年、ネイティブアプリケーションのような使い勝手を備えたWebサービスが増えています。筆者が利用しているサービスを例に挙げるとGmail, Pivotal Tracker, Idobataなどがあります。これらはどれも画面遷移がなく一枚の画面上であらゆる操作を行うため、「Webサイト」というよりは「アプリケーション」と表現する方が適切でしょう。このようなアプリケーションはシングルページアプリケーション(SPA)と呼ばれ、従来の画面遷移中心だったWebアプリケーションと区別されることがあります。 ただ、SPAの開発には特有の難しさがあります。それはデータ
2015年12月28日 SVG モーフィングとは、ある図形から別の図形へと自然に変形するように中間の画像を補正して映像を見せる技法です。Flashでは「シェイプトゥイーン」でモーフィングを表現していましたね(懐かしい!)。CSS3のアニメーションだと、画像の移動・回転なんかはできちゃいますが、形そのものを変形させるのは難しいです。SVGを使えば、そんなアニメーションも作成可能!さっそく挑戦してみましょう! ↑私が10年以上利用している会計ソフト! 追記(2015年12月28日):SMILはSVG次期バージョンから非推奨となるようです。 Intent to deprecate: SMIL – Google Groups SVGモーフィングを使った例 SVGモーフィングとはなんぞや?ってことで、まずは以下の作例をご覧ください。徐々に変化していく様子がおもしろいですね! リンク先ではバットマンの
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く