https://b.hatena.ne.jp/level-one/JavaScript/ JavaScriptに関するlevel-oneのはてなブックマーク (43) https://coliss.com/articles/build-websites/operation/javascript/js-stickerjs.html level-one 2014-02-18T05:46:11Z webデザイン js Javascript デザイン アニメーション html CSS *あとで読む 118 <blockquote cite="https://coliss.com/articles/build-websites/operation/javascript/js-stickerjs.html" title="[JS]このホバーエフェクト楽しい！シールのようにぺらっとめくるスクリプト -Sticker.js"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fcoliss.com%2Farticles%2Fbuild-websites%2Foperation%2Fjavascript%2Fjs-stickerjs.html" alt="" /> <a href="https://coliss.com/articles/build-websites/operation/javascript/js-stickerjs.html">[JS]このホバーエフェクト楽しい！シールのようにぺらっとめくるスクリプト -Sticker.js</a></cite><p><a href="https://coliss.com/articles/build-websites/operation/javascript/js-stickerjs.html"><img src="" alt="[JS]このホバーエフェクト楽しい！シールのようにぺらっとめくるスクリプト -Sticker.js" title="[JS]このホバーエフェクト楽しい！シールのようにぺらっとめくるスクリプト -Sticker.js" class="entry-image" /></a></p><p>写真画像やアイコンなどを配置したベタ塗りのボタンなどをサークル状にし、ホバーするとシールのようにぺらっとめくれるようにするスクリプトを紹介します。 実装は非常に簡単で、jQueryなどの他のスクリプトは必要ありません。 Sticker.js Sticker.js -GitHub Sticker.jsのデモ Sticker.jsの使い方 Sticker.jsのデモ デ...</p><p><a href="https://b.hatena.ne.jp/entry/s/coliss.com/articles/build-websites/operation/javascript/js-stickerjs.html"><img src="https://b.hatena.ne.jp/entry/image/https://coliss.com/articles/build-websites/operation/javascript/js-stickerjs.html" alt="はてなブックマーク - [JS]このホバーエフェクト楽しい！シールのようにぺらっとめくるスクリプト -Sticker.js" title="はてなブックマーク - [JS]このホバーエフェクト楽しい！シールのようにぺらっとめくるスクリプト -Sticker.js" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/coliss.com/articles/build-websites/operation/javascript/js-stickerjs.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> http://zxcvbnmnbvcxz.com/demonstration/bxslide.html level-one 2013-12-03T00:00:41Z スライドショー スライド webデザイン slide slider jQuery JavaScript スライダー あとでよむ 51 <blockquote cite="http://zxcvbnmnbvcxz.com/demonstration/bxslide.html" title="jQuery 簡単かつ高性能なスライダー【bxslider】の設置 – Divスライド系の中では一番のオススメです。"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Fzxcvbnmnbvcxz.com%2Fdemonstration%2Fbxslide.html" alt="" /> <a href="http://zxcvbnmnbvcxz.com/demonstration/bxslide.html">jQuery 簡単かつ高性能なスライダー【bxslider】の設置 – Divスライド系の中では一番のオススメです。</a></cite><p><a href="http://zxcvbnmnbvcxz.com/demonstration/bxslide.html"><img src="" alt="jQuery 簡単かつ高性能なスライダー【bxslider】の設置 – Divスライド系の中では一番のオススメです。" title="jQuery 簡単かつ高性能なスライダー【bxslider】の設置 – Divスライド系の中では一番のオススメです。" class="entry-image" /></a></p><p>&lt;h1 class=&quot;ex1&quot;&gt;example1&lt;/h1&gt; &lt;script type=&quot;text/javascript&quot;&gt; $(document).ready(function(){ $(&#39;#slider1&#39;).bxSlider(); }); &lt;/script&gt; &lt;div id=&quot;slider1&quot;&gt; &lt;div&gt;&lt;img src=&quot;images/slide1.png&quot; width=&quot;300px&quot;&gt;&lt;/div&gt; &lt;div&gt;&lt;img src=&quot;images/slide2.png&quot; width=&quot;300px&quot;&gt;&lt;/div&gt; &lt;div&gt;&lt;img src=&quot;images/slide3.png&quot; wi...</p><p><a href="https://b.hatena.ne.jp/entry/zxcvbnmnbvcxz.com/demonstration/bxslide.html"><img src="https://b.hatena.ne.jp/entry/image/http://zxcvbnmnbvcxz.com/demonstration/bxslide.html" alt="はてなブックマーク - jQuery 簡単かつ高性能なスライダー【bxslider】の設置 – Divスライド系の中では一番のオススメです。" title="はてなブックマーク - jQuery 簡単かつ高性能なスライダー【bxslider】の設置 – Divスライド系の中では一番のオススメです。" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/zxcvbnmnbvcxz.com/demonstration/bxslide.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://www.100shiki.com/archives/2013/11/creditcard_js.html level-one 2013-11-09T17:18:45Z *あとで読む *web制作 javascript jQuery js 94 <blockquote cite="https://www.100shiki.com/archives/2013/11/creditcard_js.html" title="正しいクレジットカードの入力フォームを提供『Creditcard.js』 | 100SHIKI"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fwww.100shiki.com%2Farchives%2F2013%2F11%2Fcreditcard_js.html" alt="" /> <a href="https://www.100shiki.com/archives/2013/11/creditcard_js.html">正しいクレジットカードの入力フォームを提供『Creditcard.js』 | 100SHIKI</a></cite><p><a href="https://www.100shiki.com/archives/2013/11/creditcard_js.html"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/0265fa6ea3244df7938d0750810eaaf9e694ae2c/backend=imagemagick;height=90;version=1;width=120/http%3A%2F%2Fwww.100shiki.com%2Fdocs%2F201311%2F09_logo.gif" alt="正しいクレジットカードの入力フォームを提供『Creditcard.js』 | 100SHIKI" title="正しいクレジットカードの入力フォームを提供『Creditcard.js』 | 100SHIKI" class="entry-image" /></a></p><p>かなりニッチだが、逆にそれがいいですな。 Creditcard.jsでは、クレジットカードを入力させるフォームを提供している。 興味深いのは、「今までのフォームのここがだめだ」と提唱している点だ。 たしかに読み進めていくと（細かい点ではあるが）普通のフォームだと改善の余地があることがわかる。 このライブラリを使う...</p><p><a href="https://b.hatena.ne.jp/entry/s/www.100shiki.com/archives/2013/11/creditcard_js.html"><img src="https://b.hatena.ne.jp/entry/image/https://www.100shiki.com/archives/2013/11/creditcard_js.html" alt="はてなブックマーク - 正しいクレジットカードの入力フォームを提供『Creditcard.js』 | 100SHIKI" title="はてなブックマーク - 正しいクレジットカードの入力フォームを提供『Creditcard.js』 | 100SHIKI" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/www.100shiki.com/archives/2013/11/creditcard_js.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://stocker.jp/diary/japan-map-css/ level-one 2013-10-01T01:32:10Z JavaScript web制作 css html 地図 画像 デザイン あとで読む 329 <blockquote cite="https://stocker.jp/diary/japan-map-css/" title="JavaScriptなしで地域ごとに色が変わる日本地図を作る"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fstocker.jp%2Fdiary%2Fjapan-map-css%2F" alt="" /> <a href="https://stocker.jp/diary/japan-map-css/">JavaScriptなしで地域ごとに色が変わる日本地図を作る</a></cite><p><a href="https://stocker.jp/diary/japan-map-css/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/f48338a314c37ece01b5942100bbe213cf893807/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fs0.wp.com%2Fi%2Fblank.jpg" alt="JavaScriptなしで地域ごとに色が変わる日本地図を作る" title="JavaScriptなしで地域ごとに色が変わる日本地図を作る" class="entry-image" /></a></p><p>HTML、CSS、画像だけで、マウスオーバーした地域ごとに色が変わる日本地図を作る方法です。 文字だけではちょっと意味がわかりにくいかもしれませんので、とりあえず↓の日本地図の上にマウスカーソルを載せてみてください。クリックするとページ遷移しますが、このデモでは Not Found になりますのでご注意ください。 デ...</p><p><a href="https://b.hatena.ne.jp/entry/s/stocker.jp/diary/japan-map-css/"><img src="https://b.hatena.ne.jp/entry/image/https://stocker.jp/diary/japan-map-css/" alt="はてなブックマーク - JavaScriptなしで地域ごとに色が変わる日本地図を作る" title="はてなブックマーク - JavaScriptなしで地域ごとに色が変わる日本地図を作る" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/stocker.jp/diary/japan-map-css/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://gigazine.net/news/20130819-cookieless-cookie/ level-one 2013-08-19T12:43:48Z IPアドレス ip JavaScript web制作 セキュリティ ブラウザ Cookie security Web アクセス 511 <blockquote cite="https://gigazine.net/news/20130819-cookieless-cookie/" title="IPアドレス・クッキー・JavaScript・UAなどを使わずユーザーを個別に追跡する方法"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fgigazine.net%2Fnews%2F20130819-cookieless-cookie%2F" alt="" /> <a href="https://gigazine.net/news/20130819-cookieless-cookie/">IPアドレス・クッキー・JavaScript・UAなどを使わずユーザーを個別に追跡する方法</a></cite><p><a href="https://gigazine.net/news/20130819-cookieless-cookie/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/4b085fcfc9756690338c93eb284f671814d77e81/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fi.gzn.jp%2Fimg%2F2013%2F08%2F19%2Fcookieless-cookie%2F5645005367_6d33734720_o.jpg" alt="IPアドレス・クッキー・JavaScript・UAなどを使わずユーザーを個別に追跡する方法" title="IPアドレス・クッキー・JavaScript・UAなどを使わずユーザーを個別に追跡する方法" class="entry-image" /></a></p><p>by Vernon Swanepoel ウェブサイトのユーザーがどれぐらいページを見てくれているのか、訪問頻度はどれぐらいなのかといった情報を追跡するのにはクッキー(Cookie)やJavaScriptなどが使用されますが、そうやって追跡されるのがイヤだということでCookieを受け入れないように設定したり、JavaScriptをオフにしているとい...</p><p><a href="https://b.hatena.ne.jp/entry/s/gigazine.net/news/20130819-cookieless-cookie/"><img src="https://b.hatena.ne.jp/entry/image/https://gigazine.net/news/20130819-cookieless-cookie/" alt="はてなブックマーク - IPアドレス・クッキー・JavaScript・UAなどを使わずユーザーを個別に追跡する方法" title="はてなブックマーク - IPアドレス・クッキー・JavaScript・UAなどを使わずユーザーを個別に追跡する方法" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/gigazine.net/news/20130819-cookieless-cookie/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://bashalog.c-brains.jp/09/08/28-200143.php level-one 2012-12-25T03:22:26Z jQuery フォーム validation ライブラリ web制作 javascript css js jquery form 75 <blockquote cite="https://bashalog.c-brains.jp/09/08/28-200143.php" title="リアルタイムに入力チェック - jQuery Inline Form Validation Engine - | バシャログ。"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fbashalog.c-brains.jp%2F09%2F08%2F28-200143.php" alt="" /> <a href="https://bashalog.c-brains.jp/09/08/28-200143.php">リアルタイムに入力チェック - jQuery Inline Form Validation Engine - | バシャログ。</a></cite><p><a href="https://bashalog.c-brains.jp/09/08/28-200143.php"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/158a97c003953ad5fab6599ffc3d0e81136d1c08/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fbashalog.c-brains.jp%2Fimages%2Fcat_javascript.png" alt="リアルタイムに入力チェック - jQuery Inline Form Validation Engine - | バシャログ。" title="リアルタイムに入力チェック - jQuery Inline Form Validation Engine - | バシャログ。" class="entry-image" /></a></p><p>こんにちは、nakamura です。すっかり秋めいてきましたね。みなさんの今年の夏の思い出は何だったでしょうか。僕の思い出は叔父がやっている家庭菜園で膨大な量のきゅうりが取れてしまい、家のおかずが2週間ほどきゅうりづくしだった事でしょうか。自分、鈴虫かと思いました。 とあるプロジェクトで、入力フォームのバリ...</p><p><a href="https://b.hatena.ne.jp/entry/s/bashalog.c-brains.jp/09/08/28-200143.php"><img src="https://b.hatena.ne.jp/entry/image/https://bashalog.c-brains.jp/09/08/28-200143.php" alt="はてなブックマーク - リアルタイムに入力チェック - jQuery Inline Form Validation Engine - | バシャログ。" title="はてなブックマーク - リアルタイムに入力チェック - jQuery Inline Form Validation Engine - | バシャログ。" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/bashalog.c-brains.jp/09/08/28-200143.php"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://coliss.com/articles/build-websites/operation/work/framework-chocolatechip-ui-for-ios5.html level-one 2012-08-20T07:10:34Z ui スマートフォン サイト フレームワーク アイコン JavaScript iOS ios5 スライダー キャプチャ 247 <blockquote cite="https://coliss.com/articles/build-websites/operation/work/framework-chocolatechip-ui-for-ios5.html" title="スマフォ用サイトでよく使うエレメントが豊富に揃ってるフレームワーク -ChocolateChip-UI"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fcoliss.com%2Farticles%2Fbuild-websites%2Foperation%2Fwork%2Fframework-chocolatechip-ui-for-ios5.html" alt="" /> <a href="https://coliss.com/articles/build-websites/operation/work/framework-chocolatechip-ui-for-ios5.html">スマフォ用サイトでよく使うエレメントが豊富に揃ってるフレームワーク -ChocolateChip-UI</a></cite><p><a href="https://coliss.com/articles/build-websites/operation/work/framework-chocolatechip-ui-for-ios5.html"><img src="" alt="スマフォ用サイトでよく使うエレメントが豊富に揃ってるフレームワーク -ChocolateChip-UI" title="スマフォ用サイトでよく使うエレメントが豊富に揃ってるフレームワーク -ChocolateChip-UI" class="entry-image" /></a></p><p>スマートフォンなどのモバイル用サイトを簡単に制作できるようにするJavaScriptベースのフレームワークを紹介します。 先日リリースされたiOS5にも最適化されています。 ChocolateChip-UI [ad#ad-2] ChocolateChip-UIで用意されているエレメント あらかじめ用意されているエレメントは数多くあります。 ツールバー ナビ...</p><p><a href="https://b.hatena.ne.jp/entry/s/coliss.com/articles/build-websites/operation/work/framework-chocolatechip-ui-for-ios5.html"><img src="https://b.hatena.ne.jp/entry/image/https://coliss.com/articles/build-websites/operation/work/framework-chocolatechip-ui-for-ios5.html" alt="はてなブックマーク - スマフォ用サイトでよく使うエレメントが豊富に揃ってるフレームワーク -ChocolateChip-UI" title="はてなブックマーク - スマフォ用サイトでよく使うエレメントが豊富に揃ってるフレームワーク -ChocolateChip-UI" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/coliss.com/articles/build-websites/operation/work/framework-chocolatechip-ui-for-ios5.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://nskw-style.com/2011/jquery/graph-visualize-jquery-plugin.html level-one 2012-05-18T00:17:13Z グラフ jquery プラグイン graph jQueryプラグイン javascript 654 <blockquote cite="https://nskw-style.com/2011/jquery/graph-visualize-jquery-plugin.html" title="グラフを描画してくれるjQueryプラグインは、多分”jQuery Visualize”がベスト！ - Shinichi Nishikawa&#39;s"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fnskw-style.com%2F2011%2Fjquery%2Fgraph-visualize-jquery-plugin.html" alt="" /> <a href="https://nskw-style.com/2011/jquery/graph-visualize-jquery-plugin.html">グラフを描画してくれるjQueryプラグインは、多分”jQuery Visualize”がベスト！ - Shinichi Nishikawa&#39;s</a></cite><p><a href="https://nskw-style.com/2011/jquery/graph-visualize-jquery-plugin.html"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/17b5fa2648174c1dc424aec990a07db5abd9360b/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fnskw-style.com%2Fwp-content%2Fuploads%2F2011%2F10%2Fjq.png" alt="グラフを描画してくれるjQueryプラグインは、多分”jQuery Visualize”がベスト！ - Shinichi Nishikawa&#39;s" title="グラフを描画してくれるjQueryプラグインは、多分”jQuery Visualize”がベスト！ - Shinichi Nishikawa&#39;s" class="entry-image" /></a></p><p>グラフを描画してくれるjQueryプラグインは、多分”jQuery Visualize”がベスト！ 2011 10/11 グラフを描画してくれるjQueryプラグインを紹介します。 グラフを動的に作ってくれるものとしては、他のjQueryプラグインやGoogle Chartというサービスなどがあります。 が、今回の”jQuery Visualize”は、中でも一番使いやすそ...</p><p><a href="https://b.hatena.ne.jp/entry/s/nskw-style.com/2011/jquery/graph-visualize-jquery-plugin.html"><img src="https://b.hatena.ne.jp/entry/image/https://nskw-style.com/2011/jquery/graph-visualize-jquery-plugin.html" alt="はてなブックマーク - グラフを描画してくれるjQueryプラグインは、多分”jQuery Visualize”がベスト！ - Shinichi Nishikawa&#39;s" title="はてなブックマーク - グラフを描画してくれるjQueryプラグインは、多分”jQuery Visualize”がベスト！ - Shinichi Nishikawa&#39;s" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/nskw-style.com/2011/jquery/graph-visualize-jquery-plugin.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://coliss.com/articles/build-websites/operation/javascript/jquery-tutorial-slideshow-with-jmpress-js.html level-one 2012-04-09T14:04:58Z スライドショー チュートリアル スライド js slideshow jQuery javascript 297 <blockquote cite="https://coliss.com/articles/build-websites/operation/javascript/jquery-tutorial-slideshow-with-jmpress-js.html" title="[JS]かなりかっこいいアニメーションを使ったスライドショーを実装するチュートリアル"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fcoliss.com%2Farticles%2Fbuild-websites%2Foperation%2Fjavascript%2Fjquery-tutorial-slideshow-with-jmpress-js.html" alt="" /> <a href="https://coliss.com/articles/build-websites/operation/javascript/jquery-tutorial-slideshow-with-jmpress-js.html">[JS]かなりかっこいいアニメーションを使ったスライドショーを実装するチュートリアル</a></cite><p><a href="https://coliss.com/articles/build-websites/operation/javascript/jquery-tutorial-slideshow-with-jmpress-js.html"><img src="" alt="[JS]かなりかっこいいアニメーションを使ったスライドショーを実装するチュートリアル" title="[JS]かなりかっこいいアニメーションを使ったスライドショーを実装するチュートリアル" class="entry-image" /></a></p><p>スライドを単に次々と見せるだけでなく、切り替わる時に3Dのダイナミックでかっこいいエフェクトを与えたスライドショーを実装するチュートリアルを紹介します。 Slideshow with jmpress.js [ad#ad-2] デモ 実装 デモ まずは、そのダイナミックな3Dのアニメーションをご覧ください。 スライドは5枚あり、それぞれアニメ...</p><p><a href="https://b.hatena.ne.jp/entry/s/coliss.com/articles/build-websites/operation/javascript/jquery-tutorial-slideshow-with-jmpress-js.html"><img src="https://b.hatena.ne.jp/entry/image/https://coliss.com/articles/build-websites/operation/javascript/jquery-tutorial-slideshow-with-jmpress-js.html" alt="はてなブックマーク - [JS]かなりかっこいいアニメーションを使ったスライドショーを実装するチュートリアル" title="はてなブックマーク - [JS]かなりかっこいいアニメーションを使ったスライドショーを実装するチュートリアル" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/coliss.com/articles/build-websites/operation/javascript/jquery-tutorial-slideshow-with-jmpress-js.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> http://thiagosf.net/projects/jquery/skitter/ level-one 2012-03-06T08:10:29Z jQuery エフェクト slideshow プラグイン スライドショー スライダー plugin jQuery javascript 95 <blockquote cite="http://thiagosf.net/projects/jquery/skitter/" title="Skitter • Slideshow for anytime"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Fthiagosf.net%2Fprojects%2Fjquery%2Fskitter%2F" alt="" /> <a href="http://thiagosf.net/projects/jquery/skitter/">Skitter • Slideshow for anytime</a></cite><p><a href="http://thiagosf.net/projects/jquery/skitter/"><img src="" alt="Skitter • Slideshow for anytime" title="Skitter • Slideshow for anytime" class="entry-image" /></a></p><p>And after a long time, a new version of Skitter, now responsive. Image credits</p><p><a href="https://b.hatena.ne.jp/entry/thiagosf.net/projects/jquery/skitter/"><img src="https://b.hatena.ne.jp/entry/image/http://thiagosf.net/projects/jquery/skitter/" alt="はてなブックマーク - Skitter • Slideshow for anytime" title="はてなブックマーク - Skitter • Slideshow for anytime" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/thiagosf.net/projects/jquery/skitter/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://coliss.com/articles/build-websites/operation/javascript/js-jsmorph.html level-one 2012-03-06T07:58:01Z jQuery jQuery web制作 JavaScript プラグイン アニメーション ライブラリ js 275 <blockquote cite="https://coliss.com/articles/build-websites/operation/javascript/js-jsmorph.html" title="[JS]多彩なアニメーションが実装できる2.3KBの超軽量スクリプト -jsMorph"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fcoliss.com%2Farticles%2Fbuild-websites%2Foperation%2Fjavascript%2Fjs-jsmorph.html" alt="" /> <a href="https://coliss.com/articles/build-websites/operation/javascript/js-jsmorph.html">[JS]多彩なアニメーションが実装できる2.3KBの超軽量スクリプト -jsMorph</a></cite><p><a href="https://coliss.com/articles/build-websites/operation/javascript/js-jsmorph.html"><img src="" alt="[JS]多彩なアニメーションが実装できる2.3KBの超軽量スクリプト -jsMorph" title="[JS]多彩なアニメーションが実装できる2.3KBの超軽量スクリプト -jsMorph" class="entry-image" /></a></p><p>Tutorial demos さまざまな基本となるアニメーションのユニット集。 [ad#ad-2] jsMorphの実装 外部ファイル 当スクリプトを外部ファイルとして指定します。 &lt;script src=&quot;js/jsMorph_min.js&quot; type=&quot;text/javascript&quot;&gt;&lt;/script&gt; JavaScript jsMorphの基本書式です。 var myMorph = jsMorph( Object obj, // HTML element,...</p><p><a href="https://b.hatena.ne.jp/entry/s/coliss.com/articles/build-websites/operation/javascript/js-jsmorph.html"><img src="https://b.hatena.ne.jp/entry/image/https://coliss.com/articles/build-websites/operation/javascript/js-jsmorph.html" alt="はてなブックマーク - [JS]多彩なアニメーションが実装できる2.3KBの超軽量スクリプト -jsMorph" title="はてなブックマーク - [JS]多彩なアニメーションが実装できる2.3KBの超軽量スクリプト -jsMorph" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/coliss.com/articles/build-websites/operation/javascript/js-jsmorph.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://slidedeck.com/ level-one 2012-03-06T07:54:09Z web制作 webdesign jquery jQuery スライダー javascript webデザイン simple 130 <blockquote cite="https://slidedeck.com/" title="Responsive WordPress Slider Plugin"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fslidedeck.com%2F" alt="" /> <a href="https://slidedeck.com/">Responsive WordPress Slider Plugin</a></cite><p><a href="https://slidedeck.com/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/1235ddba8306b9ec57b330882e6e73511cc5cbc8/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fslidedeck.com%2Fwp-content%2Fuploads%2F2020%2F03%2Fimage3-1.png" alt="Responsive WordPress Slider Plugin" title="Responsive WordPress Slider Plugin" class="entry-image" /></a></p><p>SlideDeck enables you to build stunning content sliders for your WordPress site without any coding. Add images, text and video, embed your own custom HTML, or even dynamically pull content from your favorite sources, like Instagram, YouTube or RSS feeds.</p><p><a href="https://b.hatena.ne.jp/entry/s/slidedeck.com/"><img src="https://b.hatena.ne.jp/entry/image/https://slidedeck.com/" alt="はてなブックマーク - Responsive WordPress Slider Plugin" title="はてなブックマーク - Responsive WordPress Slider Plugin" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/slidedeck.com/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://www.codecademy.com/ level-one 2012-03-02T02:00:07Z code IT js education programming プログラミング Webサービス 勉強 javascript study 2036 <blockquote cite="https://www.codecademy.com/" title="Learn to Code - for Free | Codecademy"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fwww.codecademy.com%2F" alt="" /> <a href="https://www.codecademy.com/">Learn to Code - for Free | Codecademy</a></cite><p><a href="https://www.codecademy.com/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/40028d3edcb96c5b86ee6bd68f86a3f18af94ffe/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fimages.codecademy.com%2Fsocial%2Flogo-codecademy-social.png" alt="Learn to Code - for Free | Codecademy" title="Learn to Code - for Free | Codecademy" class="entry-image" /></a></p><p>Grow in your career and unlock new opportunities by learning in-demand skills in AI, data, coding, cybersecurity, and more. Transform your team with Codecademy Teams trainingHelp everyone on your team build job-ready skills with a plan that offers flexible content assignment, progress tracking, a...</p><p><a href="https://b.hatena.ne.jp/entry/s/www.codecademy.com/"><img src="https://b.hatena.ne.jp/entry/image/https://www.codecademy.com/" alt="はてなブックマーク - Learn to Code - for Free | Codecademy" title="はてなブックマーク - Learn to Code - for Free | Codecademy" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/www.codecademy.com/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> http://www.moriwaki.net/jquery/effects.html level-one 2012-02-24T00:19:26Z サンプル jquery アニメーション エフェクト ui JavaScript チュートリアル *まとめ effect jQuery 63 <blockquote cite="http://www.moriwaki.net/jquery/effects.html" title="jQuery Effects のまとめ"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Fwww.moriwaki.net%2Fjquery%2Feffects.html" alt="" /> <a href="http://www.moriwaki.net/jquery/effects.html">jQuery Effects のまとめ</a></cite><p><a href="http://www.moriwaki.net/jquery/effects.html"><img src="" alt="jQuery Effects のまとめ" title="jQuery Effects のまとめ" class="entry-image" /></a></p><p>jQuery UI アニメーションエフェクトのまとめ（サンプルをクリックでアニメーション） サンプル エフェクト オプション 説明</p><p><a href="https://b.hatena.ne.jp/entry/www.moriwaki.net/jquery/effects.html"><img src="https://b.hatena.ne.jp/entry/image/http://www.moriwaki.net/jquery/effects.html" alt="はてなブックマーク - jQuery Effects のまとめ" title="はてなブックマーク - jQuery Effects のまとめ" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/www.moriwaki.net/jquery/effects.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://kachibito.net/web-design/jquery-slide-for-beginner.html level-one 2012-02-24T00:18:38Z jquery あとで読む web制作 javascript 入門 スライド 2303 <blockquote cite="https://kachibito.net/web-design/jquery-slide-for-beginner.html" title="「ノンプログラマーのためのjQuery入門」のスライドが凄く分かりやすいですね - かちびと.net"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fkachibito.net%2Fweb-design%2Fjquery-slide-for-beginner.html" alt="" /> <a href="https://kachibito.net/web-design/jquery-slide-for-beginner.html">「ノンプログラマーのためのjQuery入門」のスライドが凄く分かりやすいですね - かちびと.net</a></cite><p><a href="https://kachibito.net/web-design/jquery-slide-for-beginner.html"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/db3d3c0076bbd08db87cef1f0ebbadab2d74b518/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fkachibito.net%2Fwp-content%2Fuploads%2F2011%2F04%2Fjq1.jpg" alt="「ノンプログラマーのためのjQuery入門」のスライドが凄く分かりやすいですね - かちびと.net" title="「ノンプログラマーのためのjQuery入門」のスライドが凄く分かりやすいですね - かちびと.net" class="entry-image" /></a></p><p>この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 Twitterに流れてきたスライドがとっても 分かりやすかったのでブログでより多く の方に拡散。ノンプログラマー向けの jQueryの基本講座。これからjQuery を使おう、という方は読んでお...</p><p><a href="https://b.hatena.ne.jp/entry/s/kachibito.net/web-design/jquery-slide-for-beginner.html"><img src="https://b.hatena.ne.jp/entry/image/https://kachibito.net/web-design/jquery-slide-for-beginner.html" alt="はてなブックマーク - 「ノンプログラマーのためのjQuery入門」のスライドが凄く分かりやすいですね - かちびと.net" title="はてなブックマーク - 「ノンプログラマーのためのjQuery入門」のスライドが凄く分かりやすいですね - かちびと.net" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/kachibito.net/web-design/jquery-slide-for-beginner.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> http://higashizm.sakura.ne.jp/jquery_first/ level-one 2012-02-24T00:13:10Z jquery あとで読む web制作 チュートリアル tutorial javascript プログラミング webデザイン 資料 1344 <blockquote cite="http://higashizm.sakura.ne.jp/jquery_first/" title="はじめてのjQuery"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Fhigashizm.sakura.ne.jp%2Fjquery_first%2F" alt="" /> <a href="http://higashizm.sakura.ne.jp/jquery_first/">はじめてのjQuery</a></cite><p><a href="http://higashizm.sakura.ne.jp/jquery_first/"><img src="" alt="はじめてのjQuery" title="はじめてのjQuery" class="entry-image" /></a></p><p>デザイナ向け「初めてのjQuery」</p><p><a href="https://b.hatena.ne.jp/entry/higashizm.sakura.ne.jp/jquery_first/"><img src="https://b.hatena.ne.jp/entry/image/http://higashizm.sakura.ne.jp/jquery_first/" alt="はてなブックマーク - はじめてのjQuery" title="はてなブックマーク - はじめてのjQuery" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/higashizm.sakura.ne.jp/jquery_first/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://kachibito.net/web-design/likebox-design-customize.html level-one 2012-01-17T07:08:38Z facebookページ facebook カスタマイズ デザイン css JavaScript tips Facebook 142 <blockquote cite="https://kachibito.net/web-design/likebox-design-customize.html" title="Facebookページをアピール出来るソーシャルプラグイン・Likebox（いいね！ボックス）をオリジナルデザインに変更する方法 - かちびと.net"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fkachibito.net%2Fweb-design%2Flikebox-design-customize.html" alt="" /> <a href="https://kachibito.net/web-design/likebox-design-customize.html">Facebookページをアピール出来るソーシャルプラグイン・Likebox（いいね！ボックス）をオリジナルデザインに変更する方法 - かちびと.net</a></cite><p><a href="https://kachibito.net/web-design/likebox-design-customize.html"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/e4b716e0c7c7b58ed758d61fc94906ef76b83881/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fkachibito.net%2Fwp-content%2Fuploads%2F2011%2F03%2FFacebook-logo.jpg" alt="Facebookページをアピール出来るソーシャルプラグイン・Likebox（いいね！ボックス）をオリジナルデザインに変更する方法 - かちびと.net" title="Facebookページをアピール出来るソーシャルプラグイン・Likebox（いいね！ボックス）をオリジナルデザインに変更する方法 - かちびと.net" class="entry-image" /></a></p><p></p><p><a href="https://b.hatena.ne.jp/entry/s/kachibito.net/web-design/likebox-design-customize.html"><img src="https://b.hatena.ne.jp/entry/image/https://kachibito.net/web-design/likebox-design-customize.html" alt="はてなブックマーク - Facebookページをアピール出来るソーシャルプラグイン・Likebox（いいね！ボックス）をオリジナルデザインに変更する方法 - かちびと.net" title="はてなブックマーク - Facebookページをアピール出来るソーシャルプラグイン・Likebox（いいね！ボックス）をオリジナルデザインに変更する方法 - かちびと.net" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/kachibito.net/web-design/likebox-design-customize.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> http://enchantjs.com/ja/ level-one 2011-09-30T12:18:58Z ゲーム html game html5 JavaScript プログラミング 533 <blockquote cite="http://enchantjs.com/ja/" title="enchant.js - A simple JavaScript framework for creating games and apps."><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Fenchantjs.com%2Fja%2F" alt="" /> <a href="http://enchantjs.com/ja/">enchant.js - A simple JavaScript framework for creating games and apps.</a></cite><p><a href="http://enchantjs.com/ja/"><img src="" alt="enchant.js - A simple JavaScript framework for creating games and apps." title="enchant.js - A simple JavaScript framework for creating games and apps." class="entry-image" /></a></p><p>enchant.js is … カンタンにゲームやアプリを開発できる HTML5 + JavaScript フレームワークです。 2011年に公開され、すでに 1,000 本以上のゲーム/アプリが公開されています。 オープンソース (MITライセンス) で、無料で利用できます。 ドキュメント・書籍・チュートリアルサイトが充実しています。 たくさんのプラグ...</p><p><a href="https://b.hatena.ne.jp/entry/enchantjs.com/ja/"><img src="https://b.hatena.ne.jp/entry/image/http://enchantjs.com/ja/" alt="はてなブックマーク - enchant.js - A simple JavaScript framework for creating games and apps." title="はてなブックマーク - enchant.js - A simple JavaScript framework for creating games and apps." border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/enchantjs.com/ja/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://kanemotilevel.com/add/kizi276.html level-one 2011-09-16T23:22:55Z php Perl css3 seo css WordPress JavaScript Photoshop html 690 <blockquote cite="https://kanemotilevel.com/add/kizi276.html" title="Webデザイナー・開発者向けの３２個のチートシート集まとめてみた。"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fkanemotilevel.com%2Fadd%2Fkizi276.html" alt="" /> <a href="https://kanemotilevel.com/add/kizi276.html">Webデザイナー・開発者向けの３２個のチートシート集まとめてみた。</a></cite><p><a href="https://kanemotilevel.com/add/kizi276.html"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/8afc4776ace625a7e55ec2691e9094f12ef775e1/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fkanemotilevel.com%2Fwp%2Fwp-content%2Fuploads%2F2018%2F06%2Fga48.png" alt="Webデザイナー・開発者向けの３２個のチートシート集まとめてみた。" title="Webデザイナー・開発者向けの３２個のチートシート集まとめてみた。" class="entry-image" /></a></p><p>デザイナー向けのチートシートまとめ カラーシート Color Combination Cheat Sheet さまざまな色の基本原則がわかるカラーチートシートです。 使いたい色を直感的に選んで、その色のコードを調べることができます。 オンラインシートなので、ブックマークに保存しておくとすぐに調べられます！ Web Designer Color Refer...</p><p><a href="https://b.hatena.ne.jp/entry/s/kanemotilevel.com/add/kizi276.html"><img src="https://b.hatena.ne.jp/entry/image/https://kanemotilevel.com/add/kizi276.html" alt="はてなブックマーク - Webデザイナー・開発者向けの３２個のチートシート集まとめてみた。" title="はてなブックマーク - Webデザイナー・開発者向けの３２個のチートシート集まとめてみた。" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/kanemotilevel.com/add/kizi276.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://ameblo.jp/ca-1pixel/entry-11009598050.html level-one 2011-09-07T22:21:24Z html5 あとで読む アプリ開発 application web javascript 676 <blockquote cite="https://ameblo.jp/ca-1pixel/entry-11009598050.html" title="『HTML5 Web Applicationのつくりかた』"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fameblo.jp%2Fca-1pixel%2Fentry-11009598050.html" alt="" /> <a href="https://ameblo.jp/ca-1pixel/entry-11009598050.html">『HTML5 Web Applicationのつくりかた』</a></cite><p><a href="https://ameblo.jp/ca-1pixel/entry-11009598050.html"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/27636eb114bbfba23f6c52e6f5c549c43cf9baed/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fstat.ameba.jp%2Fuser_images%2F20110830%2F18%2Fca-1pixel%2F3c%2Fb7%2Fp%2Fo0320041611451829590.png" alt="『HTML5 Web Applicationのつくりかた』" title="『HTML5 Web Applicationのつくりかた』" class="entry-image" /></a></p><p>1 pixel｜サイバーエージェント公式クリエイターズブログ サイバーエージェントのクリエイターの取り組みを紹介するオフィシャルブログです。最新技術への挑戦やサービス誕生の裏話、勉強会やイベントのレポートなどCAクリエイターの情報が満載です。 はじめまして。 サイバーエージェントでフロントエンドの開発をして...</p><p><a href="https://b.hatena.ne.jp/entry/s/ameblo.jp/ca-1pixel/entry-11009598050.html"><img src="https://b.hatena.ne.jp/entry/image/https://ameblo.jp/ca-1pixel/entry-11009598050.html" alt="はてなブックマーク - 『HTML5 Web Applicationのつくりかた』" title="はてなブックマーク - 『HTML5 Web Applicationのつくりかた』" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/ameblo.jp/ca-1pixel/entry-11009598050.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote>