Cruwが運営する塗り絵サイト「ぬりえ図鑑」で、トップページのイラストを「さわって遊べる」ものに作り変えました。色鉛筆を押すと絵の具が飛び散り、黒猫を続けて押すと隠しミニゲームが始まります。この記事では、どんな仕掛けを入 …
2026.09.30
Web制作・ホームページ制作
2026.09.30
2025.01.16
Web関連Web制作・ホームページ制作
2025.01.16
SVGとGSAPで手書き風アニメーションを実装する方法
手書きしているように筆記体の文字などをアニメーションさせる方法をご紹介します。今回アニメーションさせるのは以下の文字です。 SVG、Figma、GSAP（https://gsap.com/）の3つを使って簡単に実装できま …
2022.10.20
Web制作・ホームページ制作
2022.10.20
【JavaScript】Basic認証代わりに簡易的なパスワード認証方法
今回、リリース前等で一時的にパスワード認証を付けたい。だけど、理由があってBasic認証が付けれず、Javascriptのみでパスワード認証を設置したい場合の方法を簡単にご紹介します。 早速、以下、完成ソースになります。 …
2022.06.13
システム開発
2022.06.13
【jquery.cookie.js / document】cookieへの保存・出力
cookieとは、ブラウザを通じて一時的にホームページを見た人のコンピュータに書き込み、保存させるデータのことです。cookieには、ホームページを見た人に関する情報や最後にホームページを見た時間、回数などのデータから識 …
2022.05.17
Web制作・ホームページ制作
2022.05.17
selectをjQuery cloneしてもvalueが引き継がれないバグ解消法
今回、selectをまるっとjQueryのcloneを使ってコピーしようとしましたが、optionの選択したvalueまでは引き継がれないバグ(？)がありましたので、以下方法で対応しました。 …
2022.03.17
システム開発
2022.03.17
sortableの入れ子項目で並び替えするやり方
jQuery UIのSortableを使って、入れ子項目の並び替えをしたいのですが、入れ子項目が外に出てしまい親子関係が崩れてしまうということがありました。 今回は、入れ子項目の並び替えを行い、親子関係を保った並び替え方 …
2021.04.27
Web制作・ホームページ制作
2021.04.27
After Effects でのSVGアニメーション作り方〜書き出し
自社のトップページでも使用しているSVGアニメーションの作り方〜書き出しまで紹介します。 準備するもの After EffectsのデータをHTMLに書き出せるExtension「Bodymovin」 画像素材（aiデー …
