[JS]モーダルウインドウの実装を検討する時はこのスクリプトもチェック！ -vexカスタマイズ性に優れ、シンプルなものからカラフルなものまでさまざまなテーマも用意されており、簡単に実装できる超軽量（6KB）のjQueryのプラグインを紹介します。 レスポンシブ対応、IE8+もサポート、ウインドウを表示する際のアニメーションも優雅でいい感じ！ vex vex -GitHub vexのデモ vexの使い方 vexのデモ デモではvexのさまざまなスタイルをショー形式で楽しむことができます。 Chrome, Safari, Firefox, Opera, IE8+でご覧ください。
[CreateJS] Canvasアニメーションを実装する時に便利で良く利用しているJSライブラリ、CreateJS - YoheiM .NET
Tooklit for CreateJSは仕事でも利用しています。しかし、完全に出力する為にはFlashの××の機能は使っちゃダメなど、 いまのところは制約が多く使いづらいのが現状です。 また、出力されたソースコードをそのまま動かすと、なかなかの重さで書き換える必要がある場合も多く。。 現在は、Flashで利用している画像素材などの書き出し用として使うことがメインです。 CreateJSを使って実際に作ってみる CreateJSのEaselJSとTweenJSとPreloadJSを使って、 以下のような「動物が上下に動く」アニメーションを作成してみたいと思います。 CreateJSを使う為の準備 まずは、CreateJSのライブラリを読み込む実装を行います。 今回はCDNで提供されているものを利用していますが、ローカルにダウンロードしてきてそれを読み込むのももちろんありです。 <scrip
![[CreateJS] Canvasアニメーションを実装する時に便利で良く利用しているJSライブラリ、CreateJS - YoheiM .NET](https://cdn-ak-scissors.b.st-hatena.com/image/square/383ba9cac4755b0264d3fc76115f5fbaf427c264/height=288;version=1;width=512/https%3A%2F%2Fwww.yoheim.net%2Fimage%2F174.jpg)
ノイズエフェクトの作り方 | Fuzz blog
HTML, CSS, JavaScriptを使い、当ブログのサイトロゴのようなノイズエフェクトの実装方法を紹介します。 CSS3のアニメーション周りを使えばJavaScript無しでも実装できそうですが、ランダムな動きをつけたり細かい制御をかけたい場合などもあるのでJavaScriptでアニメーションさせてみます。 デモページ ソースの紹介の前に、簡単にまずは原理を。 ノイズさせたい画像の高さ分のHTMLの要素を用意。 （高さ120pxの画像なら120個） 各要素の高さを1pxに指定し、背景画像にノイズさせたい画像を指定。 背景画像位置は各要素1pxずつずらす。 これで見た目は画像そのまま、実態は高さ1pxの要素の集合体となります。 そして、これらの要素にposition: relativeを指定し、アニメーションループ中にleftの値をランダムに動かす。 これでノイズ
[JS]フラットなデザインで映える！美しく広がる波紋のエフェクトを簡単に実装できるスクリプト -jQuery.twinkle
ダウンロードファイルに含まれているデモ jQuery.twinkleの使い方 Step 1: 外部ファイル 当スクリプトとjquery.jsを外部ファイルとして記述します。 <body> ... <script src="jquery-1.10.2.min.js"></script> <script src="../jquery.twinkle-0.7.1.js"></script> </body> Step 2: HTML アニメーションを適用する要素にclassやidを加えます。 <div id="twinkle1">click !</div> Step 3: JavaScript jQueryのセレクタで要素を指定し、スクリプトを実行します。 $(selector).twinkle(); アニメーションやエフェクトはオプションで設定します。 var options = { "effe
![[JS]フラットなデザインで映える！美しく広がる波紋のエフェクトを簡単に実装できるスクリプト -jQuery.twinkle](https://cdn-ak-scissors.b.st-hatena.com/image/square/1664f643712bb7cebf68cc882a1117f2f93e0a5a/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201403%2F2014082802.gif)
[JS]Lightboxの進化形！操作性が快適でフラットなデザインにもぴったりなレスポンシブ対応のスクリプト -Strip
スマホなどの小さいスクリーンでは昔からあるLightbox風の体験を与え、より大きいスクリーンではページ上にインタラクションのスペースを残すよう設計された、画像や動画をアニメーションで拡大表示させるjQueryのプラグインを紹介します。 フラットなデザインにも相性が非常によく、操作も快適でエレガントです！ しかも、IE7+にも対応。 Strip Strip -GitHub Stripのデモ Stripの使い方 Stripのデモ デモはChrome, Safari, Firefox, Opera, IEは7+、iOS5+, Android3+でご覧ください。 各画像をクリック・タップすると、拡大画像がスライドして表示されます。 拡大時はそのまま他の画像も表示できるギャラリー機能にも対応しています。 デモ：幅780pxで表示 スライド表示させるのは画像だけでなく、YouTubeやVimeoなど
![[JS]Lightboxの進化形！操作性が快適でフラットなデザインにもぴったりなレスポンシブ対応のスクリプト -Strip](https://cdn-ak-scissors.b.st-hatena.com/image/square/b4b391a890221ac5696699ef145a5921c27e5824/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201404%2F2014100601-01.png)
[JS]モーダルボックスを実装するシンプルなスクリプト -jQuery modalBox
シンプルだけどマルチプルにカスタマイズできるモーダルボックスのスクリプトをOpen Source Projectから紹介します。 modal box デモ サイトのデモでは、ボックス内にHTMLコンテンツを配置したもの（上キャプチャ）をはじめ、AJAX、画像とよく使用されているものの動作が確認できます。
プログラミングやったこと無い奴はJavaScriptから始めろ : IT速報
1: 以下、名無しにかわりましてVIPがお送りします 投稿日：2014/03/09(日) 16:42:04.45 ID:ZsWrBm0M0 まずはNode.jsをインストールしろ話はそれからだ Download：http://nodejs.org/ 2: 以下、名無しにかわりましてVIPがお送りします 投稿日：2014/03/09(日) 16:42:26.57 ID:hzAFYxvI0 一方俺はコボルから始めた 3: 以下、名無しにかわりましてVIPがお送りします 投稿日：2014/03/09(日) 16:57:50.90 ID:ZsWrBm0M0 インストールしたかてめぇら 4: 以下、名無しにかわりましてVIPがお送りします 投稿日：2014/03/09(日) 16:59:13.96 ID:2B5lF2zi0 javaでいい？ 5: 以下、名無しにかわりましてVIPがお送りします 投稿
あれ、いつも書いてるな～というJavaScript の小技集 | バシャログ。
いい加減髪を切りたいminamiです。 JavaScriptでいつも書いてるな～という処理や、知っていると便利なTipsを簡潔に集めた記事を見てほお～と思ったものがいくつもあったので抜粋してみました。 ※追記1： ご指摘がありましたので一部修正しました。「配列をソートする」ではなく「配列をシャッフルする」でした。 ※追記2：「HTMLをエスケープする」のソースがまちがって表示されていました。修正しました。 ※追記3：予想以上に反響が大きく、多数ご指摘を受けてしまいました。よく使う処理の書き方もいろいろあるんだな～という参考程度にご紹介したのですが、参照元の記事の内容の検証が不十分なまま紹介してしまい申し訳ありませんでした。いろいろと勉強になりました！ 45 Useful JavaScript Tips, Tricks and Best Practices 配列からランダムで値を取り出す v
HTML5で燃えさかる炎の表現に挑戦！ WebGL対応のJSライブラリAway3Dはパーティクル機能がかなり魅力的 | ClockMaker Blog
HTML5で燃えさかる炎の表現に挑戦！ WebGL対応のJSライブラリAway3Dはパーティクル機能がかなり魅力的 先日の記事で紹介したJavaScriptライブラリ「Away3D TypeScript」(WebGLに対応)ですが、燃え盛る炎の表現を作成してみました。 デモは以下から試せますので、ぜひWebGL対応のブラウザ(Chrome, Firefox, IE11)を使ってご覧下さい。 Demo (WebGL対応のブラウザでご覧ください) Source (TypeScript 0.9.5で作成) 移植元のFlash版のデモ マウスで画面をドラッグ＆ドロップするとアングルを動かすことができます。もしかしたら環境によっては動作が重たいかもしれないので、ブラウザのウインドウサイズを小さくしてみると滑らかに再生できるようになるかもしれません。 ▲右クリックするとFlash Playerではない
JavaScript Garden
JavaScript Garden はJavaScriptというプログラム言語の一番奇妙な部分についてのドキュメント集です。 このドキュメントはJavaScriptという言語に慣れていないプログラマーがこの言語について深く知ろうとする際に遭遇する、良くある間違い・小さなバグ・パフォーマンスの問題・悪い習慣などを避ける為のアドバイスを与えます。 JavaScript GardenはJavaScriptを教える事を目的にしていません。このガイドの項目を理解する為には、この言語に対する前提知識がある事を推奨します。この言語の基礎部分についてはMozilla Developer Networkのガイド がオススメです。 著者 このガイドは愛すべきStack Overflowの2人のユーザーIvo Wetzel (執筆)とZhang Yi Jiang (デザイン)によって作られました。 貢献者 貢献
[JS]リアルさが想像以上！ブラウザのウインドウを窓に喩えて、雨を楽しむ癒やし系スクリプト -rainyday.js
ひと昔前に、小さいドットを上からアニメーションで落として雪とか桜とかありましたが、これはそれらとは異なり、かなりリアルに雨を堪能できるスクリプトを紹介します。 ぼっーと見てると、音まで聞こえてきそうです。 Demo 2 雨はCanvasを使って再現しており、実装は下記のようになります。 <head> ... <script src="rainyday.js" type="text/javascript"></script> <script type="text/javascript"> function demo() { var engine = new RainyDay('canvas','demo1', window.innerWidth, window.innerHeight); engine.gravity = engine.GRAVITY_NON_LINEAR; engine.t
HTML←いける！ CSS←いける！ Javascript←
4 風吹けば名無し :2013/08/11(日) 13:06:53.20 ID:g+Oc9UkT わかる 5 風吹けば名無し :2013/08/11(日) 13:07:42.09 ID:VdPoYo/3 なおHTMLも酷い出来な模様 8 風吹けば名無し :2013/08/11(日) 13:08:32.82 ID:RTB78vdv ｊQueryやれ 便利だぞ 9 風吹けば名無し :2013/08/11(日) 13:09:03.06 ID:WAKqMZax JSぐらい頑張れや 10 風吹けば名無し :2013/08/11(日) 13:09:58.25 ID:Wb4j9VcR
JavaScript でオセロを実装する(遅延評価編) | Webシステム開発／教育ソリューションのタイムインターメディア
これまでのあらすじ 新人の力量を測るための課題としてオセロの作成を指示したが、 指示した当人が作れないようでは話にならないので実際に作り始めた。 一先ず盤面が4×4で黒も白も人間が指す一人二役の寂しいオセロは実装できたのだが、 快適に遊ぶには大きな問題が潜んでいたのであった。 実は4×4で既に重い問題 実際に前回作成したオセロを実行すると、 ゲームが遊べるようになるまでに割りと待たされます。 それもそのはずで、あの実装は ゲーム中で取り得る局面を予め全て列挙 していたからです。 しかも4×4という最小限の盤面のオセロですらゲーム中に出現し得る局面 = ゲーム木に含まれるノード数は 284,881個 あります(※回転すると同じになる盤面等は個別に数えて、同一盤面でも手番のプレイヤーが異なるなら別と数えて、パスした場合も1個と数えています)。 そりゃあ待たされるに決まってますし、無闇矢鱈にメモ
最強オブジェクト指向言語 JavaScript 再入門！
この資料では、JavaScript でオブジェクト指向プログラミングを行う際に備えておくことが望ましい、基礎知識や概念について解説します。 【対象者】 ・JavaScript でアプリケーションを構築できる方 ・JavaScript におけるオブジェクト指向プログラミングの 実現手法や原理への理解を深めたい方 ・Java 的なクラスベースの言語との違いに違和感や混乱を 感じてらっしゃる方
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
finefinefine.jp
自社サイトリニューアルでのアニメーション制作について少しだけ。 | ココノヱブログ
JavaScript力をほんの少し上げる3個のTips
http://www.hp-stylelink.com/news/2013/10/20131008.php
Loading...
狠狠色噜噜狠狠狠狠97,你懂的在线视频,亚洲AV制服丝袜日韩高清