カテゴリー「Javascript」

あまり情報が見当たらなかった不具合に遭遇したので覚書きです。 事象の詳細 事象はReactで構築中のサイトで発生。PCブラウザ開発者ツールのレスポンシブモードでは発生せず、実機のiPhone（iOS17）でのみ確認できました。 フォームの入...

この前の記事でdata-*属性のカスタムブロックの作成方法を書きました。それからちょこちょこ触ってみて実際に作成する際はこういう形で開発すると編集しやすいかな・スマートかなと思ったことがあったので、それらを記録としてまとめたいと思います。 ...

「モーダルを開いた時にスクロールを一時的に禁止させたい」という目的でmousewheelイベントを使ったところ、Firefoxブラウザで動作しないということがありました。 その調べ物ついでに、スクロール禁止関連のイベントで気になったことを調...

ファッション系、スタイリッシュ系のウェブサイトで写真が映えるスライドショーを紹介します。 (さらに…)

こんにちは、しばです。 ウェブに掲載する動画が重いときはこれまで動画本体の画質を落として軽量化して対応してきたんですが、解像度の荒さが気になる場合も。 そんな時、HLSを使ったストリーミング配信をすれば動画本体のクオリティを下げずにスムーズ...

こんにちは、しばです。 最近Adobe After Effectsを使っているんですが、とある記事でLottieの存在を知りました。 After Effectsのアニメーション書き出せるとかすごでは...試してみたい →Webアニメーション...

こんにちは、しばです。 この前、シャープをパラメータとして受け取ってphpで使いたいなぁという機会がありました。 例であげるとこういうURLです。 https://exampla.com/?target=man_#01 https://ex...

こんにちは、しばです。 スマホでhoverアクションを適用するかどうか、意見が分かれる部分だと思いますが適用したいという人も多いかと思います。 この間試しに適用して検証してみたところ、Chromeの開発者ツールで大量の「[Violation...

こんにちは、しばです。 写真系SNSの二大巨頭と言われるInstagramとFlickr。「インスタ映え」で話題になったInstagramは一般的にも有名ですが、写真撮影に力を入れているなら撮影情報(Exifデータ)を残せるFlickrを使...

ng-classの記事はよく見るのですが、ng-styleでスコープのプロパティを使ったり条件つけたりする方法が今いち分からなかったので、まとめました。 ng-styleの使い方 基本的な書き方 ◯ ng-style="{ height :...