[B! jQuery] masa_wのブックマーク

masa_w id:masa_w

jQueryに関するmasa_wのブックマーク (16)

ReactをjQueryの数行に要約する | POSTD
﹁Reactが素晴らしい理由は、UIをアプリケーションの状態の純粋関数にできるからだ﹂いうような話を聞いたことがあるでしょう。しかしそれだけではなく、不変性と仮装DOMを利用して動作するということも聞きますよね。その上、保存、読み込み、取り消し、それにタイムトラベル・デバッグと呼ばれるすごい機能まで自由に手に入れられる。でも知っていますか？　Reactの核となるアイデアを利用し、その恩恵に預かるのにこれらのことは必要ありません。jQueryの数行にしてお見せします。 <span id="colored-counter">0</span> <input id="color"></input> <button id="inc"></button> <script> $('#color').on('keyup', function () { $('#colored-counter').css('
masa_w 2015/04/21
javascript

jQuery

react.js
リンク
So long...
I'm sorry! My site is no longer active. It was great while it lasted, but I just don't have the energy, and want to focus on other stuff. Doing a good job of a website takes a lot of time. Thanks to those who visited. Best Regards, James *There is an old copy on the wayback machine.
masa_w 2015/02/17
jQuery

responsive

デザイン

javascript
リンク
Backbone.js ではじめるクライアントサイド MVC プログラミング | CYOKODOG
MVC と言えば Apache Struts をはじめとするサーバサイド・フレームワークを想像しますが、今回は JavaScript による大規模開発の際に採用されるクライアントサイド MVC フレームワーク「Backbone.js」の使い方についてまとめてみました。 (厳密にはクライアントサイドの場合、MVC とは呼ばず MVVM とか MV* とか呼ばれてるようです。) 前提 Backbone.js の構成を簡単に言ってしまうと単一データの管理を行うモデル複数件のモデルの管理を行うコレクション画面の管理を行うビューの３つの主要モジュールを軸に構成されており、Underscore.js、jQuery(Zepto）に依存するかたちで動作するようになっています。利用の際は、underscore.js、jquery.js、backbone.js の順で読み込みます。 //cdnjs
masa_w 2015/01/12
javascript

backbone.js

jQuery
リンク
jQuery Steps
An all-in-one wizard plugin that is extremely flexible, compact and feature-rich. Download
masa_w 2014/03/30
javascript

jQuery

wizard
リンク
WYSIWYGエディタのCKEditorが良い感じになってる！
ダウンロード下記URLからダウンロードします。﹁CKBuilder﹂を選択すれば、プラグインをカスタマイズしてダウンロードすることができます。ここでは﹁ckeditor_4.1.1_standard﹂を使用します。 Download | CKEditor.com 使い方﹁Sample﹂フォルダ以外を自分の作業フォルダへコピーします。ファイル構成は下記図のようにします。作成した﹁index.html﹂に下記を記述します。 index.html <textarea class="ckeditor" cols="80" id="editor1" name="editor1" rows="10"></textarea> <script src="ckeditor/ckeditor.js"></script> これだけでtextareaがWYSIWYGに早変わり！ちなみに﹁ckedit
masa_w 2014/03/14
jQuery

webデザイン
リンク
http://daily.d3js.info/?p=296
masa_w 2013/09/10
D3

jQuery
リンク
Raty | A Star Rating Plugin - Washington Botelho
Wow Great, thank you that's what i was looking. glad to know that it works perfectly for dynamic data.
masa_w 2013/07/15
jQuery
リンク
css+jQueryでチェックボックス&ラジオボックスをオリジナルデザインのボタンにする
Posted: 2012.04.10 / Category: javascript / Tag: jQuery ブラウザ標準のチェックボックス&ラジオボタンのデザインだと俺のクールなサイトには合わん。といったときの為にボタン風なオリジナルデザインにする方法をご紹介します。 cssオンリーの場合まずはcssのみでやってみます。隣接セレクターやcheckedセレクターを使用している関係でieでは動きません。 <div class="check-group clearfix"> <div> <input id="checkbox1" type="checkbox" name="check[]" value="c1" /> <label for="checkbox1">Checkbox 1</label> </div> <div> <input id="checkbox2" type="ch
masa_w 2013/06/14
css

jQuery
リンク
ページを移動（離脱）するときにjQueryで警告を出す方法
Facebookなどでフォーム入力中にページを移動︵離脱︶しようとすると警告が表示されます。この仕組みをjQueryで実装する方法を紹介します。jQueryは投稿時点の最新バージョン1.9.1を利用しています。1．ページを移動するときに警告を出すページを移動するときに警告を出すには、onイベントにbeforeunloadイベントを設定します。 <script src="//ajax.google apis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script> $(function(){ $(window).on('beforeunload', function() { return '投稿が完了していません。このまま移動しますか？'; }); }); </script> <form method="post" acti
masa_w 2013/03/11
javascript

jQuery
リンク
jQueryのbind/live/delegateの違いまとめ、と新API .on()の使い方 - y-kawazの日記
jQueryのイベント記述方法はいくつかあり、大雑把におさらいしたのが以下の3パターンです。まず一番基本的なのが $("a").click(fn) や $("a").bind('click', fn) です。click(fn)はbind('click', fn)の省略形です。次にjQuery1.3で $("a").live("click", fn) という機能が出来ました。liveの良いところはDOM操作で出たり消えたりするエレメントに対して再バインド無しでイベント定義ができる利便性と、内部的にはbind個所がdocumentの1か所になり複数個所へのbindが無くなることによるメモリ効率と実効速度の向上です。更にjQuery1.4.2で $("#foo").delegate("a", "click", fn) という書き方が出来るようになりました。これは特定要素以下に限定するliv
masa_w 2012/09/27
jQuery

javascript
リンク
モバイルに最適化した5kBのJavaScriptフレームワーク「jqMobi」が正式版公開
モバイルデバイスのレンダリングエンジンとして事実上の標準になっているWebkitに特化し、iOSやAndroidに最適化したJavaScriptフレームワークの﹁jqMobi﹂が、正規版となる1.0を公開しました。 jqMobiは、jQuery Mobileと同様にHTML5をベースにモバイルアプリケーションを開発できるJavaScriptフレームワークのコアモジュール。jQueryと同様の文法を備えたセレクタエンジンです。ユーザーインターフェイスを構築するモジュールである﹁jqUi﹂と合わせて使うことで、HTML5のタグを記述することによりモバイル向けユーザーインターフェイスを備えたアプリケーションの開発が可能になります。小さくて早いのが特徴 jqMobiとjqUIの特徴は、Webkit上でのモバイル向けアプリケーションに特化したことでサイズを小さくできたこと、環境に最適化できたこと
masa_w 2012/03/14
jQuery

javascript

モバイル
リンク
rottel.net
masa_w 2011/06/10
jQuery
リンク
少しのjQueryコードでHTMLテーブルの列にリンク先を指定できるようにする
列全体がクリック可能で、Wikipediaに飛びます。セル内にアンカータグが含まれている場合はそちらが優先されます。Webサービスの料金プランなんかに使えそうでは。 jQuery( function($) { $('tbody tr[data-href]').addClass('clickable').click( function() { window.location = $(this).attr('data-href'); }).find('a').hover( function() { $(this).parents('tr').unbind('click'); }, function() { $(this).parents('tr').click( function() { window.location = $(this).attr('data-href'); }); });
masa_w 2011/06/10
jQuery
リンク
pjax こそが pushState + Ajax の本命 - punitan (a.k.a. punytan) のメモ
pjaxの前にpushStateとは AjaxとjQueryの説明は不要として、pushStateとはなんぞや。 pushStateを使ってブラウザの履歴に対する操作をし、HTMLの一部のみを書き換える動作でもブラウザの戻る／進む機能を実現できる方法のひとつ。Ajaxなページを再現し、かつURLを見慣れた方法で自然にpermalinkを表現できる。有名なところではGitHubで使われてるアレ。 hash fragment (/#!/) ブラウザの履歴を機能させるため、URL の fragment (#) を使ってAjaxなページを実現する方法。一時期もてはやされた感があるが、さらなる﹁#!﹂URL批判 - karasuyamatenguの日記など合理的な反論があり、これから導入するのはためらわれるところ。有名なところではTwitterで使われているあの厄介者。 pjaxとは pjax
masa_w 2011/06/03
jQuery

ajax
リンク
5509.me
This domain may be for sale!
masa_w 2011/03/03
jQuery
リンク
HTML5 の placeholder 属性を jQuery でクロスブラウザに
2011-09-23更新: 一部を修正して Gistに置きました。フォームの入力フィールドにあらかじめテキストを表示させておく﹁プレースホルダ﹂。ブラウザの検索バーなんかに見られるような、フィールドが空のときは薄く文字が表示されていて、フォーカスすると消えるあれです。このプレースホルダの機能、HTML5では input 要素や textarea 要素の placeholder 属性で簡単に実現できます。 <label>お名前 <input type="text" name="fn" placeholder="山田太郎"></label> しかしながら、この placeholder 属性をサポートしているのは今のところ Safari と Chrome のみ。そのほかのブラウザでは無視されてしまいます。そこで、この placeholder 属性をクロスブラウザで扱えるようにする jQu
masa_w 2010/12/12
html5

jQuery

javascript
リンク
1