https://b.hatena.ne.jp/papabeard/javascript/ javascriptに関するpapabeardのはてなブックマーク (6) https://webdesign-trends.net/entry/13664 papabeard 2024-06-25T06:51:50Z javascript ライブラリ 95 <blockquote cite="https://webdesign-trends.net/entry/13664" title="パララックスの実装におすすめのJavaScriptライブラリまとめ【2021年版】 | Web Design Trends"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fwebdesign-trends.net%2Fentry%2F13664" alt="" /> <a href="https://webdesign-trends.net/entry/13664">パララックスの実装におすすめのJavaScriptライブラリまとめ【2021年版】 | Web Design Trends</a></cite><p><a href="https://webdesign-trends.net/entry/13664"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/dd8061d9b5fc0c9fb76bb68d2d30fe49c2024673/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fwebdesign-trends.net%2Fwp%2Fwp-content%2Fuploads%2F2021%2F09%2Fparallax-libraries.jpg" alt="パララックスの実装におすすめのJavaScriptライブラリまとめ【2021年版】 | Web Design Trends" title="パララックスの実装におすすめのJavaScriptライブラリまとめ【2021年版】 | Web Design Trends" class="entry-image" /></a></p><p>Webデザインにおいて、定番テクニックの1つとして使われるのがパララックスです。パララックスはライブラリを使用することで手軽に導入することができ、Webサイトの印象を大きく変えることができます。 今回は、パララックスの実装におすすめのJavaScriptライブラリをご紹介します。 基本的にVanilla JSで作られているで...</p><p><a href="https://b.hatena.ne.jp/entry/s/webdesign-trends.net/entry/13664"><img src="https://b.hatena.ne.jp/entry/image/https://webdesign-trends.net/entry/13664" alt="はてなブックマーク - パララックスの実装におすすめのJavaScriptライブラリまとめ【2021年版】 | Web Design Trends" title="はてなブックマーク - パララックスの実装におすすめのJavaScriptライブラリまとめ【2021年版】 | Web Design Trends" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/webdesign-trends.net/entry/13664"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://for-someone.com/blog/5166/ papabeard 2023-12-26T00:17:42Z javascript wordpress 1 <blockquote cite="https://for-someone.com/blog/5166/" title="「フォームはこちら」ボタンをクリックし、フォームに遷移したら、ラジオボタンが選択されているように | 誰かのためのホームページ制作"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Ffor-someone.com%2Fblog%2F5166%2F" alt="" /> <a href="https://for-someone.com/blog/5166/">「フォームはこちら」ボタンをクリックし、フォームに遷移したら、ラジオボタンが選択されているように | 誰かのためのホームページ制作</a></cite><p><a href="https://for-someone.com/blog/5166/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/adb1075b0f4369f7147f56c6df472beafd03b642/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Ffor-someone.com%2Fwp%2Fwp-content%2Fuploads%2F2018%2F05%2Feyecatch_20180524.jpg" alt="「フォームはこちら」ボタンをクリックし、フォームに遷移したら、ラジオボタンが選択されているように | 誰かのためのホームページ制作" title="「フォームはこちら」ボタンをクリックし、フォームに遷移したら、ラジオボタンが選択されているように | 誰かのためのホームページ制作" class="entry-image" /></a></p><p>記事タイトルの意味がわかりにくい…。 やりたい事をもう少し詳しく書く。 一般的なコーポレートサイトを例として、 トップページ ├店舗案内 ├店舗A ├店舗B └店舗C └お問い合わせ というサイト構成とする。 【お問い合わせ】ページには問い合わせフォームがある。 「問い合わせ先の店舗名」という項目があり、ラジオボタ...</p><p><a href="https://b.hatena.ne.jp/entry/s/for-someone.com/blog/5166/"><img src="https://b.hatena.ne.jp/entry/image/https://for-someone.com/blog/5166/" alt="はてなブックマーク - 「フォームはこちら」ボタンをクリックし、フォームに遷移したら、ラジオボタンが選択されているように | 誰かのためのホームページ制作" title="はてなブックマーク - 「フォームはこちら」ボタンをクリックし、フォームに遷移したら、ラジオボタンが選択されているように | 誰かのためのホームページ制作" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/for-someone.com/blog/5166/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://ics.media/entry/10141/ papabeard 2023-07-20T09:30:55Z css javascript 8 <blockquote cite="https://ics.media/entry/10141/" title="CSSとHTML Canvasで作るモーショングラフィック - ICS MEDIA"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fics.media%2Fentry%2F10141%2F" alt="" /> <a href="https://ics.media/entry/10141/">CSSとHTML Canvasで作るモーショングラフィック - ICS MEDIA</a></cite><p><a href="https://ics.media/entry/10141/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/b42807e60989ba2c16e50ebafea5c1aa9d49f95e/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fics.media%2Fentry%2F10141%2Fimages%2Feyecatch.jpg" alt="CSSとHTML Canvasで作るモーショングラフィック - ICS MEDIA" title="CSSとHTML Canvasで作るモーショングラフィック - ICS MEDIA" class="entry-image" /></a></p><p>ICS MEDIAのトップページに掲載しているモーショングラフィック。これはCSSとHTML Canvas要素を使って作成したものです。時間経過とともに波の形状と色彩が変化し、多彩な表現を楽しめるようになっています。 本記事ではCSSとHTML Canvasの理解につながることを目標に、このモーショングラフィックの作成方法をステップ...</p><p><a href="https://b.hatena.ne.jp/entry/s/ics.media/entry/10141/"><img src="https://b.hatena.ne.jp/entry/image/https://ics.media/entry/10141/" alt="はてなブックマーク - CSSとHTML Canvasで作るモーショングラフィック - ICS MEDIA" title="はてなブックマーク - CSSとHTML Canvasで作るモーショングラフィック - ICS MEDIA" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/ics.media/entry/10141/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://qiita.com/saboriman/items/b7461f0ab5526845a0a5?utm_source=Qiita%E3%83%8B%E3%83%A5%E3%83%BC%E3%82%B9&utm_campaign=83777e6625-Qiita_newsletter_532_09_14_2022&utm_medium=email&utm_term=0_e44feaa081-83777e6625-44431842 papabeard 2022-09-13T23:45:12Z html css javascript PHP 1 <blockquote cite="https://qiita.com/saboriman/items/b7461f0ab5526845a0a5?utm_source=Qiita%E3%83%8B%E3%83%A5%E3%83%BC%E3%82%B9&amp;utm_campaign=83777e6625-Qiita_newsletter_532_09_14_2022&amp;utm_medium=email&amp;utm_term=0_e44feaa081-83777e6625-44431842" title="【サボりたいエンジニア向け】コーディングに役立つチートシートまとめ - Qiita"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fqiita.com%2Fsaboriman%2Fitems%2Fb7461f0ab5526845a0a5%3Futm_source%3DQiita%25E3%2583%258B%25E3%2583%25A5%25E3%2583%25BC%25E3%2582%25B9%26utm_campaign%3D83777e6625-Qiita_newsletter_532_09_14_2022%26utm_medium%3Demail%26utm_term%3D0_e44feaa081-83777e6625-44431842" alt="" /> <a href="https://qiita.com/saboriman/items/b7461f0ab5526845a0a5?utm_source=Qiita%E3%83%8B%E3%83%A5%E3%83%BC%E3%82%B9&amp;utm_campaign=83777e6625-Qiita_newsletter_532_09_14_2022&amp;utm_medium=email&amp;utm_term=0_e44feaa081-83777e6625-44431842">【サボりたいエンジニア向け】コーディングに役立つチートシートまとめ - Qiita</a></cite><p><a href="https://qiita.com/saboriman/items/b7461f0ab5526845a0a5?utm_source=Qiita%E3%83%8B%E3%83%A5%E3%83%BC%E3%82%B9&amp;utm_campaign=83777e6625-Qiita_newsletter_532_09_14_2022&amp;utm_medium=email&amp;utm_term=0_e44feaa081-83777e6625-44431842"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/7b585c7277ba65126fa5d09321b6e72279430f52/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fqiita-user-contents.imgix.net%252Fhttps%25253A%25252F%25252Fcdn.qiita.com%25252Fassets%25252Fpublic%25252Farticle-ogp-background-afbab5eb44e0b055cce1258705637a91.png%253Fixlib%253Drb-4.0.0%2526w%253D1200%2526blend64%253DaHR0cHM6Ly9xaWl0YS11c2VyLXByb2ZpbGUtaW1hZ2VzLmltZ2l4Lm5ldC9odHRwcyUzQSUyRiUyRmF2YXRhcnMuZ2l0aHVidXNlcmNvbnRlbnQuY29tJTJGdSUyRjI1NjUzODU1JTNGdiUzRDQ_aXhsaWI9cmItNC4wLjAmYXI9MSUzQTEmZml0PWNyb3AmbWFzaz1lbGxpcHNlJmZtPXBuZzMyJnM9OWNmN2Q4ZjVmZmI2M2MyZjExNGY3ODg3MGYxNzE1MzY%2526blend-x%253D120%2526blend-y%253D467%2526blend-w%253D82%2526blend-h%253D82%2526blend-mode%253Dnormal%2526s%253D4db748f27c63d164c8466613b1671bf3%3Fixlib%3Drb-4.0.0%26w%3D1200%26fm%3Djpg%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk2MCZoPTMyNCZ0eHQ9JUUzJTgwJTkwJUUzJTgyJUI1JUUzJTgzJTlDJUUzJTgyJThBJUUzJTgxJTlGJUUzJTgxJTg0JUUzJTgyJUE4JUUzJTgzJUIzJUUzJTgyJUI4JUUzJTgzJThCJUUzJTgyJUEyJUU1JTkwJTkxJUUzJTgxJTkxJUUzJTgwJTkxJUUzJTgyJUIzJUUzJTgzJUJDJUUzJTgzJTg3JUUzJTgyJUEzJUUzJTgzJUIzJUUzJTgyJUIwJUUzJTgxJUFCJUU1JUJEJUI5JUU3JUFCJThCJUUzJTgxJUE0JUUzJTgzJTgxJUUzJTgzJUJDJUUzJTgzJTg4JUUzJTgyJUI3JUUzJTgzJUJDJUUzJTgzJTg4JUUzJTgxJUJFJUUzJTgxJUE4JUUzJTgyJTgxJnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnR4dC1jb2xvcj0lMjMxRTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmdHh0LXBhZD0wJnM9NGEzZGM4OWQyMzlmZDIzN2Q2NjNkOGZjNmFkYmJlMDQ%26mark-x%3D120%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTgzOCZoPTU4JnR4dD0lNDBzYWJvcmltYW4mdHh0LWNvbG9yPSUyMzFFMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtcGFkPTAmcz04MWNkNGYwYjFkMzFkYjEwNDE3MWE4YTUzNWQyNzA2NA%26blend-x%3D242%26blend-y%3D480%26blend-w%3D838%26blend-h%3D46%26blend-fit%3Dcrop%26blend-crop%3Dleft%252Cbottom%26blend-mode%3Dnormal%26s%3D9e8605adad1ebf0ccacdbc51cd24e63b" alt="【サボりたいエンジニア向け】コーディングに役立つチートシートまとめ - Qiita" title="【サボりたいエンジニア向け】コーディングに役立つチートシートまとめ - Qiita" class="entry-image" /></a></p><p>はじめに こんな人が役に立つ記事 コーディング業務の効率を上げたい。 コーディングに関するチートシートを知りたい。 打つのもめんどいからコピペでなんとかしたい（笑） 今回は、コーディングに役立つチートシートをまとめました。 VSCODEチートシート エンジニアなら必ず使うであろうVsCodeのショートカットチートシ...</p><p><a href="https://b.hatena.ne.jp/entry/s/qiita.com/saboriman/items/b7461f0ab5526845a0a5?utm_source=Qiita%E3%83%8B%E3%83%A5%E3%83%BC%E3%82%B9&amp;utm_campaign=83777e6625-Qiita_newsletter_532_09_14_2022&amp;utm_medium=email&amp;utm_term=0_e44feaa081-83777e6625-44431842"><img src="https://b.hatena.ne.jp/entry/image/https://qiita.com/saboriman/items/b7461f0ab5526845a0a5?utm_source=Qiita%E3%83%8B%E3%83%A5%E3%83%BC%E3%82%B9&amp;utm_campaign=83777e6625-Qiita_newsletter_532_09_14_2022&amp;utm_medium=email&amp;utm_term=0_e44feaa081-83777e6625-44431842" alt="はてなブックマーク - 【サボりたいエンジニア向け】コーディングに役立つチートシートまとめ - Qiita" title="はてなブックマーク - 【サボりたいエンジニア向け】コーディングに役立つチートシートまとめ - Qiita" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/qiita.com/saboriman/items/b7461f0ab5526845a0a5?utm_source=Qiita%E3%83%8B%E3%83%A5%E3%83%BC%E3%82%B9&amp;utm_campaign=83777e6625-Qiita_newsletter_532_09_14_2022&amp;utm_medium=email&amp;utm_term=0_e44feaa081-83777e6625-44431842"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://qiita.com/nightyknite/items/668c112c40931515ed67 papabeard 2022-02-19T08:31:32Z jquery javascript 12 <blockquote cite="https://qiita.com/nightyknite/items/668c112c40931515ed67" title="JQueryをVanilla JSに緩やかに置き換える - Qiita"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fqiita.com%2Fnightyknite%2Fitems%2F668c112c40931515ed67" alt="" /> <a href="https://qiita.com/nightyknite/items/668c112c40931515ed67">JQueryをVanilla JSに緩やかに置き換える - Qiita</a></cite><p><a href="https://qiita.com/nightyknite/items/668c112c40931515ed67"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/43c3897a091dc49666bff8938f4bafb6845adf53/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fqiita-user-contents.imgix.net%252Fhttps%25253A%25252F%25252Fcdn.qiita.com%25252Fassets%25252Fpublic%25252Farticle-ogp-background-afbab5eb44e0b055cce1258705637a91.png%253Fixlib%253Drb-4.0.0%2526w%253D1200%2526blend64%253DaHR0cHM6Ly9xaWl0YS11c2VyLXByb2ZpbGUtaW1hZ2VzLmltZ2l4Lm5ldC9odHRwcyUzQSUyRiUyRnFpaXRhLWltYWdlLXN0b3JlLnMzLmFtYXpvbmF3cy5jb20lMkYwJTJGMzQ2OTklMkZwcm9maWxlLWltYWdlcyUyRjE0NzM2ODY0NTg_aXhsaWI9cmItNC4wLjAmYXI9MSUzQTEmZml0PWNyb3AmbWFzaz1lbGxpcHNlJmJnPUZGRkZGRiZmbT1wbmczMiZzPWE4OWI2YTdhYzY3OGFjOWI3ZDI3YWRlODk1YzkxZjRk%2526blend-x%253D120%2526blend-y%253D467%2526blend-w%253D82%2526blend-h%253D82%2526blend-mode%253Dnormal%2526s%253Dd9c4a447d5222e1b8be6b2790724507e%3Fixlib%3Drb-4.0.0%26w%3D1200%26fm%3Djpg%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk2MCZoPTMyNCZ0eHQ9SlF1ZXJ5JUUzJTgyJTkyVmFuaWxsYSUyMEpTJUUzJTgxJUFCJUU3JUI3JUE5JUUzJTgyJTg0JUUzJTgxJThCJUUzJTgxJUFCJUU3JUJEJUFFJUUzJTgxJThEJUU2JThGJTlCJUUzJTgxJTg4JUUzJTgyJThCJnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnR4dC1jb2xvcj0lMjMxRTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmdHh0LXBhZD0wJnM9YmMxNThlMTQ4M2MwN2I4YmQ4MGI1ZTA0ZDc3ZTJiMDg%26mark-x%3D120%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTgzOCZoPTU4JnR4dD0lNDBuaWdodHlrbml0ZSZ0eHQtY29sb3I9JTIzMUUyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTM2JnR4dC1wYWQ9MCZzPTZjNmE0YzFkM2Q4YmRjZjA1ZDdiZjc4ZTIzNjczZGFl%26blend-x%3D242%26blend-y%3D480%26blend-w%3D838%26blend-h%3D46%26blend-fit%3Dcrop%26blend-crop%3Dleft%252Cbottom%26blend-mode%3Dnormal%26s%3D8353cd02e755f7861007bfac0b1d2cf0" alt="JQueryをVanilla JSに緩やかに置き換える - Qiita" title="JQueryをVanilla JSに緩やかに置き換える - Qiita" class="entry-image" /></a></p><p>元々JQueryを多用していた物をVanilla JS（普通のJavascript)に徐々に書き換えていくポイントメモ的な物と関連記事を集めてきたもの。 書き換えの前提 時間がある時に、ちょっとずつ変えていく。一気に変更しない。 普通のJavascriptであれば５年以上は持ちそう。XMLHttpRequestなんて２０年前からある。 JQueryを無理に...</p><p><a href="https://b.hatena.ne.jp/entry/s/qiita.com/nightyknite/items/668c112c40931515ed67"><img src="https://b.hatena.ne.jp/entry/image/https://qiita.com/nightyknite/items/668c112c40931515ed67" alt="はてなブックマーク - JQueryをVanilla JSに緩やかに置き換える - Qiita" title="はてなブックマーク - JQueryをVanilla JSに緩やかに置き換える - Qiita" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/qiita.com/nightyknite/items/668c112c40931515ed67"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://paiza.hatenablog.com/entry/2021/10/13/153000 papabeard 2021-10-13T23:50:16Z javascript あとで読む 1261 <blockquote cite="https://paiza.hatenablog.com/entry/2021/10/13/153000" title="JavaScriptを完全無料で学習できる最強の厳選コンテンツを大公開！ -"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fpaiza.hatenablog.com%2Fentry%2F2021%2F10%2F13%2F153000" alt="" /> <a href="https://paiza.hatenablog.com/entry/2021/10/13/153000">JavaScriptを完全無料で学習できる最強の厳選コンテンツを大公開！ -</a></cite><p><a href="https://paiza.hatenablog.com/entry/2021/10/13/153000"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/5cf1d6b8bd2ef71bc246a5e51dd7c07b2448dea7/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fcdn.image.st-hatena.com%2Fimage%2Fscale%2F004ab8866c66829b161c0b0fe2b0fa90abe79846%2Fbackend%3Dimagemagick%3Bversion%3D1%3Bwidth%3D1300%2Fhttps%253A%252F%252Fcdn-ak.f.st-hatena.com%252Fimages%252Ffotolife%252Fp%252Fpaiza%252F20211013%252F20211013132242.jpg" alt="JavaScriptを完全無料で学習できる最強の厳選コンテンツを大公開！ -" title="JavaScriptを完全無料で学習できる最強の厳選コンテンツを大公開！ -" class="entry-image" /></a></p><p>どうも、まさとらん（@0310lan）です！ 今回は、JavaScript初心者から中級者までをカバーできる学習コンテンツを厳選してご紹介します。 完全無料で公開されているものばかりを集めており、なおかつ質の高いコンテンツを選んでいますので独学したい方にも最適です。テキスト、動画、本、Webアプリなど、さまざまな種類の...</p><p><a href="https://b.hatena.ne.jp/entry/s/paiza.hatenablog.com/entry/2021/10/13/153000"><img src="https://b.hatena.ne.jp/entry/image/https://paiza.hatenablog.com/entry/2021/10/13/153000" alt="はてなブックマーク - JavaScriptを完全無料で学習できる最強の厳選コンテンツを大公開！ -" title="はてなブックマーク - JavaScriptを完全無料で学習できる最強の厳選コンテンツを大公開！ -" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/paiza.hatenablog.com/entry/2021/10/13/153000"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote>