TwicPics Placeholdersはレスポンシブ対応の動的なダミー画像を提供するWebサービスです。 上サンプルはリサイズ出来るようになっています。ただ、ダミー画像のサイズ変更にタイムラグがある場合があります。 使い方も非常にシンプルでユーザー登録も不要、無料で誰でも利用可能です。 使い方<script src="https://i.twic.pics/?v1" async></script>まず上記のスクリプトを読み込みます。 <img class="twic" data-src="placeholder:auto">そして、imgタグにtwicという名のclassとカスタムデータ属性を持たせたダミー画像を用意します。これだけで、包括要素やモニタのサイズに応じて可変するダミー画像を用意する事が出来ます。 前述通り、APIの為にユーザー登録をする等の必要もなく、誰でも無料で利用する
touch-actionでスクロールやズームを止める（知名度が低いウェブ標準ひとりAdvent Calendar 2021 – 12日目） | Ginpen.com
知名度が低いウェブ標準ひとり Advent Calendar 2021 – 12 日目 今日は CSS の touch-action プロパティです。指操作の制御をします。 touch-action – CSS: カスケーディングスタイルシート | MDN デモ：https://codepen.io/ginpei/pen/gOGLrgG デモはタッチ対応端末でご覧ください。主にスマホ。 基本的な使い方 だいたいこんな値です。 auto – 通常 none – 反応しない pan-y – 縦方向スクロールのみ pinch-zoom – ズームのみ manipulation – スクロールとズームのみ（ダブルタップでの拡大を無効化） 他に下方向のみの pan-down とかいくつかあるので MDN をご覧ください。 Pointer Events 関係の仕様です。IE でも動きます。 使いどころ
民間企業での経験から見ると学校の現状には違和感を覚えた そんな峯岸氏は、異色のキャリアを持つ教師だ。大学卒業後、IT大手の富士通に入社し総合職の営業として活躍。在職中に通信制大学に編入してオンライン授業で学び、土日・長期休暇にはスクーリングに通って教員免許状を取得し、2008年に公立学校の教師となった。就職氷河期ほどではないものの競争率は全体で6.5倍と高かった頃のことである。 「会社の仕事には、とてもやりがいを感じていました。後輩が入り、新人の育成を担うようになったのですが、いろいろ話を聞いてみても中学・高校時代の思い出がない。楽しかったことを尋ねても『何ですかね』と、寂しい返事。彼らは中高時代、いったいどんな学校生活を送ってきたのかに興味を持ったのが、教師になろうと思ったきっかけです。当時の若者や学校のあり方に疑問を持ち、支援したいと思いました。未来の担い手を育てることで社会を変えたい
政府は11日、新型コロナウイルスによる肺炎の感染拡大防止に向け、中国浙江省に滞在歴がある外国人の入国を拒否する方針を固めた。現在は入国拒否の対象を武漢市を含む湖北省に限定しているが、浙江省
ユニークでシームレスなパターン背景を簡単に作成、SVGやPNG等でダウンロードできる・「Pattern Generator」
Pattern Generatorはユニークでシームレスなパターン背景を簡単に作成、SVGやPNG等でダウンロードできるWebアプリです。 用意されたパターンを選択肢てカラー等を設定して好みのスタイルにカスタマイズして使う、みたいな流れです。今となってはやや古い印象のアプリ名ですが性能はモダンで割と高性能でした。 直感である程度分かるくらいには分かりやすいUIで使いやすい印象でした。フォーマットはSVGやPNG、JPGなどでCSSも提供してくれます。サイドプロジェクトなんかに良いんじゃないでしょうか。 Pattern Generator
Vol.200 ブラックマジックデザインのクラウド対応デバイス体験レポート。国内でも「Blackmagic Cloud」サービススタート[OnGoing Re:View] - PRONEWS : 動画制作のあらゆる情報が集まるトータルガイド
ブラックマジックデザインのクラウド対応デバイス体験レポート。国内でも「Blackmagic Cloud」サービススタート DaVinci Resolveのクラウドコラボレーション機能が国内でも利用可能に 筆者は、アーティスト系ミュージックビデオや企業、地方のプロモーションビデオの制作、ライブ配信の案件を中心に取り組んでいるビデオグラファーである。ツールはDaVinci Resolveが中心で、Editページ、 Colorページ、Fairlightページをメインで使用し、ワンストップのサービスを提供している。特に編集ツールに関しては3年前からDaVinci Resolveに完全移行している。ノンリニア編集ツールは、Final Cut Pro、Adobe Premiere、DaVinci Resolveの順番に経験をしてきて、オフライン編集に関しては断トツでDaVinci Resolveの操作
![Vol.200 ブラックマジックデザインのクラウド対応デバイス体験レポート。国内でも「Blackmagic Cloud」サービススタート[OnGoing Re:View] - PRONEWS : 動画制作のあらゆる情報が集まるトータルガイド](https://cdn-ak-scissors.b.st-hatena.com/image/square/f512869189ec31e100c404710b45aa0ae3bbcae7/height=288;version=1;width=512/https%3A%2F%2Fjp.static.pronews.com%2Fpronewscore%2Fwp-content%2Fuploads%2F2022%2F10%2FReview-BlackmagicCloudpod.jpg)
setPointerCapture()でdocumentでonmousemoveしなくて済む（知名度が低いウェブ標準ひとりAdvent Calendar 2021 – 15日目） | Ginpen.com
ちなみにそれぞれ gotpointercapture と lostpointercapture イベントが発火します。 何が嬉しいか mousemove イベントを使って自前でドラッグを作ってみると直面すると思うんですが、このイベントって対象要素上でマウスカーソルを動かしたときにだけ反応しますね。 経験ない人からすると何当たり前のこと言ってんだって感じだと思うんですけど、こんなときに困るんです。 マウスカーソルを素早く操作して対象要素の外へ出てしまう デザインの都合上、重なり手前に表示される要素がある デモで右端を掴んで右側へドラッグしてみてください。たぶん止まります。カーソルを戻して、ゆっくり、はみ出ないよう少しずつ動かすとドラッグできます。 対処としては対象要素じゃなくて document の方で mousemove を見張るって感じでしょうか。直感的ではありませんし、開放処理の漏れと
<table class="jp-map"> <tbody> <tr> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td class="hokkaido" colspan="2" rowspan="2"><a href="#">北海道</a></td> </tr> <tr> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> <td></td> <td></td> <t
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
レスポンシブ対応の動的なダミー画像を提供する・「TwicPics Placeholders」
熱血になりがち､教師の魅力を見失うほど多忙な先生に必要な｢塩対応｣の技術 | 東洋経済education×ICT
中国浙江省からも入国拒否へ 政府、滞在歴ある外国人 - 日本経済新聞
HTML レスポンシブ対応の日本地図 - by Takumi Hirashima