Get the device width in javascript
Is there a way to get the users device width, as opposed to viewport width, using javascript? CSS media queries offer this, as I can say @media screen and (max-width:640px) { /* ... */ } and @media screen and (max-device-width:960px) { /* ... */ } This is useful if I'm targeting smartphones in landscape orientation. For example, on iOS a declaration of max-width:640px will target both landscape an
Learning JavaScript Design Patterns by Addy Osmani
Document has moved, if you aren't automatically redirected go here.
APIと少しのjQueryコードでGoogle Mapの地図の色を変更する - かちびと.net
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 Google MapのデザインをjQueryで変更する為のメモ書き。Google Map APIとjQueryでGoogle Mapの色合いを変更し、オリジナルのマーカーを付けてみます。こうする事で、既存デザインに合わせたGoogle Mapが出来ます。 今後必要になりそうだったので調べ物をしたついでにメモ書きです。デザインを変更、というと語弊がありますけど、好みの色に変えてみます。 ゴール ↓ こんな感じのをjQueryでやろう、みたいな内容です。特に目新しい情報では無いですが。 なんかシャドウ変になっちゃった・・色やマーカーだけでもWebサイトで使用している色にあわせれば地図だけ浮いてしまうような事も無くなるんじゃないかなと思います。 ジオコーディングリクエスト
text.ssig33.com - Facebook の JS SDK は使ってはいけない。
Facebook の JS SDK は使ってはいけない。 非常に問題がある。どうせ単なる薄いラッパーなんだし、必要に応じて自分であんなの書けるでしょう。問題について書く。 ありがちなアプリケーションの例 FB.login(function(res){ FB.getLoginStatus(function(res){ if(res.status === 'connected'){ FB.api('/me', function(res){ console.log(res.email) } } }) },{scope: 'email'}) 自分 のemail を取得出来る。 ところで、こうしたらどうなるだろうか。 FB.login(function(res){ FB.getLoginStatus(function(res){ console.log(res.status) FB.api('/me
HTML5モバイルWebフレームワークの比較 - きしだのHatena
モバイル用でJavaScriptでアプリケーションを作成できるフレームワークについて比較した記事を翻訳しました。 Comparing HTML5 Mobile Web Framework - Dzyngiri Comparing HTML5 Mobile Web Framework Apr 27, 2012 by Dzyngiri 今年はモバイルWebにとって面白い年になっている。HTML5とCSS3の採択、モバイルブラウザのパフォーマンス向上、モバイルアプリケーションフレームワークの爆発は、モバイルデバイスでのリッチでインタラクティブなWeb体験の作成がこれまでよりも現実的になったことを意味する。PhoneGapのようなラッパを使うことで、iPhoneやiPad、AndroidのネイティブのAppストアでアプリケーションを配布することも可能になった。単一のコードベースでマルチプラットフォ
Masonry
What is Masonry? Masonry is a JavaScript grid layout library. It works by placing elements in optimal position based on available vertical space, sort of like a mason fitting stones in a wall. You’ve probably seen it in use all over the Internet. Install Download CDN Package managers Getting started HTML CSS Initialize with jQuery Initialize with Vanilla JavaScript Initialize in HTML Next MIT Lice
第29回 HTML5とか勉強会に参加してきた #html5j - Diary of absj31
第29回 HTML5とか勉強会 : ATND 2012/05/16 第29回 HTML5とか勉強会 #html5j - Togetter (写真：渋谷ヒカリエ) 今回からは、最近増えて増えて仕方ないJavaScriptフレームワークをガンガン追求していきたいと思います。 今回と次回は、モバイルフレームワークに焦点を当てて紹介したいと思います。『JavaScriptモバイルフレームワーク』をテーマとして、前編/後編開催と銘打たれたHTML5とか勉強会。第29回の今回はその前編として位置づけられました。個人的にも興味深いテーマだったので告知待機し、速効申込みDone。この日参加してきました。 開催会場はDeNAヒカリエ会議室＠渋谷。最近移転した事自体大きなニュースになりましたが、やはり綺麗で羨ましい限りですね〜。地階から辿り付いたので2階に伸びている連絡通路経由で入ることは叶いませんでしたw(
Appceleratorの開発者が語るTitaniumとPhoneGapの比較 « A-Listers
iOSとAndroidのクロスプラットフォームなアプリケーションをする際に使われるTitanium MobileとPhone GapをTitaniumの開発元、Appceleratorの開発者Kevin Whinnery氏が比較した記事が話題になっていました。 Kevin氏は「上空1万フィートから見ればTitaniumとPhone Gapは似ているように見える。どちらもクロスプラットフォームでJavaScriptとWebの技術を要求し、オープンソースライセンスを採用している。しかし似ている所はそれぐらいしかない。どちらも思想や問題を達成する為のアプローチは異なっている」という書き出しで二つのプラットフォームがかなり異なっている事を強調した上でいくつかのポイントを比較しています。 Phone Gapについて 実現する事 HTMLベースのWebアプリケーションをネイティブアプリとして配布、イン
New community features for Google Chat and an update on Currents
Join the official community for Google Workspace administrators In the Google Cloud Community, connect with Googlers and other Google Workspace admins like yourself. Participate in product discussions, check out the Community Articles, and learn tips and tricks that will make your work and life easier. Be the first to know what's happening with Google Workspace. ______________ Learn about more Goo
Chromeのリモートデバッグ機能がすごい！ - Hacking My Way 〜 itogのhack日記
ここの動画で紹介されているリモートデバッグがかなり強力なツールなので紹介します。 事前準備 開発マシン側にadbというツール＆Android端末のUSBデバッグを有効にする必要があります。 開発してる人なら説明いらないので省略。 リモートデバッグを有効にする Android端末と開発マシンをUSBで接続して、端末が認識されていることを確認して下さい。 開発マシンのターミナルで以下コマンドを打ちます。 $ adb forward tcp:9222 localabstract:chrome_devtools_remote Android端末のChrome for Androidでメニューから 設定→デベロッパーツール→USBウェブでバッグを有効化にチェック 開発マシンのブラウザで下記URLにアクセスします。 localhost:9222 すると、Chrome for Androidのタブで開い
Unbeatable JavaScript Tools - The Dojo Toolkit
Upcoming EventsThe OpenJS Foundation is proud to support our contributors and collaborators at events around the globe. Come see what we're up to! Squiggle ConfSquiggleConf brings together the admirers, contributors, and maintainers of the latest and greatest in web dev tooling. JSConf NAJSConf North America 2025, hosted by the OpenJS Foundation, is the premier event for all things JavaScript. Joi
phiary
Node.js６連投. 第５弾! npm と Node.js 上で require を使ったモジュール読み込みの仕組みについてメモ Node.js 用に作った自作モジュール『merger』を npm で公開してみた Node.js 用の自作モジュールの作り方メモ Node.js 用に作った自作モジュールを npm に登録して公開する方法 JavaScript テストフレームワーク『Mocha』の使い方メモ <- いまここ JavaScript テストフレームワーク『Mocha』をブラウザ上で使う方法 Node.js もしくはブラウザ上で動く JavaScript テストフレームワーク『Mocha』の使い方について書きます. 最近, JavaScript による大規模開発も増えてきました. それに比例して重視されてくるのが, テスト環境の構築です. そこで, node.js のテストフレーム
node-v0.6.18からエラー表示がわかりやすくなります。 - ぼちぼち日記
今まである程度 Node.js を使ったことがある方は、以下のエラーメッセージを１度や２度目にしたことがあるのではないでしょうか。 node.js:201 throw e; // process.nextTick error, or 'error' event on first tick これは以前の記事 Node.js のエラーメッセージの謎 でも解説しましたが、私がよく見るのは存在しないスクリプトファイルを指定して Node を起動した時に現れるエラーとしてです。その他、 // error.js if(true) { throw new Error('hoge'); } などスクリプトやモジュール内でエラーを throw した時にも、 $ node ~/error.js node.js:249 throw e; // process.nextTick error, or 'error'
lake.js
How does it work? Like this: <script src="jquery.js"></script> <script src="lake.js"></script> <script> $(function() { $('#lake-img').lake({ 'speed': 1, 'scale': 0.5, 'waves': 10 }); }); </script> ... <img id="lake-img" src="lake.png" style="display: none;"/> Lake.js takes an img element and inserts a canvas element displaying the image and its flipped reflection directly after the img element. Th
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ryuone日記(2012-05-19)
Redirect
GitHub - wjcrowcroft/MotionCAPTCHA: MotionCAPTCHA jQuery Plugin - Stop Spam, Draw Shapes
GitHub - Baggz/Amanda: JSON Schema validator
GitHub - garycourt/JSV: A JavaScript implementation of an extendable, fully compliant JSON Schema validator.
Requirejs 2.0 draft
