CoffeeScriptでjQuery使うときのメモ CoffeeScriptでjQuery使おうと思ったらいろいろと戸惑ってしまったのでメモです。 投稿日2012年11月19日 更新日2012年12月24日 とりあえずCoffeeScriptでjQuery使えるようにする JSでjQueryのコードを書き始めるとき「$(document).ready」を省略した形で下記のように書くことが多いと思います。 JavaScript $(function() { // jQueryスクリプト }); これをCoffeeScriptにするとこうなります。 CoffeeScript $ -> # jQueryスクリプト これでjQueryがいつものように使用できますので、あとはさくさく書けると思います。 試しに「p」のテキストカラーを赤にしてみます。 CoffeeScript $ -> $('p')
Once, finding someone to hook up with was a daunting task, but not anymore. With the rise of free adult dating apps, getting laid online has never been easier. These apps offer a wide range of options for people looking to connect with others who are interested in casual encounters. From swiping through profiles to messaging and arranging meetups, these apps take the hassle out of finding a willin
JavaScriptの正規表現で特定の文字列を抜き出す「グループ化」について解説します。 JavaScriptで特定の文字列を抜き出して処理したいことがよくあるのですが、グループ化の使い方を忘れてネットで検索してもなかなかヒットしないので、備忘録で残しておきます(他に適切な方法があるようでしたらすいません)。 1.特定の文字列を抜き出す まず基本として、特定の固定文字列を抜き出すには、match関数で次のように記述します。 var foo = 'abcdefg'; var bar = foo.match(/abc/); これは変数fooに「abc」という文字が含まれていれば、変数barに abc が設定されます。 変数fooに「abc」という文字が含まれていない場合、変数barにnullが設定されます。 この使い方は、検索したい文字列があらかじめ決まっていて、上記のような代入文ではなく、判
今日のスケッチ蝶蝶がいっぱい。 processing.js だいたい理解した。 蝶の群れだけど、boidというよりは、perlin noiseによるフォースフィールドの復習。 定番ですがperlin noiseで作った雲状bitpmapのR値とG値を、XY方向の気流の力として適用する・・・ってアレです。 リハビリリハビリ。 ここ数年こういうコード書いてなかったので、すごい腕が落ち込んでる。 スムーズな方向転換系アルゴリズムを作れないうちに時間切れ。 昔は2〜3時間あれば作れたのに・・・ジジイになったってことか。 ところで、processing.jsの現行バージョン、tint()関数が壊れてませんかね? フォグでZ-Depth的表現しようとしたら、どうにも動かない。 1日1〜2時間、プライベートの時間にちょこちょこ作って一気にリハビリしたい。 Daniel Shiffman師父の、インタラク
In a world where urban landscapes are constantly evolving, the value of a property is not just determined by its current structure but also by the potential it holds for transformation. Imagine an old, dilapidated building that once stood as a testament to history but now serves as nothing more than an eyesore. What if we told you this neglected space could be reborn into something spectacular? We
IE6/7/8/9/10, Firefox, Chrome, Safari, Operaなどのブラウザだけでなく、Win, Mac LinuxなどのOS、iPadやiPhoneのRetinaディスプレイ用に条件分岐して、外部スクリプトやスタイルシートをロードさせたり、classを付与してHTMLで利用できたりする超軽量高速の単体で動作するスクリプトを紹介します。 Conditionizr Conditionizrの特徴 Conditionizrの使い方 Conditionizrの特徴 ConditionizrはjQueryより50%高速に動作し、条件付きのJavaScriptとCSSをサポートする3KBの超軽量スクリプトです。 条件付きのHTMLタグ 条件付きの外部スクリプトやスタイルシートのロード カスタマイズされたスクリプトにも対応 IE, Firefox, Chrome, Safar
Social Share Privacy Fork of "jquery.socialshareprivacy.js | 2 Klicks fuer mehr Datenschutz" Download this project as a .zip file Download this project as a tar.gz file Before activation this button doesn't send information to a third party. More and more websites use like-buttons from Facebook, Google+ and Twitter. However, these buttons send information to these social networks even if the user
jQuery は機能が豊富なので、しばらく使わないと忘れてしまう。 ここでは、jQuery と配列の関係に絞って目的別に逆引きできるようにしておく。 配列から jQuery オブジェクトを作成 $ 関数に渡せばOK $([1,2,3]) NodeList のような配列っぽいものを渡しても解釈してくれる。 $(document.getElementsByTagName("div")) // $("div") と同じ ※内部的には setArray メソッドが呼ばれてるが、外から使うことは稀。 jQuery オブジェクトを配列のように扱う 要素数を取得する length プロパティを使えばOK。 $("div").length // document.getElementsByTagName("div").length と同じ jQuery のメソッドを使って操作する限りは、適切に lengt
Fabric.js Javascript Canvas Library JSでのCanvas操作を簡単かつ高機能にできる「Fabric.js」 canvasのネイティブAPIは若干分かりづらいという方も多そうですが、このライブラリを使えばオブジェクト指向で楽々Canvasプログラミングが出来そうです 単に便利にコーディングできるようになるだけでなく、オブジェクトをマウスで拡大や回転できるなどといった色々な機能も盛り込まれていて便利そうです ネイティブAPIだと、四角形を描画するのに、次のようなコードを書きます。 これが、Fabric.jsを使うと次のように、とても分かりやすくなります。fillRectの引数の順ってどうだっけ?と毎回リファレンスを牽く必要もなくなりますね 他にもドキュメントを参照すれば、CanvasをネイティブAPIで書く面倒さを理解できるはず デモページも結構充実しており
Nivo Zoom - jQuery Image Zoomer 画像クリックでその場で色々な形でズームできるjQueryプラグイン「Nivo Zoom」 5種類のズームタイプ、HTMLキャプションを画像に重ねたりできる画像ズームプラグインです 定番のズームプラグインも既にありますが、比較検討の際に検証してみるのもいいかもですね。 関連エントリ 製品画像等のズームが非常に簡単に行えるjQueryプラグイン「Image Zoom」 マウスホバーだけの簡単操作で画像をズームできて便利な「jQuery Zoom」
HTML5デモ「日本全国花粉飛散マップ」を作って分かったCreateJSとTypeScriptでの効率的な開発手法 2013年3月15日に開催されたCreateJS勉強会(第2回)で発表したWebサイト「日本全国花粉飛散マップ」ですが、CreateJSとTypeScriptを使って制作しました。 今回の作品のポイントとしては、次の3点があげられます。本記事では次を具体的に説明します。 HTML5で制作、デスクトップだけでなくスマートフォンやタブレットでも再生可能 CreateJSで、DOMではできないHTML5 Canvasならではの表現 TypeScriptを用いて低学習コストで効率的な制作の実現 スマートフォンやタブレットでも閲覧可能 このWebサイトは環境省が提供している資料を元に、過去9年分の花粉の飛散量をパーティクルを用いてビジュアライズしたものです。花粉の量に比例して、パーティ
tekitoizmの忘備録(注:ひっそり系)し~ずん2 気が向いたときに、 過去に行った内容を忘れないように記述していきます。 基本、僕のための覚書なので 動作を保障するものではありません。 もし、行うのでしたら、自己責任でお願い致します。 ※ 「間違っている」ってツッコミを待っているのはナイショww JavaScript 文字コードのエンコード JavaScriptで文字コードをエンコードをする方法 使用すると以下の関数がグローバルに使えるようになる EscapeSJIS UnescapeSJIS EscapeEUCJP UnescapeEUCJP EscapeJIS7 UnescapeJIS7 EscapeJIS8 UnescapeJIS8 EscapeUnicode UnescapeUnicode EscapeUTF7 UnescapeUTF7 EscapeUTF8 Unescape
Include jQuery <script src="jquery.min.js"></script> Include tree.jquery.js: <script src="tree.jquery.js"></script> Include jqtree.css: <link rel="stylesheet" href="jqtree.css"> Create a div. <div id="tree1"></div> Create tree data. var data = [ { name: 'node1', children: [ { name: 'child1' }, { name: 'child2' } ] }, { name: 'node2', children: [ { name: 'child3' } ] } ]; Create tree widget. $(func
Movable Type で日付のフォーマットをいじりたいときには、% を使って簡単に設定できます。 例えば、「2013年03月14日 (月)」と表示したいときは、次のように指定します。 <$MTDate format="%Y年%m月%d日 (%a)"$> 詳しくは、日付に関するテンプレートタグのモディファイアリファレンス を参照。 その感覚で、JavaScript でも同じようなことできると思っていたら、そういうものは無いらしい。 なので、自分でフォーマットを整形したいときは、次のように指定します。 // 今日の日付で Date オブジェクトを作成 var now = new Date(); // 「年」「月」「日」「曜日」を Date オブジェクトから取り出してそれぞれに代入 var y = now.getFullYear(); var m = now.getMonth() + 1;
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く