https://b.hatena.ne.jp/yorozuna/JavaScript/ JavaScriptに関するyorozunaのはてなブックマーク (323) https://ics.media/entry/210426/ yorozuna 2022-02-15T13:54:24Z スクロール アニメーション webデザイン animation web制作 *javascript javascript js effect <blockquote cite="https://ics.media/entry/210426/" title="トレンドウェブサイトから学べ！　JavaScriptで作る本格スクロール演出 - ICS MEDIA"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fics.media%2Fentry%2F210426%2F" alt="" /> <a href="https://ics.media/entry/210426/">トレンドウェブサイトから学べ！　JavaScriptで作る本格スクロール演出 - ICS MEDIA</a></cite><p><a href="https://ics.media/entry/210426/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/ec7fdd6c306805c023042fbc46f33547b7b35d05/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fics.media%2Fentry%2F210426%2Fimages%2Feyecatch.png" alt="トレンドウェブサイトから学べ！　JavaScriptで作る本格スクロール演出 - ICS MEDIA" title="トレンドウェブサイトから学べ！　JavaScriptで作る本格スクロール演出 - ICS MEDIA" class="entry-image" /></a></p><p>「かっこいいウェブサイト」とはどのようなものでしょう？　ICS MEDIAを見てくださるみなさんであれば、ダイナミックなアニメーションや3次元的な動きがあるウェブサイトに「おっ」と惹きつけられた経験は一度や二度ではないかと思います。たとえば、スクロールに連動したインタラクティブな動きは冒険するようなワクワ...</p><p><a href="https://b.hatena.ne.jp/entry/s/ics.media/entry/210426/"><img src="https://b.hatena.ne.jp/entry/image/https://ics.media/entry/210426/" alt="はてなブックマーク - トレンドウェブサイトから学べ！　JavaScriptで作る本格スクロール演出 - ICS MEDIA" title="はてなブックマーク - トレンドウェブサイトから学べ！　JavaScriptで作る本格スクロール演出 - ICS MEDIA" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/ics.media/entry/210426/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 352 https://anond.hatelabo.jp/20170911110731 yorozuna 2017-09-20T23:58:53Z programming プログラミング web 勉強 教育 エンジニア Javascript html あとで読む <blockquote cite="https://anond.hatelabo.jp/20170911110731" title="まじな話をすると、N予備校のプログラミング入門コースやるのがオススメ。 .."><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fanond.hatelabo.jp%2F20170911110731" alt="" /> <a href="https://anond.hatelabo.jp/20170911110731">まじな話をすると、N予備校のプログラミング入門コースやるのがオススメ。 ..</a></cite><p><a href="https://anond.hatelabo.jp/20170911110731"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/2ec6a459bb9b383ee013c4fa73ad41a2bd0d9813/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fanond.hatelabo.jp%2Fimages%2Fog-image-1500.gif" alt="まじな話をすると、N予備校のプログラミング入門コースやるのがオススメ。 .." title="まじな話をすると、N予備校のプログラミング入門コースやるのがオススメ。 .." class="entry-image" /></a></p><p>まじな話をすると、N予備校のプログラミング入門コースやるのがオススメ。 https://www.nnn.ed.nico 一日8時間勉強時間があるなら、だいたい一ヶ月で終わる内容。 月額1000円だけどしっかり勉強すれば一ヶ月の無料期間中に終わると思う。 もともとN高等学校のノンプログラマーの生徒をWebエンジニアとして就職させるため...</p><p><a href="https://b.hatena.ne.jp/entry/s/anond.hatelabo.jp/20170911110731"><img src="https://b.hatena.ne.jp/entry/image/https://anond.hatelabo.jp/20170911110731" alt="はてなブックマーク - まじな話をすると、N予備校のプログラミング入門コースやるのがオススメ。 .." title="はてなブックマーク - まじな話をすると、N予備校のプログラミング入門コースやるのがオススメ。 .." border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/anond.hatelabo.jp/20170911110731"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 3632 https://ferret-plus.com/6041 yorozuna 2017-03-01T03:31:34Z css Javascript js library ライブラリ web制作 web開発 まとめ あとで試す あとで読む <blockquote cite="https://ferret-plus.com/6041" title="フロントエンドエンジニアなら押さえておきたい！最近登場した注目のJavaScript＆CSSライブラリ8選"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fferret-plus.com%2F6041" alt="" /> <a href="https://ferret-plus.com/6041">フロントエンドエンジニアなら押さえておきたい！最近登場した注目のJavaScript＆CSSライブラリ8選</a></cite><p><a href="https://ferret-plus.com/6041"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/2d1126819ae0d5701e243ece2baf0a7989a4ad9a/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fferret.akamaized.net%2Fuploads%2Farticle%2F6041%2Fog_image%2Fdefault-9a8cafb87d74ac31a5606f6a3c335369.png" alt="フロントエンドエンジニアなら押さえておきたい！最近登場した注目のJavaScript＆CSSライブラリ8選" title="フロントエンドエンジニアなら押さえておきたい！最近登場した注目のJavaScript＆CSSライブラリ8選" class="entry-image" /></a></p><p>Webデザイナーやフロントエンドエンジニアにとって、日々登場するフレームワークやライブラリをキャッチアップすることはとても大切です。 なぜなら、そうしたフレームワークやライブラリによって業務が効率化すれば、他の作業に時間を割くことができるからです。 しかし、フレームワークやライブラリが続々と登場するあ...</p><p><a href="https://b.hatena.ne.jp/entry/s/ferret-plus.com/6041"><img src="https://b.hatena.ne.jp/entry/image/https://ferret-plus.com/6041" alt="はてなブックマーク - フロントエンドエンジニアなら押さえておきたい！最近登場した注目のJavaScript＆CSSライブラリ8選" title="はてなブックマーク - フロントエンドエンジニアなら押さえておきたい！最近登場した注目のJavaScript＆CSSライブラリ8選" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/ferret-plus.com/6041"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 129 http://un-tech.jp/velocity-basic-option/ yorozuna 2016-03-28T09:16:16Z jQuery アニメーション Animation easing javascript velocity velocity.js web制作 webdesign webデザイン <blockquote cite="http://un-tech.jp/velocity-basic-option/" title="velocity.jsの使い方　記述方法とオプション機能 — un-Tech"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Fun-tech.jp%2Fvelocity-basic-option%2F" alt="" /> <a href="http://un-tech.jp/velocity-basic-option/">velocity.jsの使い方　記述方法とオプション機能 — un-Tech</a></cite><p><a href="http://un-tech.jp/velocity-basic-option/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/e586ecdb023b54e8860c0ee426e7c50a88b292a6/backend=imagemagick;height=90;version=1;width=120/http%3A%2F%2Fun-tech.jp%2Fwp-content%2Fuploads%2F2015%2F07%2Fvelo_2-e1437460800552-1024x445-e1438661323684.jpg" alt="velocity.jsの使い方　記述方法とオプション機能 — un-Tech" title="velocity.jsの使い方　記述方法とオプション機能 — un-Tech" class="entry-image" /></a></p><p>どうも、茂吉です。 突然ですが、あなたのアニメーション、動きがカクついていませんか？ 「カクつきは感じているが仕方ない。」と思っている方、 滑らかなアニメーションにすることができます。 「いいえ。カクついてなどいません。」と思った方、 実はカクついていることに気づいていないだけかもしれません。 velocit...</p><p><a href="https://b.hatena.ne.jp/entry/un-tech.jp/velocity-basic-option/"><img src="https://b.hatena.ne.jp/entry/image/http://un-tech.jp/velocity-basic-option/" alt="はてなブックマーク - velocity.jsの使い方　記述方法とオプション機能 — un-Tech" title="はてなブックマーク - velocity.jsの使い方　記述方法とオプション機能 — un-Tech" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/un-tech.jp/velocity-basic-option/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 15 https://ics.media/entry/11292 yorozuna 2016-03-07T06:07:43Z random math javascript algorithm 乱数 アルゴリズム プログラミング 開発 あとで読む <blockquote cite="https://ics.media/entry/11292" title="JavaScript開発に役立つ重要なランダムの数式まとめ - ICS MEDIA"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fics.media%2Fentry%2F11292" alt="" /> <a href="https://ics.media/entry/11292">JavaScript開発に役立つ重要なランダムの数式まとめ - ICS MEDIA</a></cite><p><a href="https://ics.media/entry/11292"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/57ff9bc9af7655238da1d7248d81dde642ed3450/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fics.media%2Fentry%2F11292%2Fimages%2Feyecatch.jpg" alt="JavaScript開発に役立つ重要なランダムの数式まとめ - ICS MEDIA" title="JavaScript開発に役立つ重要なランダムの数式まとめ - ICS MEDIA" class="entry-image" /></a></p><p>プログラムで使うことの多い「乱数」。ゲーム開発やビジュアルアート、ウェブサイトのアニメーションにおいて乱数は非常に重要で、さまざまな用途で利用されています。プログラムで一般に乱数と聞くと、すべての数値が同じ頻度（分布）で出現する「一様乱数」と呼ばれる乱数をイメージする方が多いと思います。 多くの場...</p><p><a href="https://b.hatena.ne.jp/entry/s/ics.media/entry/11292"><img src="https://b.hatena.ne.jp/entry/image/https://ics.media/entry/11292" alt="はてなブックマーク - JavaScript開発に役立つ重要なランダムの数式まとめ - ICS MEDIA" title="はてなブックマーク - JavaScript開発に役立つ重要なランダムの数式まとめ - ICS MEDIA" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/ics.media/entry/11292"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 356 http://creator.dwango.co.jp/3413.html yorozuna 2016-01-22T02:14:45Z react.js react javascript web制作 js web あとで読む <blockquote cite="http://creator.dwango.co.jp/3413.html" title="JSといえばjQueryだったWebデザイナーが、Reactを1年間使って感じたメリット｜dwango creators&#39; blog（ドワンゴクリエイターズブログ）"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Fcreator.dwango.co.jp%2F3413.html" alt="" /> <a href="http://creator.dwango.co.jp/3413.html">JSといえばjQueryだったWebデザイナーが、Reactを1年間使って感じたメリット｜dwango creators&#39; blog（ドワンゴクリエイターズブログ）</a></cite><p><a href="http://creator.dwango.co.jp/3413.html"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/343ba3cd1656597881235ddaaeab01ad55caa930/backend=imagemagick;height=90;version=1;width=120/http%3A%2F%2Fcreator.dwango.co.jp%2Fwp-content%2Fuploads%2F2016%2F01%2F1.jpg" alt="JSといえばjQueryだったWebデザイナーが、Reactを1年間使って感じたメリット｜dwango creators&#39; blog（ドワンゴクリエイターズブログ）" title="JSといえばjQueryだったWebデザイナーが、Reactを1年間使って感じたメリット｜dwango creators&#39; blog（ドワンゴクリエイターズブログ）" class="entry-image" /></a></p><p>はじめまして、ほそだと申します。昨年秋まで個人事業主の立場でドワンゴでお仕事させていただいておりましたが、いろいろ経緯がありまして中の人になりました。ドワンゴ歴はそこそこ長い新入りです。よろしくお願いいたします。 さて、今回はデザイナー（HTML/CSS/JSは扱えるいわゆる「Webデザイナー」）として1年間ほ...</p><p><a href="https://b.hatena.ne.jp/entry/creator.dwango.co.jp/3413.html"><img src="https://b.hatena.ne.jp/entry/image/http://creator.dwango.co.jp/3413.html" alt="はてなブックマーク - JSといえばjQueryだったWebデザイナーが、Reactを1年間使って感じたメリット｜dwango creators&#39; blog（ドワンゴクリエイターズブログ）" title="はてなブックマーク - JSといえばjQueryだったWebデザイナーが、Reactを1年間使って感じたメリット｜dwango creators&#39; blog（ドワンゴクリエイターズブログ）" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/creator.dwango.co.jp/3413.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 1219 http://owlgraphic.com/owlcarousel/ yorozuna 2015-12-11T23:41:50Z jQuery plugin jqueryプラグイン carousel カルーセル responsive javascript web制作 UI インターフェース <blockquote cite="http://owlgraphic.com/owlcarousel/" title="Bukmacherzy w Polsce 2026 – Kto rządzi rynkiem? Ranking i analiza"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Fowlgraphic.com%2Fowlcarousel%2F" alt="" /> <a href="http://owlgraphic.com/owlcarousel/">Bukmacherzy w Polsce 2026 – Kto rządzi rynkiem? Ranking i analiza</a></cite><p><a href="http://owlgraphic.com/owlcarousel/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/5145bc693c66132b6b5328cf61a844ac4623b6ac/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fowlgraphic.com%2Fwp-content%2Fuploads%2F2025%2F05%2FBukmacherzy-Polska.jpg" alt="Bukmacherzy w Polsce 2026 – Kto rządzi rynkiem? Ranking i analiza" title="Bukmacherzy w Polsce 2026 – Kto rządzi rynkiem? Ranking i analiza" class="entry-image" /></a></p><p>Bukmacherzy Polska 2026 Rynek bukmacherski w Polsce kwitnie z dnia na dzień, a żywym dowodem tego są chociażby nowi operatorzy, którzy pojawiają się na rynku. Aczkolwiek, od ich nadmiaru użytkowników może rozboleć głowa, dlatego też pochyliliśmy się nad dostępnymi opcjami i od deski do deski prze...</p><p><a href="https://b.hatena.ne.jp/entry/owlgraphic.com/owlcarousel/"><img src="https://b.hatena.ne.jp/entry/image/http://owlgraphic.com/owlcarousel/" alt="はてなブックマーク - Bukmacherzy w Polsce 2026 – Kto rządzi rynkiem? Ranking i analiza" title="はてなブックマーク - Bukmacherzy w Polsce 2026 – Kto rządzi rynkiem? Ranking i analiza" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/owlgraphic.com/owlcarousel/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 186 http://un-tech.jp/tweenmax-started/ yorozuna 2015-11-26T05:12:29Z アニメーション animation TweenMax jQuery js Javascript web制作 webdesign webデザイン motion <blockquote cite="http://un-tech.jp/tweenmax-started/" title="Googleも推奨！アニメーションライブラリTweenMaxの使い方　入門編 — un-Tech"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Fun-tech.jp%2Ftweenmax-started%2F" alt="" /> <a href="http://un-tech.jp/tweenmax-started/">Googleも推奨！アニメーションライブラリTweenMaxの使い方　入門編 — un-Tech</a></cite><p><a href="http://un-tech.jp/tweenmax-started/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/2d30103cf027625b9db6b2d0bc116d463ff76dfc/backend=imagemagick;height=90;version=1;width=120/http%3A%2F%2Fun-tech.jp%2Fwp-content%2Fuploads%2F2015%2F11%2FfVSwTG05QIaE9FN7tLQ5_IMG_11221.jpg" alt="Googleも推奨！アニメーションライブラリTweenMaxの使い方　入門編 — un-Tech" title="Googleも推奨！アニメーションライブラリTweenMaxの使い方　入門編 — un-Tech" class="entry-image" /></a></p><p>ごきげんよう。フーミンです。 「JavaScriptでアニメーション作るならTweenMaxが最強だよ」と先輩から教わり早2年。いまだ現役最強（僕の中で）JavaScriptアニメーションライブラリTweenMaxの良さを広めるために、入門編・応用編の全2回に分けてご紹介しようと思います。 TweenMaxとは TweenMaxとは、GreenSock社が開発...</p><p><a href="https://b.hatena.ne.jp/entry/un-tech.jp/tweenmax-started/"><img src="https://b.hatena.ne.jp/entry/image/http://un-tech.jp/tweenmax-started/" alt="はてなブックマーク - Googleも推奨！アニメーションライブラリTweenMaxの使い方　入門編 — un-Tech" title="はてなブックマーク - Googleも推奨！アニメーションライブラリTweenMaxの使い方　入門編 — un-Tech" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/un-tech.jp/tweenmax-started/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 722 http://mojs.io/ yorozuna 2015-11-24T01:40:56Z motion graphics js javascript library SVG motion web制作 Animation アニメーション あとで試す <blockquote cite="http://mojs.io/" title="Loading..."><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Fmojs.io%2F" alt="" /> <a href="http://mojs.io/">Loading...</a></cite><p><a href="http://mojs.io/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/efeff57390b72f0c019860ba075ebeaac8bddf48/backend=imagemagick;height=90;version=1;width=120/http%3A%2F%2Fmojs.io%2Fapp%2Fcss%2Fi%2Fmojs-loop.png" alt="Loading..." title="Loading..." class="entry-image" /></a></p><p></p><p><a href="https://b.hatena.ne.jp/entry/mojs.io/"><img src="https://b.hatena.ne.jp/entry/image/http://mojs.io/" alt="はてなブックマーク - Loading..." title="はてなブックマーク - Loading..." border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/mojs.io/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 137 http://level0.kayac.com/2015/02/kidukitips.php yorozuna 2015-07-24T06:42:30Z javascript web コーディング coding web制作 Tips html css web design まとめ <blockquote cite="http://level0.kayac.com/2015/02/kidukitips.php" title="検索じゃ学べない！ HTML/CSS/JavaScriptの気づきTipsまとめ31こ | _level0 - KAYAC Front Engineer Blog"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Flevel0.kayac.com%2F2015%2F02%2Fkidukitips.php" alt="" /> <a href="http://level0.kayac.com/2015/02/kidukitips.php">検索じゃ学べない！ HTML/CSS/JavaScriptの気づきTipsまとめ31こ | _level0 - KAYAC Front Engineer Blog</a></cite><p><a href="http://level0.kayac.com/2015/02/kidukitips.php"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/a0b559ccddc87c383b50cb590fcd5db3bc188ee4/backend=imagemagick;height=90;version=1;width=120/http%3A%2F%2Flevel0.kayac.com%2FkidukiTIps%2Fimage.png" alt="検索じゃ学べない！ HTML/CSS/JavaScriptの気づきTipsまとめ31こ | _level0 - KAYAC Front Engineer Blog" title="検索じゃ学べない！ HTML/CSS/JavaScriptの気づきTipsまとめ31こ | _level0 - KAYAC Front Engineer Blog" class="entry-image" /></a></p><p>HTMLファイ部のほんだです。 気づきTips！ Σ(・ロ・) カヤックの中でもHTML5のWebフロントエンド実装を担当する エンジニアを集めた部署「HTMLファイ部」では、 制作にあたってはまったことや、気づいたことをメモ的に蓄積・共有しています。 通常は、 1. 制作で何かわからないことがでた ▼ 2. Google等で検索して解決の...</p><p><a href="https://b.hatena.ne.jp/entry/level0.kayac.com/2015/02/kidukitips.php"><img src="https://b.hatena.ne.jp/entry/image/http://level0.kayac.com/2015/02/kidukitips.php" alt="はてなブックマーク - 検索じゃ学べない！ HTML/CSS/JavaScriptの気づきTipsまとめ31こ | _level0 - KAYAC Front Engineer Blog" title="はてなブックマーク - 検索じゃ学べない！ HTML/CSS/JavaScriptの気づきTipsまとめ31こ | _level0 - KAYAC Front Engineer Blog" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/level0.kayac.com/2015/02/kidukitips.php"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 839 https://coliss.com/articles/build-websites/operation/javascript/js-wheelnav.html yorozuna 2015-03-05T10:06:14Z svg Javascript js 回転 rotate UI Animation navigation webdesign web制作 <blockquote cite="https://coliss.com/articles/build-websites/operation/javascript/js-wheelnav.html" title="[JS]SVGを使ったアニメーションが楽しい、回転する新感覚のナビゲーションを実装するスクリプト -wheelnav.js"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fcoliss.com%2Farticles%2Fbuild-websites%2Foperation%2Fjavascript%2Fjs-wheelnav.html" alt="" /> <a href="https://coliss.com/articles/build-websites/operation/javascript/js-wheelnav.html">[JS]SVGを使ったアニメーションが楽しい、回転する新感覚のナビゲーションを実装するスクリプト -wheelnav.js</a></cite><p><a href="https://coliss.com/articles/build-websites/operation/javascript/js-wheelnav.html"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/5417a3fb5a80fec1eb750bf9d4f54db39a483f1f/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201501%2F2015022401.png" alt="[JS]SVGを使ったアニメーションが楽しい、回転する新感覚のナビゲーションを実装するスクリプト -wheelnav.js" title="[JS]SVGを使ったアニメーションが楽しい、回転する新感覚のナビゲーションを実装するスクリプト -wheelnav.js" class="entry-image" /></a></p><p>demo: pie menu アイコンをクリック（タップ）すると、バウンドしながらパイ状に広がります。省スペース用のシェアボタンとかにしてもよさそうです。 wheelnav.jsの使い方 Step 1: 外部ファイル 当スクリプトとRaphaël.jsを外部ファイルとして記述します。 &lt;head&gt; ... &lt;script type=&quot;text/javascript&quot; src=&quot;js/required/...</p><p><a href="https://b.hatena.ne.jp/entry/s/coliss.com/articles/build-websites/operation/javascript/js-wheelnav.html"><img src="https://b.hatena.ne.jp/entry/image/https://coliss.com/articles/build-websites/operation/javascript/js-wheelnav.html" alt="はてなブックマーク - [JS]SVGを使ったアニメーションが楽しい、回転する新感覚のナビゲーションを実装するスクリプト -wheelnav.js" title="はてなブックマーク - [JS]SVGを使ったアニメーションが楽しい、回転する新感覚のナビゲーションを実装するスクリプト -wheelnav.js" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/coliss.com/articles/build-websites/operation/javascript/js-wheelnav.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 25 https://www.moongift.jp/2015/02/navstack-js-%E3%83%8F%E3%82%A4%E3%83%96%E3%83%AA%E3%83%83%E3%83%89%E3%82%A2%E3%83%97%E3%83%AA%E3%82%84%E3%82%B9%E3%83%9E%E3%83%BC%E3%83%88%E3%83%95%E3%82%A9%E3%83%B3%E5%90%91%E3%81%91web%E3%82%B5/ yorozuna 2015-02-27T01:53:47Z js javascript webdesign webデザイン web制作 画面遷移 <blockquote cite="https://www.moongift.jp/2015/02/navstack-js-%E3%83%8F%E3%82%A4%E3%83%96%E3%83%AA%E3%83%83%E3%83%89%E3%82%A2%E3%83%97%E3%83%AA%E3%82%84%E3%82%B9%E3%83%9E%E3%83%BC%E3%83%88%E3%83%95%E3%82%A9%E3%83%B3%E5%90%91%E3%81%91web%E3%82%B5/" title="Navstack.js - ハイブリッドアプリやスマートフォン向けWebサイトの画面遷移はこれにお任せ MOONGIFT"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fwww.moongift.jp%2F2015%2F02%2Fnavstack-js-%25E3%2583%258F%25E3%2582%25A4%25E3%2583%2596%25E3%2583%25AA%25E3%2583%2583%25E3%2583%2589%25E3%2582%25A2%25E3%2583%2597%25E3%2583%25AA%25E3%2582%2584%25E3%2582%25B9%25E3%2583%259E%25E3%2583%25BC%25E3%2583%2588%25E3%2583%2595%25E3%2582%25A9%25E3%2583%25B3%25E5%2590%2591%25E3%2581%2591web%25E3%2582%25B5%2F" alt="" /> <a href="https://www.moongift.jp/2015/02/navstack-js-%E3%83%8F%E3%82%A4%E3%83%96%E3%83%AA%E3%83%83%E3%83%89%E3%82%A2%E3%83%97%E3%83%AA%E3%82%84%E3%82%B9%E3%83%9E%E3%83%BC%E3%83%88%E3%83%95%E3%82%A9%E3%83%B3%E5%90%91%E3%81%91web%E3%82%B5/">Navstack.js - ハイブリッドアプリやスマートフォン向けWebサイトの画面遷移はこれにお任せ MOONGIFT</a></cite><p><a href="https://www.moongift.jp/2015/02/navstack-js-%E3%83%8F%E3%82%A4%E3%83%96%E3%83%AA%E3%83%83%E3%83%89%E3%82%A2%E3%83%97%E3%83%AA%E3%82%84%E3%82%B9%E3%83%9E%E3%83%BC%E3%83%88%E3%83%95%E3%82%A9%E3%83%B3%E5%90%91%E3%81%91web%E3%82%B5/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/f20dd4850c1704b2bedc40ad58ebb6f8f7d419e9/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fs3-ap-northeast-1.amazonaws.com%2Fmoongift%2Fattaches%2F13667%2Flist.%3F1424049614" alt="Navstack.js - ハイブリッドアプリやスマートフォン向けWebサイトの画面遷移はこれにお任せ MOONGIFT" title="Navstack.js - ハイブリッドアプリやスマートフォン向けWebサイトの画面遷移はこれにお任せ MOONGIFT" class="entry-image" /></a></p><p>スマートフォンのWebビューは従来に比べると遙かに進化していて、レンダリング速度やJavaScriptの実行速度も高速化しています。そんな中、ネイティブアプリとWebアプリの違いと言えば、画面遷移のアニメーションにあるのではないでしょうか。 上下左右から画面がスライドして表示されるのはやはりアプリならではといった...</p><p><a href="https://b.hatena.ne.jp/entry/s/www.moongift.jp/2015/02/navstack-js-%E3%83%8F%E3%82%A4%E3%83%96%E3%83%AA%E3%83%83%E3%83%89%E3%82%A2%E3%83%97%E3%83%AA%E3%82%84%E3%82%B9%E3%83%9E%E3%83%BC%E3%83%88%E3%83%95%E3%82%A9%E3%83%B3%E5%90%91%E3%81%91web%E3%82%B5/"><img src="https://b.hatena.ne.jp/entry/image/https://www.moongift.jp/2015/02/navstack-js-%E3%83%8F%E3%82%A4%E3%83%96%E3%83%AA%E3%83%83%E3%83%89%E3%82%A2%E3%83%97%E3%83%AA%E3%82%84%E3%82%B9%E3%83%9E%E3%83%BC%E3%83%88%E3%83%95%E3%82%A9%E3%83%B3%E5%90%91%E3%81%91web%E3%82%B5/" alt="はてなブックマーク - Navstack.js - ハイブリッドアプリやスマートフォン向けWebサイトの画面遷移はこれにお任せ MOONGIFT" title="はてなブックマーク - Navstack.js - ハイブリッドアプリやスマートフォン向けWebサイトの画面遷移はこれにお任せ MOONGIFT" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/www.moongift.jp/2015/02/navstack-js-%E3%83%8F%E3%82%A4%E3%83%96%E3%83%AA%E3%83%83%E3%83%89%E3%82%A2%E3%83%97%E3%83%AA%E3%82%84%E3%82%B9%E3%83%9E%E3%83%BC%E3%83%88%E3%83%95%E3%82%A9%E3%83%B3%E5%90%91%E3%81%91web%E3%82%B5/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 59 https://ozpa-h4.com/2015/02/23/matchheight-js/ yorozuna 2015-02-23T10:53:36Z js jQuery レスポンシブ javascript webデザイン webdesign web制作 height responsive 高さ揃え <blockquote cite="https://ozpa-h4.com/2015/02/23/matchheight-js/" title="横並びの要素の高さを揃えるjQueryプラグイン「matchHeight」がレスポンシブでもバッチリ動いて素敵"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fozpa-h4.com%2F2015%2F02%2F23%2Fmatchheight-js%2F" alt="" /> <a href="https://ozpa-h4.com/2015/02/23/matchheight-js/">横並びの要素の高さを揃えるjQueryプラグイン「matchHeight」がレスポンシブでもバッチリ動いて素敵</a></cite><p><a href="https://ozpa-h4.com/2015/02/23/matchheight-js/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/11f5a57098862a5757d35badec8ff2964c545eff/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fozpa-h4.com%2Fwp-content%2Fuploads%2F2015%2F02%2F150223-matchHeight-011.jpg" alt="横並びの要素の高さを揃えるjQueryプラグイン「matchHeight」がレスポンシブでもバッチリ動いて素敵" title="横並びの要素の高さを揃えるjQueryプラグイン「matchHeight」がレスポンシブでもバッチリ動いて素敵" class="entry-image" /></a></p><p>高さが異なる要素を横並びにした時に、その高さを揃えたい–生きとし生けるもの全ての夢。 でまぁ今までとあるプラグインを利用していたのですが、レスポンシブで上手く動かないということでなんかいいやつ無いんかい、と探していたところjquery.matchHeight.jsというのを見つけました。 jquery.matchHeight.js – a more ...</p><p><a href="https://b.hatena.ne.jp/entry/s/ozpa-h4.com/2015/02/23/matchheight-js/"><img src="https://b.hatena.ne.jp/entry/image/https://ozpa-h4.com/2015/02/23/matchheight-js/" alt="はてなブックマーク - 横並びの要素の高さを揃えるjQueryプラグイン「matchHeight」がレスポンシブでもバッチリ動いて素敵" title="はてなブックマーク - 横並びの要素の高さを揃えるjQueryプラグイン「matchHeight」がレスポンシブでもバッチリ動いて素敵" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/ozpa-h4.com/2015/02/23/matchheight-js/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 158 https://hail2u.net/blog/webdesign/scrollbar-width yorozuna 2015-02-20T02:45:57Z ScrollBar webdesign webデザイン web制作 スクロールバー calc css javascript html tips <blockquote cite="https://hail2u.net/blog/webdesign/scrollbar-width" title="スクロールバーの幅"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fhail2u.net%2Fblog%2Fwebdesign%2Fscrollbar-width" alt="" /> <a href="https://hail2u.net/blog/webdesign/scrollbar-width">スクロールバーの幅</a></cite><p><a href="https://hail2u.net/blog/webdesign/scrollbar-width"><img src="" alt="スクロールバーの幅" title="スクロールバーの幅" class="entry-image" /></a></p><p>スクロールバーの幅を知りたいことはままある。CSSで拾えれば最高なのだけど……というところで、calc(100vw - 100%)で拾えることがわかった。ただこれで拾えるかどうかはその要素の親に依存するので、いつでもどこでも使えるわけではない。せめてJavaScriptでは扱えるようにしてみたい。 Demo: Get Scrollbar Width with ...</p><p><a href="https://b.hatena.ne.jp/entry/s/hail2u.net/blog/webdesign/scrollbar-width"><img src="https://b.hatena.ne.jp/entry/image/https://hail2u.net/blog/webdesign/scrollbar-width" alt="はてなブックマーク - スクロールバーの幅" title="はてなブックマーク - スクロールバーの幅" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/hail2u.net/blog/webdesign/scrollbar-width"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 43 https://ics.media/entry/4095 yorozuna 2014-12-17T17:27:13Z html5 html gps API アプリ Javascript iOS Android SmartPhone スマートフォン <blockquote cite="https://ics.media/entry/4095" title="スマートフォンはセンサーの塊！ たった数行のHTML5とJSで扱えるセンサーまとめ(デモ・動画あり) – ICS MEDIA"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fics.media%2Fentry%2F4095" alt="" /> <a href="https://ics.media/entry/4095">スマートフォンはセンサーの塊！ たった数行のHTML5とJSで扱えるセンサーまとめ(デモ・動画あり) – ICS MEDIA</a></cite><p><a href="https://ics.media/entry/4095"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/408735d379c00604317e6d863477fe0c573e3161/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fics.media%2F_assets%2Ftop%2Ffacebook_opg_image.png" alt="スマートフォンはセンサーの塊！ たった数行のHTML5とJSで扱えるセンサーまとめ(デモ・動画あり) – ICS MEDIA" title="スマートフォンはセンサーの塊！ たった数行のHTML5とJSで扱えるセンサーまとめ(デモ・動画あり) – ICS MEDIA" class="entry-image" /></a></p><p>View Transitions API入門 - 連続性のある画面遷移アニメーションを実現するウェブの新技術 10月15日更新池田 泰延♥ 142</p><p><a href="https://b.hatena.ne.jp/entry/s/ics.media/entry/4095"><img src="https://b.hatena.ne.jp/entry/image/https://ics.media/entry/4095" alt="はてなブックマーク - スマートフォンはセンサーの塊！ たった数行のHTML5とJSで扱えるセンサーまとめ(デモ・動画あり) – ICS MEDIA" title="はてなブックマーク - スマートフォンはセンサーの塊！ たった数行のHTML5とJSで扱えるセンサーまとめ(デモ・動画あり) – ICS MEDIA" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/ics.media/entry/4095"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 102 https://yoppa.org/taumedia10/2065.html yorozuna 2014-12-14T17:03:05Z canvas javascript Web Tips tutorial HTML5 チュートリアル web制作 <blockquote cite="https://yoppa.org/taumedia10/2065.html" title="canvas要素 + Javascriptで作る、動的コンテンツ"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fyoppa.org%2Ftaumedia10%2F2065.html" alt="" /> <a href="https://yoppa.org/taumedia10/2065.html">canvas要素 + Javascriptで作る、動的コンテンツ</a></cite><p><a href="https://yoppa.org/taumedia10/2065.html"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/43c0c41ee32ae7dbaf55c33d2221ad79a1ead58c/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fi0.wp.com%2Fyoppa.org%2Fwp-content%2Fuploads%2F2024%2F10%2Fcropped-yoppa.jpg%3Ffit%3D512%252C512%26ssl%3D1" alt="canvas要素 + Javascriptで作る、動的コンテンツ" title="canvas要素 + Javascriptで作る、動的コンテンツ" class="entry-image" /></a></p><p>HTML 5 + Javascriptで作る動的なコンテンツ 前回の授業では、HTML 5について、その成り立ちや特徴を解説した上で、新しい構造化のための要素について解説しました。また、あわせてCSS3によって格段に進歩した表現力について実際にサンプルページを作りながら解説しました。 今までは、Webページで動的に図や画像やアニ...</p><p><a href="https://b.hatena.ne.jp/entry/s/yoppa.org/taumedia10/2065.html"><img src="https://b.hatena.ne.jp/entry/image/https://yoppa.org/taumedia10/2065.html" alt="はてなブックマーク - canvas要素 + Javascriptで作る、動的コンテンツ" title="はてなブックマーク - canvas要素 + Javascriptで作る、動的コンテンツ" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/yoppa.org/taumedia10/2065.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 204 https://codezine.jp/article/detail/7903 yorozuna 2014-09-19T06:14:00Z canvas jQuery html5 javascript webデザイン webdesign web制作 <blockquote cite="https://codezine.jp/article/detail/7903" title="HTML5 CanvasをjQueryライクに操作できるプラグイン「jCanvas」"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fcodezine.jp%2Farticle%2Fdetail%2F7903" alt="" /> <a href="https://codezine.jp/article/detail/7903">HTML5 CanvasをjQueryライクに操作できるプラグイン「jCanvas」</a></cite><p><a href="https://codezine.jp/article/detail/7903"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/0dde4cdb5a19759080c81a18a1750c7fe9da1944/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fcodezine.jp%2Fstatic%2Fimages%2Farticle%2F7903%2F7903_arena.png" alt="HTML5 CanvasをjQueryライクに操作できるプラグイン「jCanvas」" title="HTML5 CanvasをjQueryライクに操作できるプラグイン「jCanvas」" class="entry-image" /></a></p><p>はじめに HTML5において追加されたCanvasは、HTMLとJavaScriptを用いてWebページ内に図形や線などを描画できる機能で、動画や音楽を再生するvideoタグやaudioタグなどとともに、HTML5の代表的な機能としてしばしば紹介されます。 Canvas機能を用いるとHTMLのcanvas要素で定義された領域に対してJavaScriptで描画処理を行...</p><p><a href="https://b.hatena.ne.jp/entry/s/codezine.jp/article/detail/7903"><img src="https://b.hatena.ne.jp/entry/image/https://codezine.jp/article/detail/7903" alt="はてなブックマーク - HTML5 CanvasをjQueryライクに操作できるプラグイン「jCanvas」" title="はてなブックマーク - HTML5 CanvasをjQueryライクに操作できるプラグイン「jCanvas」" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/codezine.jp/article/detail/7903"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 85 http://f-site.org/articles/2014/07/30100000.html yorozuna 2014-08-01T02:28:46Z 理論 プログラミング アニメーション javascript programming algorithm math 数学 web制作 3D <blockquote cite="http://f-site.org/articles/2014/07/30100000.html" title="数学を使ったJavaScriptコーディング"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Ff-site.org%2Farticles%2F2014%2F07%2F30100000.html" alt="" /> <a href="http://f-site.org/articles/2014/07/30100000.html">数学を使ったJavaScriptコーディング</a></cite><p><a href="http://f-site.org/articles/2014/07/30100000.html"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/47b951f1b201e669111862cd81e3c37800a31143/backend=imagemagick;height=90;version=1;width=120/http%3A%2F%2Ff-site.org%2Fogp_2013.jpg" alt="数学を使ったJavaScriptコーディング" title="数学を使ったJavaScriptコーディング" class="entry-image" /></a></p><p>幾何学的な計算や物理運動を表すには、数学の知識が求められます。もっとも、計算は必ずしも難しい訳ではありません。考え方さえわかれば、応用できることが多いです。ここでは、一見難しそうなベクトルの外積と微分のふたつについて、その使い途と考え方をリンクでご紹介します。また、ビデオ映像やjsdo.itのサンプルも...</p><p><a href="https://b.hatena.ne.jp/entry/f-site.org/articles/2014/07/30100000.html"><img src="https://b.hatena.ne.jp/entry/image/http://f-site.org/articles/2014/07/30100000.html" alt="はてなブックマーク - 数学を使ったJavaScriptコーディング" title="はてなブックマーク - 数学を使ったJavaScriptコーディング" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/f-site.org/articles/2014/07/30100000.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 59 https://uhyohyo.net/javascript/ yorozuna 2014-07-28T04:24:30Z Javascript web制作 まとめ programming learning 学習 基本 JS tutorial <blockquote cite="https://uhyohyo.net/javascript/" title="JavaScript初級者から中級者になろう — uhyohyo.net"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fuhyohyo.net%2Fjavascript%2F" alt="" /> <a href="https://uhyohyo.net/javascript/">JavaScript初級者から中級者になろう — uhyohyo.net</a></cite><p><a href="https://uhyohyo.net/javascript/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/dd7c18ae7334d86d4677bda327b53092ee33506b/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fuhyohyo.net%2Fimages%2Ficons%2F144x144.png" alt="JavaScript初級者から中級者になろう — uhyohyo.net" title="JavaScript初級者から中級者になろう — uhyohyo.net" class="entry-image" /></a></p><p>このページの最終更新日：2019年7月4日 JavaScript。主にWebページを作るのに使われるほか、現在ではさまざまなところで活躍しているプログラミング言語です。 このページはJavaScriptの中級講座です。最新鋭ではないかもしれませんが、読み進めれば大抵のものを自分で作れるようになることでしょう。 言い訳とJavaScrip...</p><p><a href="https://b.hatena.ne.jp/entry/s/uhyohyo.net/javascript/"><img src="https://b.hatena.ne.jp/entry/image/https://uhyohyo.net/javascript/" alt="はてなブックマーク - JavaScript初級者から中級者になろう — uhyohyo.net" title="はてなブックマーク - JavaScript初級者から中級者になろう — uhyohyo.net" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/uhyohyo.net/javascript/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 1667 https://alvarotrigo.com/fullPage/ yorozuna 2014-07-15T03:23:06Z scroll fullscreen javascript jQuery jQueryプラグイン webdesign webデザイン web制作 UI <blockquote cite="https://alvarotrigo.com/fullPage/" title="fullPage scroll snapping. Create full screen pages fast and simple"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Falvarotrigo.com%2FfullPage%2F" alt="" /> <a href="https://alvarotrigo.com/fullPage/">fullPage scroll snapping. Create full screen pages fast and simple</a></cite><p><a href="https://alvarotrigo.com/fullPage/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/61e0add8d1d9240ac92423f4148b7dab266d9bca/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fraw.github.com%2Falvarotrigo%2FfullPage.js%2Fmaster%2Fexamples%2Fimgs%2Fintro.png" alt="fullPage scroll snapping. Create full screen pages fast and simple" title="fullPage scroll snapping. Create full screen pages fast and simple" class="entry-image" /></a></p><p>The Best Solution for Full-Page DesignSave Hours of Development Time with FullPage.js – Create Beautiful Fullscreen Scrolling Websites in minutes, not weeks.</p><p><a href="https://b.hatena.ne.jp/entry/s/alvarotrigo.com/fullPage/"><img src="https://b.hatena.ne.jp/entry/image/https://alvarotrigo.com/fullPage/" alt="はてなブックマーク - fullPage scroll snapping. Create full screen pages fast and simple" title="はてなブックマーク - fullPage scroll snapping. Create full screen pages fast and simple" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/alvarotrigo.com/fullPage/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 169