サクサク読めて、
アプリ限定の機能も多数！
アプリで開く
回答 (9件中の1件目) jQueryはもともとES5やES6の言語仕様のブラウザでの実装の度合いにバラつきがあった時期に、ブラウザハックを使わずに「ブラウザ互換」のプログラムを書けるようにする目的で作られたものです。その前に大流行したprototype.jsというフレームワークはAJAXを便利に使えるようにするものでしたが、jQueryではAJAXの扱いの容易さに加えてブラウザ互換、セレクタの豊富さ、イベント処理の書きやすさ、といった点で劇的に便利だったので、prototype.jsを置き換える形で一気にjQueryが普及しました。ただ、プロトタイプベースやプロトタイプチェーンというJ...
offsetプロパティは、パス上に要素を配置・移動させるCSSのプロパティです。animationプロパティやtransitionプロパティと組み合わせることで、手軽に一見複雑そうなアニメーションが作れます。SVGやJavaScriptは詳しくないけど、複雑そうな動きのアニメーションを作ってみたい方、animationプロパティなどのおさらいをしておきたい方にオススメの記事です。 サンプルを別ウインドウで開く ソースコードを確認する offsetプロパティと対応ブラウザについて offsetプロパティは、任意のパス上に要素を配置・移動させる一括指定プロパティです。以下の5つのプロパティが指定可能です。プロパティの詳細については、MDNのドキュメントをご参照ください。 offset-path：要素を配置・移動させるためのパス。（MDN） offset-distance：offset-pat
Web Audioは、音声を処理・合成するためのWebアプリケーション向けJavaScriptAPIです。HTML5から導入されました。オーディオソースの選択、エフェクト・ビジュアライゼーションの追加、パンニングなど特殊効果の適用など多くの機能を持ちます。HTMLとは、ウェブ上の文書を記述･作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像･リスト･表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。
Update 2024-03-30:Chrome 123 から "Emulate a focused page" が追加された。 これを用いれば良いため、以降の全ての方式は古くなった。 Apply other effects: enable automatic dark theme,emulate focus, and more https://developer.chrome.com/docs/devtools/rendering/apply-effects#emulate_a_focused_page マウスが乗ってないと出ないUI も、そこに Tab などでフォーカスを移し、その状態で Dev Tools の "Emulate a focused page" を有効にすれば良い。 Intro 先日、後輩が「mouseover 中にしか表示されない DOM のデバッグ」に手こずっ
2021 年 1 月にツイートした HTML/CSS/JavaScript のツイートまとめです。見出しをクリックするとツイート元に遷移するので、気に入ったらフォロー・ファボ・リツイートお願いします。 1. input[type="email"]とmultiple属性 input[type="email"] 要素に multiple 属性をつけるとカンマ区切りで複数のメールアドレスを入力できるようになります。 ただし、input 要素に type="email" を指定すると iOS のキーボードでカンマが入力できなくなるため、inputmode="text" を指定しておきます。 2. :not()セレクタに複雑なセレクタを指定 これまでは :not() セレクタ内に単一のセレクタしか指定できませんでしたが、これからは複雑なセレクタを指定できるようになります。
JSer.infoは2011年1月16日に公開したJavaScriptの情報サイトで、2021年1月16日で公開してからちょうど10年です。 JSer.infoでは、10年間で10201サイト紹介し、522コの記事書いてきました。 JSer.infoの紹介したサイト数(累計)。ソース 10年間途切れることなく毎週更新していて、月別の記事数は毎年同じ推移です。 JSer.infoの月別の記事数。ソース この記事では、10年間やってきたJSer.infoの目的を振り返り、JavaScriptの情報の集め方、書き方、まとめ方について書いていきたいと思います。 ⚠️ すべてを書いているのでものすごく長いです。 この記事やJSer.infoに関する意見や感想などは、次の場所に書いてください。 この記事をTweetするTwitter: #jserinfoGitHub Issue: JSer.in
JavaScript Plugin Architecture この書籍はJavaScriptのライブラリやツールにおけるプラグインアーキテクチャについて見ていくことを目的としたものです。 次の形式で読むことができます。 Web版PDF形式 ePub形式 Mobi形式 この書籍のソースコードは、次のGitHubリポジトリに公開されています。 azu/JavaScript-Plugin-Architecture:JavaScriptプラグインアーキテクチャの本Twitterのハッシュタグは#js_plugin_book 更新情報はRSSやリリースノートから見ることができます。 はじめにJavaScriptの世界では1つの大きなライブラリよりも小さなライブラリを組み合わせていくようなスタイルが多く見られます。小さなものを組み合わせて作るためには、プラグインと呼ばれる拡張の仕組みが必要とな
Web標準のHTTPクライアントfetch()でストリーミングしながらアップロードできるようになる。
JavaScriptの非同期処理Promise、AsyncとAwaitの仕組みをGIFアニメで解説した記事を紹介します。 ⭐️🎀JavaScript Visualized: Promises & Async/Await by Lydia Hallie 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに コールバック地獄 Promiseの構文 イベントループ: Microtasksと(Macro)tasks AsyncとAwait はじめにJavaScriptのコードが期待通りに実行されないことに悩まされたことはないですか？ おそらく、関数が不規則に実行されたり、予測できないタイミングで実行されたり、実行が遅れたりしたことがあるかもしれません。そして、ES6で導入された新機能Promiseが原因かもしれません！ 何年も
付録:JavaScriptチートシートJavaScriptの言語機能に関するチートシートです。 関連リソース この書籍の学習を補完するリソースとして、次のNotebookLMのページを用意しています。NotebookLMでは、自然言語で書籍について質問もできるので、チートシートと合わせて活用してください。JavaScript Primer -NotebookLM 目次 言語機能 コメント データ リテラル 文字列 データアクセス 演算子 関数と挙動 コントロールフロー モジュール その他 ガイドプロジェクト構造 言語機能 コメント コメントの書き方について。
ウェブでオーディオファイルを扱うのは「正気の沙汰ではない（要出典）」と言われており、Web AudioAPIやHTML5 Audio（HTMLMediaElement）を見ると、確かにそっ閉じしたくなる感じです。 そんなオーディオファイルの読み込みからブラウザごとの再生できるファイルの判定など、面倒な処理を任せてしまえるオーディオ関連のJavaScriptライブラリHowler.jsを紹介します。 公式サイト（サンプルあり）：howler.js -JavaScript audio library for the modern web リポジトリ：howler.js -GitHub 使い方 npmなら
皆さんこんにちわ、JavaScript のソース隠蔽について考えるコラムも今回で一応の結論を出そうと思います。 今回はもう既に色々出来上がっているので、無駄な前置きはググッと我慢して進めます。 それではこのミッションを遂行するための手持ち武器をまとめます。JavaScript による navigator.userAgent と navigator.platform のチェックで偽装を認めない認証 Ajax による非同期なソース展開、送受信は POST とする事で URL 欄からの単純な攻撃を防ぐ 開発は通常通りJavaScriptファイル（.js）で行い、呼び出す時はPHP 内でファイルを読み込んで文字列のみ送信 認証を通らない時は何か画面に表示する JS を切られたらもうそれは無視する こんな感じですね、それでは解説を交え早速実装して行きましょう。 取りあえずファイル構成はこんな感
やりたいことJavascriptでバーコードリーダーを実装。 出来るだけ多くのプラットフォームで動作させたい。 WebCodeCamJSというライブラリをベースにバーコードリーダーを実装する。 クライアントサイドで動作するため、サーバに余計な負荷をかけない。 WebCodeCamJSをカスタマイズさせて、より使いやすくする。 チェックデジットを自前で実装して、より誤検出をへらす。 そのうち記事を追記したりするかもしれません。 前提 前回の記事 https://qiita.com/mm_sys/items/a0dcc2c02f27751cd80d WebRTCでwebカメラを使ってバーコードリーダーを実装するため、前回はそのテスト環境を作成しました。 しかし、そのテスト環境でなくてもHTTPSで接続出来る環境であれば今回の内容を実装できます。 webサイトの保存ディレクトリをhtdocsと
html で リンクを新しいタブ(やウィンドウ)で開かせたい場合、target="_blank" を指定するが、 この使い方には落とし穴があるらしい。 www.jitbit.com リンクを開いた先のjavascript から、開いた元のページを操作できてしまうとのこと。 気になったので確認してみた。 悪用のパターン insecure.html が最初に開くページで、ここに target="_blank" なリンクがある。 このリンクを押すと new_window.html を新しいタブで開く。 この new_window.html にjavascript が仕込まれており、元ページを操作されるという話。 具体的には window.opener.location="./evil.html" と実行すると、元タブはevil.html に遷移する。 実際試してみたのが ここ。 リンクを開
こんにちは、フロントエンドエンジニアのハルです。 最近カメラにハマっています。一眼カメラを買いました。 ほかにもカメラで何か面白いことできないかなと考えていろいろ調べていたら、スマホのカメラとブラウザでARが使えることを知りました。遊びながら記事を書いたのでふわふわした内容になりましたが、気楽に読んでいただけたらと思います。 ※ARとは……「Augmented Reality」の略で、「拡張現実」のこと。デバイスのカメラの映像を認識して、その映像にオブジェクトやテキスト情報など表示するような技術のことを言う。ARを利用した代表的なサービスのひとつに『ポケモンGO』がある AR.jsとは 数行のコードでARを体験できるjavascriptライブラリです。 three.jsとjsartoolkit5をベースにしているため、アプリのようなインストールは不要。webブラウザ上でも動作します。 AR
kintoneはJavaScriptを使って自由にカスタマイズできます。 カスタマイズにより独自のリッチなUIを構築したり、新しい機能を追加したりできますが、セキュアなコーディングをしないと クロスサイトスクリプティング （以下、XSS）などの脆弱性を作り込んでしまう危険性があります。 この記事では、JavaScriptでセキュアなコーディングをするための基本的なポイントを解説します。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
