スナック「jQuery」 - Qiita
……あら、いらっしゃい。 若いお客さんなんて珍しいわねえ。昔は、この街一番の人気店でね、若いお客さんもたくさんいたんだけどさ。最近はめっきり減っちゃってね。 何飲む？ ……水割り？ わかったわ。 じゃあさ、ちょっとだけ、あたしの昔話に付き合ってもらってもいいかしら。 What is jQuery? この店――『jQuery』がオープンしたのって、2006年なんだけどさ。その頃の、この街の様子って覚えてる？ ……知らないか。あなた、まだ若いもんね。その頃って、そりゃあヒドイもんだったのよ。 その頃、シェア率トップだったブラウザって、もちろんInternet Explorerだったんだけど。当時はバージョン7が登場したばかりで、あの悪名高きIE6もまだまだ主流だったの。 他のブラウザは、Safariがバージョン3がMacとWindowsに公開されていた頃で、Firefoxはまだバージョン2.0
即時関数(function(){ ... })()の別の書き方いろいろ - 泥のように
JavaScriptでよく使われるコード片に即時関数というものがあります。無名関数を宣言して即実行することで、ブロックスコープの存在しないJavaScriptにおいて擬似的にブロックスコープを再現します。 var a = "global"; (function(){ var a = "local"; alert(a); //local })(); alert(a); //global 一番有名なのはこの(function(){ ... })()の形式なのですが、なぜfunctionの外側にカッコが必要なのか不思議に思ったことはないでしょうか？ ためしにfunction(){ ... }()と書いてみると、Syntax Errorが発生します。 なぜfunction(){ ... }()はSyntax Errorなのか JavaScriptにはfunction文とfunction式があって、
jQueryで指定されたイベントの定義場所を取得する方法
jQueryで指定されたイベントの定義場所を取得する方法 セミナー時にHTML上のイベントが指定されている要素から、実際にイベントを指定したコードが書かれているJavaScriptファイルや場所を知りたいと質問を受けました。 調べたところ良さそうな方法があったのでシェアしておきます。 ちょっと動画に取ってみたので、動画でご確認ください。 なにをやっているかというと、まず、デベロッパーツールを開き、検証したい要素を選択します。 次に右クリックして「Add attribute」から適当なidを指定します。今回は「js_debug」というidを指定しています。 次にデベロッパーツールの右上のアイコンからコンソールを開き以下のコードを入力しEnterを押します。 $._data($("#js_debug").get(0), "events"); Object->click->0の順番に開いていき、
jQuery#onを便利に使う - Qiita
$(selector).on('click', function(event) { }); くらいしか使ってこなかったのだけど、調べてみたらもっと便利に使える事を知ったのでメモ。多分on()だけじゃなくone()も同じかな。 イベントにネームスペースを付けられる $(selector).on('click.add-button', function(event) { }); $(selector).on('click.remove-button', function(event) { }); // click.remove-buttonだけ削除される $(selector).off('click.remove-button');
jQuery高速化！処理速度を10倍上げるテクニック20選
Aircraft manuevers during an airpower deomonstration. / Official U.S. Navy Imagery Javascriputを簡単に書けるようにしてくれるライブラリのjQueryですが、使い方をちょっと変えるだけで、パフォーマンスに大きく差がでます。ハイスペックPCでは分かりづらいかもしれませんが、スペックの低いPCやモバイルではWebページの表示速度が遅くすぐに閉じられるかもしれません。 Webページがたった1秒高速化するだけでECサイトなんか、売上が10％向上した事例もあります。そこで、jQuery高速化のポイントや方法をここにまとめておきます。 jQueryの最新バージョンを使う 図1 jQueryのバージョンによる速度 https://jsperf.com/speed-comparison-of-jquery-vers
ajaxしまくるページで不要な処理はabortすべし
programming notes. mainly about JavaScript / jQuery. [@Takazudo] [takazudo@gmail.com] Hint: alt + / ポチってもうたー開発メモ。 UIだけJSでいじってる時はそこまで慎重になることでもないけども、頻繁にガシガシajaxする場合は、既に走っているajaxリクエストもうまいことハンドリングすべき。ポチってもうたーでは、ツイートをJSONで返すよう、サーバーサイドでサービスを用意しているわけだけれども、まぁ、普通に考えれば、こんな感じで、JSON返ってきたらUIを更新するってやるんじゃないだろーか。 $.ajax(url, query).then(function(){ // UI更新しちゃう }, function(){ alert('ゴメンなんか変'); });しかし、これには問題があって、JS
Spectrum - The No Hassle jQuery Colorpicker
<input type='color' value='#f594d0' /> Why A Colorpicker? I wasn't satisfied with the solutions available for colorpicking. Many of them included a ton of images, were hard to skin or customize, or were very large plugins. Here are the goals I had when making a new one: Small Footprint Just include the needed CSS and JavaScript files, and you are ready to go! <script src='spectrum.js'></script> <l
HTML5 × CSS3 × jQueryを真面目に勉強 – #16 レスポンシブWebデザインでテーブルを最適化するベストプラクティス | DevelopersIO
dislay 属性についてもっと知りたいという方は、こちらのサイトを参照ください。 display - CSS | MDN 要するに何が言いたいかというと、テーブルもまたスタイルシートの display 属性によってその形状を実現しているに過ぎず、この値を色々と操作すればスマートフォンのようなスクリーンサイズの狭い環境にも最適化された表示が出来るのではないかということです。 実際に作ってみた - 下準備 今回は4パターンの表示を紹介します。まずは下準備として簡単なテーブルレイアウトと元となるスタイルを組んでいくとします。 はじめに HTML で適当なテーブルを作ります。 <table class="table table-striped table-responsive"> <thead> <tr> <th>First Name</th> <th>Last Name</th> <th>Ag
TITLE
※基本的には出てきたオーバーレイはクリックしたら閉じます。 var o1 = new $.overlay(); $('#btn01').click(function(){ o1.open(); }); var o2 = new $.overlay({bg_color: '#ff0000'}); $('#btn02').click(function(){ o2.open(); }); var o3 = new $.overlay({opacity:0.8}); $('#btn03').click(function(){ o3.open(); }); var o4 = new $.overlay({bg_color: '#0000ff', opacity:0.1}); $('#btn04').click(function(){ o4.open(); }); var o5 = new $.ove
JSONをjQueryで扱う方法 : ずっと工事中
ブログネタ：JavaScript に参加中！ XMLに続いてJSONの扱い方のメモです。 概要は以下の通り。 ・JSONの取得 JSONの取得はajaxメソッドやgetメソッドでもできますが、getJSONを使った方がシンプルです。 ・エンコード指定 呼び出す側と呼び出される側でエンコードが異なる場合はスクリプトのcharsetの指定が必須です（特にIE）。 ・取得したJSONの取り扱い JSONはeachメソッドやfor文で扱うことができます。 Google Ajax Feed APIを使って任意のフィードからJSONを取得し、タイトル5件を表示する例です。 ソース とりあえずエラー処理は入れていないです。 $(function() { $.ajaxSetup({scriptCharset:'utf-8'}); //charsetの指定(デフォルトの書き換え) $('#get_feed'
jQueryでJSONのデータ取得
CouchDBをJavaScriptだけで制御してみたい！というのが最終目標ですので、 jQueryを使用したJSONの取り扱いについて調べてみました。 getJSON jQueryでJSONのデータを読み込むには、getJSONを使用すればよいようです。 まずはサンプルから。 dataフォルダを作成し、sample.jsonというファイルを作成。 内容は以下の通り。 <html> <head> <title>js sample</title> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript"> $(document).ready( function() { $("#btn_1").click(function(){ $.getJSON("data
jQueryでjsonデータを扱ってみる【入門編】
Posted: 2010.07.25 / Category: javascript / Tag: jQuery, json javascriptで外部のWebサービスを利用するデータ形式はjsonを使うことが基本なようです。 似たようなフォーマットとしてXMLがありますが、こちらはHTMLと同じマークアップ言語なのですんなり入っていける反面、jsonは少々わかりずらいといった先入観があったりするんじゃないでしょうか。 そこで入門編と題して（入門編しかない!）改めて基礎から勉強していけたらと思います。 とにかくシンプルなjson jsonデータは基本は外部から読み込むことになりますが、練習なのでとりあえずjavascript内の変数内に直に書きます。 「:（コロン）」で区切ったキーと値を一組として、２組目を「,（コンマ）」で区切って記述していきます。 それらを{}で囲むことで一つのオブジェク
Webアプリケーションの開発に。面白いコンポーネントが多数揃ったUIライブラリ·Ninja UI MOONGIFT
Ninja UIはHTMLを使わずにJavaScriptで画面を描画していくUIコンポーネント。 Ninja UIはjQuery/JavaScript製のオープンソース・ソフトウェア。思うにWebサイトというのは表現力が高く、かつ自由度が高すぎるのだ。そのため見栄えにこりだすと収集がつかなくなる。またデザインセンスがないと格好いいサイトが作れない。 ボタンやアイコン アイディアがどれだけ良く、技術力があっても見栄えがぱっとしないサイトは受け入れられない。もうHTMLは書かず、JavaScriptで組んでしまうのはどうだろう。それを可能にするのがNinja UIだ。 Ninja UIはjQuery Webjutsu（Web術？）を掲げているライブラリで、枠組みだけHTML5で組み、コンポーネントの配置は全てJavaScriptだけで記述するライブラリだ。ボタンやドロワー、アイコン、ポップアッ
iPhone3.0の緯度経度APIを用いて移動履歴をマップに反映 - PHP,MySQL,Flex,JSな日々＋イラストとか
iPhone3.0の緯度経度APIを用いて移動履歴をマップに反映してみました。 こんな感じにマーカーとラインが描画されます。 #今日の勉強会が早稲田大学工学部なんだけど、総合のほうに行ってしまった（笑） 簡単なプログラムの作り方はこちら iPhoneで緯度経度情報を取得して、サーバーに送信 まずは、現在の位置をiPhone3.0の緯度経度ＡＰＩを使用してサーバーに記録させます。 データーはjQueryのajaxを使用して画面遷移のない送信を行います。 //緯度経度取得 function ShowTime() { navigator.geolocation.watchPosition(callback, handleError) } //緯度経度取得エラー function handleError(a) { alert("error"); } var wlat; var wlon; //緯度
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
いつも忘れちゃうjQueryの一致まとめ - Qiita
スマホ用のブラウザ判別を行うための「 jquery.browser.sp.js 」
Sortable - jQuery UI API 1.8.4 日本語リファレンス - StackTrace
東京渋谷 “HTML5入門＆jQuery” 勉強会(5/26)の資料を公開します | tonowp
http://alpaca.chocosk.server-cowboy.net/blog/jquery/tried-jquery-tuning/
Google Code Archive - Long-term storage for Google Code Project Hosting.