グリグリ動くUIをVueとSVGでサクッと書く - No Regrets in Bathing
これは Vue.js #3 Advent Calendar 2017 – Qiita 4日目の記事です。 こんにちは。SVGで色々なコンポーネントを作っているものです。最近の作品は下記のような感じです。 Webでグリグリ動くUIを作りたい！！という一心でやっています。 これらはほとんどSVGとVueの組み合わせのみで作っています。依存が少ないというのは大事で、ライブラリ間の相性でハマったり、いろんなドキュメント間を往復することがなくなります。 Webでグリグリ動くUIを作るのは基本的にめんどくさいです。jQuery pluginを駆使して作るのも闇が多いですし、divやcanvasをゴリゴリするのも結構手間がかかります。 ですが、最近はSVGで高度なUI実装されることが増えてきた気がします。特に自分が衝撃を受けたのは、CacooがFlashからSVGにスイッチしたことです。 nulab-i
最近のWebページで使用されている『さまざまな魅せ方』を実装するCSSやJavaScriptの最新チュートリアルのまとめ
最近のWebサイトやブログで見かけるアニメーションを使ったさまざまなかっこいいエフェクトやコンテンツの見せ方を実装するCSSやJavaScriptのチュートリアルをCodyHouseから紹介します。 それぞれファイルを一式でダウンロードできるので、すぐに利用できます。 Fixed Background Effect デモページ 対応ブラウザ：Chrome, Safari, Firefox, Opera, IE9+ sectionやdivを垂直に配置した縦長ページで、背景を固定し、各コンテンツがカーテンを引き上げるようにスクロールするシンプルなテンプレート。
意外と実用的。Webブラウザで指先を使ってページ送り·Webcam Swiper MOONGIFT
Webcam SwiperはWebブラウザ上でWebカムの映像を解析し、ページ送りを行うライブラリです。 HTML5のgetUserMediaが一般化してきたことで、Webブラウザ上でWebカムを使って楽しむソフトウェアが増えてきました。今回紹介するWebcam Swiperもその一つ、マウスに触れずにページ送りを実現するソフトウェアです。 最初のアクセス時にWebカムへのアクセスが求められます。 許可すると通知が出ました。 分かりづらいですがデモです。マウスは動かしていません。 実際の認識率から言うとそれほど高くなかったりします。誤動作してしまうケースもありました。しかしWebブラウザだけで指を動かしてページ送りができてしまうというのは新しい体験で非常に面白いです。 Webcam SwiperはHTML5/JavaScript製、MIT Licenseのオープンソース・ソフトウェアです。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
