サクッと試す！HTML＋JavaScript APIの最新事情
HTMLと関連するJavaScript APIにフォーカスして、その新機能を手軽に試す
-
9
コピーアンドペーストがWebでも使える！Clipboard APIを試す
今回は、クリップボードを扱えるClipboard APIを試します。ページのコンテンツをクリックでコピーしたり、ページをクリップボードの内容で更新したりする例を紹介します。
-
8
最適な画像を自動表示する！srcset属性とsizes属性を試そう
今回は、img要素のsrcset属性・sizes属性と、link要素のrel="preload"属性、imagesrcset属性とimagesizes属性を使い、条件に応じた最適画像の選択と先行読み込みを確認します。
-
7
検索結果を強調表示！CSS Custom Highlight APIを試そう
今回は、DOMの書き換えなしにテキストの一部の色などを変更できるCSS Custom Highlight APIを試します。検索結果で該当キーワードを強調表示する例を使って紹介します。
-
6
動画再生をミニウインドウで！Picture-in-Picture APIを試そう
今回は、音楽や動画をミニウインドウで再生できるPicture-in-Picture APIを試します。video要素をミニウインドウに移動して動画を再生したり、ミニウインドウを閉じ手元に戻す例を紹介します。
-
5
今回は、ポップオーバーを扱います。シンプルな表示からスタイルの指定、複数のポップオーバーを使う方法、トーストやツールチップへの応用例も紹介します。
-
4
今回は、input要素で入力方法を拡張できるdatalistを試します。単純に項目を選べるほか、特定の日付や色などを選べる例を紹介します。
-
3
今回は、dialog要素によるダイアログのシンプルな実現方法の他、JavaScriptとの連携、スタイルの指定など見た目を調整する例を紹介していきます。
-
2
その場で撮影してアップロード！HTML Media Captureを試そう
今回は、静止画や動画、音声をその場で撮影、録音してアップロードできるHTML Media Captureを紹介します。
-
1
今回は、HTMLから簡単に利用できるインタラクションであるアコーディオンを試します。summary/details要素のみによるシンプルな実現方法の他、スタイルの指定による見た目を調整する例も多数紹介します