タグ

ブックマーク / blog.mach3.jp (6)

  • JavaScriptのテストツール「testem」が素晴らしいぞ - Mach3.laBlog

    この記事は賞味期限切れです。(更新から1年が経過しています) JavaScriptユニットテスト一年生の私が、Nettuts+ のチュートリアルで知ったテストツール 「testem」のお陰で大変捗ったので是非お勧めしたく、ここで紹介してみます。 testem ってなに testem via GitHub : airportyh/testem Unit testing in Javascript can be tedious and painful, but Testem makes it so easy that you will actually want to write tests. 要するに、面倒なJSのユニットテストをより快適にしてみんなでハッピーにテスト書こうよ!というツールです。 testem自体はnode.jsベースで動作し、Jasmine/QUnit/Mochaに対応して

    JavaScriptのテストツール「testem」が素晴らしいぞ - Mach3.laBlog
  • JavaScriptで「パスワードを表示」機能を実装してみる - Mach3.laBlog

    この記事は賞味期限切れです。(更新から1年が経過しています) 通常なら文字が伏せてある状態のパスワード入力フォームですが、 入力したパスワードを確認する為の「パスワードを表示」機能を JavaScriptで実装する為のメモです。(jQuery使用) ざっくりとした仕掛け IE兄弟はinput要素のtype属性をいじれないらしい textとpasswordを並べて表示/非表示をトグルする コード抜粋 ざっくりとした仕掛け チェックボックスにチェックを入れると、 パスワードのtypeがtextに切り替わって内容が確認出来るようになる仕組み。 type直接いじれば楽じゃーん。 そう考えていた時代が僕にもありました。 IE兄弟はinput要素のtype属性をいじれないらしい ところがIEはinput要素のtype属性を弄ろうとするとエラーになります。 その為jQueryでも、attr()で同様の処

    JavaScriptで「パスワードを表示」機能を実装してみる - Mach3.laBlog
  • パッケージマネージャー「Bower」が大変便利で捗りそうです - Mach3.laBlog

    この記事は賞味期限切れです。(更新から1年が経過しています) 外部リソースをプロジェクトにインストールするのに、今まではSublimeText2のNettuts+ Fetchを使用していましたが、 node.jsベースのパッケージマネージャーの「Bower」が大変良さそうだったのでレポートをしたためておきます。 Bower とは BOWER – THE BROWSER PACKAGE MANAGER html, css, and javascript Bower is a package manager for the web. Bower lets you easily install assets such as images, CSS and JavaScript, and manages dependencies for you. BowerはWeb開発向けのパッケージマネージャー

    パッケージマネージャー「Bower」が大変便利で捗りそうです - Mach3.laBlog
  • JavaScriptのテストツール「testem」が素晴らしいぞ - Mach3.laBlog

    この記事は賞味期限切れです。(更新から1年が経過しています) JavaScriptユニットテスト一年生の私が、Nettuts+ のチュートリアルで知ったテストツール 「testem」のお陰で大変捗ったので是非お勧めしたく、ここで紹介してみます。 testem ってなに testem via GitHub : airportyh/testem Unit testing in Javascript can be tedious and painful, but Testem makes it so easy that you will actually want to write tests. 要するに、面倒なJSのユニットテストをより快適にしてみんなでハッピーにテスト書こうよ!というツールです。 testem自体はnode.jsベースで動作し、Jasmine/QUnit/Mochaに対応して

    JavaScriptのテストツール「testem」が素晴らしいぞ - Mach3.laBlog
  • jQueryUIのDialogをカスタマイズする6つの物凄く細かい小技 - Mach3.laBlog

    この記事は賞味期限切れです。(更新から1年が経過しています) jQueryUIのdialogは結構お世話になっているのですが、たまに欲しい機能がなかったり、あっても説明されてなかったりするのでここにDialogカスタマイズTipsをしたためておきます。 この記事の内容は既に古くなっています。現在最新バージョンのjQueryUIでは挙動が改善されていたり、渡せるオプションが変わっていたりします。 Modalしたダイアログをオーバーレイクリックで閉じる 任意の要素をクリックして閉じる アニメーションで閉じる・開く エフェクト中にオーバーレイの後ろに回りこんでしまうのを回避する 閉じる・開くアニメーションにパラメータを渡す 閉じるついでにデストロイする 1. Modalしたダイアログをオーバーレイクリックで閉じる escキー押下で閉じるオプションはあるのですが、このオプションはない様子。 そこで

    jQueryUIのDialogをカスタマイズする6つの物凄く細かい小技 - Mach3.laBlog
  • head要素に読み込むべき唯一のスクリプト「headjs」 - Mach3.laBlog

    この記事は賞味期限切れです。(更新から1年が経過しています) 「Modernizr」や「html5.js」等、 モダンな環境の為の便利なスクリプトは多々ありますが、 「headjs」はそんな彼らの仕事を一気に引き受けてくれる働き者のスクリプトです。 使い方 Head JS :: The only script in your HEAD 謳い文句はhead要素に読み込む唯一のスクリプト ダウンロードして読み込むだけ。おしまい。 <script type="text/javascript" src="head.js"></script> その多彩な機能 環境の判別 CSS3のプロパティの対応状況、画面のサイズ、ブラウザなどの情報を Modernizrと同じ手法でHTML要素のクラスに出力してくれます。 こんな感じに… <html lang="ja" id="test-page" class="

    head要素に読み込むべき唯一のスクリプト「headjs」 - Mach3.laBlog
  • 1