gt-r-blazeのブックマーク / 2019年2月13日

gt-r-blaze id:gt-r-blaze

2019年2月13日のブックマーク (5件)

touch, click, pointerの実装 | 前編タッチイベントとマウスイベント
touch, click, pointerの実装前編タッチイベントとマウスイベントこのシリーズでは、タッチ／マウスイベント系の実装を考えます。第1回目はタッチイベントとはなにか、また、タッチイベントとマウスイベントの判別について解説します。はじめに iPhone、Androidが登場したのはもう何年も前ですが、さらにWindows8も登場し、いろいろと状況が変化してきました。Windows8を搭載したPCの多くはタブレットデバイスのように、画面に触れることができるようになっています。しかしながら、これらのデバイスはマウスを使っても操作できるようにもなっています。今後、どのようにタッチ／マウスのイベントを扱っていけばよいのかは、これからのウェブ開発において、より重要になっていくはずです。そこでこのシリーズでは、タッチ／マウスイベント系のブラウザへの実装を整理し、それらのブラウザに
gt-r-blaze 2019/02/13
タッチイベント

JS
リンク
どれがいい？全部無料でブラウザーだけで使えるSVG編集ツール6選
いまやモバイルアプリのデザインでもWebデザインでも、欠かせなくなったSVG画像。ブラウザー上でサクッと編集できる、SVGエディターを紹介します。 SVG画像の普及率は、PNGやJPGといった人気ビットマップフォーマットに比べれば低いかもしれません。しかし、そのメリットから、プロジェクトにSVGの導入を検討するデザイナーが増加してきています。いままでは、IllustratorやInkscapeといったデスクトップアプリケーションが普通でしたが、2017年となった現在では、Webブラウザー上でもベクターデザインができます。そこで、無料のWebベースのSVGエディターを探している人のために、6つのおすすめエディターを紹介します。 1. Vectr VectrはビギナーにもSVGのベテランユーザーにもとてもおすすめです。インターフェイスが簡潔で、使いもしないような大量のツールに圧倒されてしまう
gt-r-blaze 2019/02/13
SVG
リンク
グリグリ動く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
gt-r-blaze 2019/02/13
リサイズUIなど

Vue.js
リンク
Reactで管理画面をつくるときに便利だったライブラリ集と所感 - Qiita
主に未来の自分用 material-ui Material DesignをReactでコンポーネント化したもの UIパーツになっているのでパパっと使えるし、あとでカスタマイズするときもけっこう融通が効く現在1.0.0がbetaでアップデートが激しく破壊的変更も多いので、場面に合わせてStableとどちらを採用するか決めるのがよい。 v1がStableになった react-admin REST API（やGraphQL）を叩くクライアントとして最適化された感じの管理画面コンポーネント集インデックスがあって、閲覧ページがあって、登録ページがあって、みたいなよくある画面が素早くつくれる Material UIを内部で使っていて、さらに管理画面用に高レベルなコンポーネント（テーブルとか新規作成フォームとか）が実装されているカスタマイズ性もまぁまぁ高い。CRUDではないエンドポイントでも拡張可
gt-r-blaze 2019/02/13
リサイズUI

React
リンク
Resizable | jQuery UI 1.10 日本語リファレンス | js STUDIO
jQuery UI Resizableプラグインは選択している要素をリサイズ可能な要素にします。最大最小の幅や高さなど、様々な指定を行うことが出来ます。 (リサイズのドラッグをするためのつまみを持つようになります) このウィジットはいくつかの機能的なCSSを必要とします。このCSSが読み込めないと機能しないため、最初に必要とするCSSを読み込むようにしてください。型：Selector or jQuery or Element 初期値：false リサイズしている要素と同期して同じようにリサイズさせたい要素を指定します。 $( ".selector" ).resizable({ alsoResize: "#mirror" }); // getter var alsoResize = $( ".selector" ).resizable( "option", "alsoResize" )
gt-r-blaze 2019/02/13
リサイズUI

jQuery
リンク
- 2019年2月14日
- 2019年2月13日
- 2019年2月12日