iPhoneのSafariで加速度センサーを使う - YoheiM技術やらずに終われまテン
こんにちは、@yoheiMuneです。 今日は、iPhoneのSafariにて、iPhoneアプリのように加速度センサーを使う方法を学んだので、ブログに残しておきたいと思います。 加速度センサーとは 加速度センサーとはその名の通り、iPhoneが移動した際の加速度を検知するセンサーです。加速度とは、メートル/秒×秒の値であり、加速度が正数であれば速度が増している状態であり、加速度が負数であれば速度が減速している状態。加速度については、wikipedia:加速度も参照してみてください。 iPhoneのSafariブラウザで加速度センサーを使う場合には、iOSが4.2以上である必要があります。 加速度センサーの使い方 iPhoneのSafariで加速度センサーを使うには、以下のようなJavaScriptを記載します。 window.ondevicemotion = handling; func
JavaScriptエラー時にエラーを分かりやすく通知してくれるChrome拡張「JavaScript Errors Notifier」:phpspot開発日誌
JavaScriptエラー時にエラーを分かりやすく通知してくれるChrome拡張「JavaScript Errors Notifier」 2011年05月10日- JavaScript Errors Notifier - Chrome ウェブストア JavaScriptエラー時にエラーを分かりやすく通知してくれるChrome拡張「JavaScript Errors Notifier」 エラーがあった場合に、アドレスバーの星アイコンのとなりに次のように通知してくれます。 アイコンをクリックすれば具体的なエラー内容が分かるという物。 赤のアイコンでエラー検知が分かりやすくていいですね。 通常の状態ではエラーがあろうと、デベロッパーツール等でコンソールを開いてない限り気づくことは出来ませんが、これは開発者は必須のツールかもしれませんね。 関連エントリ PHPのエラーなんかをブラウザで確認できるC
FirefoxやChromeでも使える！FlashとJSを使ってクリップボードにテキストをコピー出来るライブラリ「zeroclipboard」:phpspot開発日誌
FirefoxやChromeでも使える！FlashとJSを使ってクリップボードにテキストをコピー出来るライブラリ「zeroclipboard」 2009年01月19日- zeroclipboard - Google Code The Zero Clipboard library provides an easy way to copy text to the clipboard using an invisible Adobe Flash movie, and a JavaScript interface.FirefoxやChromeでも使える！FlashとJSを使ってクリップボードにテキストをコピー出来るライブラリ「zeroclipboard」。 クリップボードへテキストコピーというと、IEだけ、とか、他のブラウザ対応にはハックが必要で面倒、みたいな印象がありますが、zeroclipbo
javascriptがrubyを駆逐する - Scene Research Station
rubyに限らず同系統のLLはjavascriptに滅ぼされるんじゃないかと先輩が言ってたので、流石にそりゃないでしょうと言ったところ、以下の反論をされた。 サーバも同じ言語で書けるメリットは大きい最近のjsは速くなった。他のLLよりもずっと速い 速度については、幾つかのベンチマークを組み合わせて評価している Which programming language is fastest? によると、確かにjs(というよりv8)が他のスクリプト言語をちぎっている *0 。v8はただのフィボナッチだとCに迫る速度だ。恐ろしい。crankshaftでさらに1.5倍ほど高速化するらしいし、ブラウザの開発競争が続く限りjsの速度的な優位は他のLLと比べてますます大きくなるであろう状況にある。 さて、速度的にも優位だしクライアントとの親和性も抜群とくれば、もはやnode.jsを使わない理由は無く、他のL
JavaScriptの構文エラーやコーディング規約上の問題をチェックしてくれる「JSHint」が便利そう - F.Ko-Jiの「一秒後は未来」
ReadWriteWebで、自分や他人が書いたJavaScriptにエラーや問題が潜んでいないかどうかをチェックしてくれる「JSHint」というツールが紹介されていました。 この JSHint というツールは「JSLint」というDouglas Crockford氏が開発したツールを元にしていて、より柔軟かつチームでの開発を配慮した設計になっているそうです。 基本的な構文チェックだけでなく、それぞれのコーディング規約に基づいた書き方になっているかどうかをチェックできるように、多くのオプションが用意されています。 ↑ 用意されているオプション。 ↑ 試しに自分が書いたJavaScriptをデフォルトのオプションでチェックしてみたところ、色々と問題を指摘されました。 ↑ チェックする環境として、ブラウザ以外に ES5 や Node.js といった環境を選ぶこともできます。 チームで決めたコーデ
【レポート】はやりのJavaScript実装法「フィーチャーディテクション」は万能ではない? | エンタープライズ | マイコミジャーナル
Google Chrome runs web pages and applications with lightning speed. WebアプリケーションやWebサイトの開発にあたり、クロスブラウザ対応や将来リリースされるブラウザに対応するための開発テクニック「フィーチャーディテクション」が注目されている。フィーチャーディテクションではブラウザがサポートしている機能を調査し、機能がサポートされている場合にはその機能を使って実装を進めるというアプローチをとる。この方法であればどのブラウザを使っているのかを気にする必要がなく、また、将来のバージョンのブラウザで機能がサポートされた場合に、自動的にその機能が利用できるようになる。ブラウザの種類で処理を切り分ける従来の方法よりも柔軟性が高く効果的だとして注目されている。 しかし「フィーチャーディテクション」の方法に問題がないわけではない。最大の
【提案】onkeypressの正しい併用の仕方！ - 研究室
JavaScript、Ajax、HTML5(API)、Ruby…Web及び関連技術の実験&情報公開&制作物紹介。 前エントリー（onkeypress、乱用禁止！）からの続きです。 お暇なら、前エントリーからお読みください。 onkeypress イベント属性の正しい指定の仕方を提案します。 主に『onclickと同時にonkeypressイベント属性を指定する場合の正しい指定の仕方』という視点での提案です。 ざっくりとまとめると、対処法としては以下の3パターンがあります。 onkeypressは使わない！（onkeypressの指定を削除する） onkeypressイベントハンドラにフィルターをかける その他（個別の対応が必要） 【2007/05/02】追記。
JavaScript入門講座
今日の内容 JavaScriptを勉強し始めくらいの人を対象にしたJavaScript入門講座的なもの 文法とかは調べればわかるのでふれません 一人で勉強してもわからなそうな概念などを重点的に説明します ライブコーディングするのでJavaScriptってこんな感じて作るんだなーというのがわかってもらえればと アジェンダ JavaScriptを勉強する前に JavaScriptの基礎知識 ライブコーディング part1 jQueryの基礎知識 ライブコーディング part2
特定の画像の読み込みが完了したら何かする方法 - JavaScript TIPSふぁくとりー
《2017年6月4日 4:00 PM 公開/更新》 特定の画像の読み込みが完了したら何かする方法 [イベント] 画像の読み込み完了を待ってから、JavaScriptで何らかの処理(スクリプト)を実行させたい場合の記述方法を解説。onload属性に関数を指定することで実行する方法と、addEventListenerを使って画像のloadイベントに処理を追加する方法の2通りを紹介しています。画像の読み込み完了時に表示を変化させることで、待ち時間を紛らわすなどにも活用できるでしょう。 特定の画像の読み込みが完了してから何かの処理を実行する方法 画像の読み込み中と読み込み完了後で表示を変化させる例 画像の読込完了時に何か処理を行う方法1：onload属性に関数を指定する 画像の読込完了時に何か処理を行う方法2：addEventListenerを使ってloadイベントに処理を追加する方法 特定の画像
Dean Edwards: How To Load And Parse XML Data Without ActiveX
A little known but cool feature of Internet Explorer is its support for XML data islands. Basically, you can embed some XML data in a page like this: <html> <head> <xml> <root>Some data</root> </xml> </head> Even cooler, you can reference an external data source: <xml src="data.xml"></xml> The classic “Ajax” way to load XML data involves a couple of ActiveX objects: var http = new ActiveXObject("M
IE7でwindowを closeする時に警告を出さない方法
► 2018 (1) ► 1月 (1) ► 2017 (4) ► 6月 (3) ► 5月 (1) ► 2016 (15) ► 12月 (4) ► 11月 (1) ► 10月 (2) ► 7月 (3) ► 6月 (1) ► 5月 (3) ► 1月 (1) ► 2015 (13) ► 12月 (1) ► 10月 (1) ► 9月 (1) ► 6月 (1) ► 5月 (1) ► 3月 (2) ► 2月 (3) ► 1月 (3) ► 2014 (11) ► 12月 (1) ► 9月 (2) ► 8月 (2) ► 6月 (1) ► 4月 (4) ► 2月 (1) ► 2013 (15) ► 12月 (3) ► 11月 (3) ► 8月 (2) ► 7月 (4) ► 5月 (1) ► 4月 (2) ► 2012 (7) ► 10月 (1) ► 7月 (1) ► 4月 (3) ► 1月 (2) ► 20
IT戦記 - JavaScript を学ぶ際に一番重要なのに、誤解されがちな setTimeout 系の概念
おそらく、JavaScript を使いこなす肝は setInterval、setTimeout、イベントによる関数の実行を理解することだと思う 例えば 次のコードの結果を考えたとき document.write("hoge\n"); setTimeout(function(){ document.write("fuga\n") }, 1000); document.write("piyo\n");普通に JavaScript を使いこなしてる人なら、hoge → piyo と表示して、 1 秒後に fuga が表示されるな。って思うはずなんです。 でも、 JavaScript を始めたばっかりの人の中には、 hoge と表示したあと 1 秒後に fuga → piyo と表示するな。って思ってる人が非常に多い。(経験的に) 何故か？ たぶん、どのサイトの setTimeout の説明を見て
IEでのonBeforeUnload の挙動 | Inside ASCADE
Javascript で onBeforeunload を利用したときに IE の挙動が直感的な操作とは異なったため、調査をすることにしました。 何が直感的ではなかったかというと、<a> タグの href で javascipt を呼び出した場合に location を変化させない（つもり）にもかかわらず、onBeforeunload イベントが発生したことです。ちなみにFirefoxではこの場合にイベントは発生しません。 ちょっと調べたところ、MSDN に仕様があったので、挙動確認のサンプルを作成してみました。 各サンプルの実行はご覧のブラウザをIEに変更していただき 各sampleのTEST をクリックしてください。 MSDN onbeforeunload site : http://msdn.microsoft.com/en-us/library/ms536907.aspx
JavaScript : onBeforeUnload
書式 <タグ onBeforeUnload = "イベント発生時の処理"> オブジェクト.onbeforeunload = "イベント発生時の処理" 説明 次のページに移動する時（リロードされた時も含む）に発生します。onUnloadイベントよりも前に発生します。また、returnで何か値を返すと（nullでも結果は同じ）、本当に他のページに移動するかどうかの確認ダイアログが表示されます。 サンプルコード [実行] <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8"> <title>Sample</title> <script type="text/java
「Google JavaScript Style Guide」に沿ってチェックしてくれる、グーグル製JavaScript文法チェッカー
「Google JavaScript Style Guide」に沿ってチェックしてくれる、グーグル製JavaScript文法チェッカー グーグルはJavaScriptコードのスタイルガイド「Google JavaScript Style Guide」を公開しており、同社自身もこのスタイルに従って開発を行っているとされています（スタイルガイドの日本語訳の例）。 このスタイルガイドに従った開発を支援してくれるツールがグーグルからオープンソースとして公開されました。同社のClosure Tools Blogのエントリ「Introducing Closure Linter」で紹介された文法チェックツールのClosure Linterです。 Closure LinterはPythonで書かれたツールで、コマンドラインから利用します。上記のエントリによると、次のようなJavaScriptをチェックに書
smartdialog.js - 画面全体にレイヤーを重ねてダイアログを表示する JavaScript ライブラリ
「Yahoo!画像検索」や「Lightbox」のように、画面全体にレイヤーを重ねてダイアログを表示する JavaScript のライブラリです。 他のライブラリと比較して、任意の色を背景色に選ぶことができ、CSS ファイルや透過画像が不要だという長所があります。 別途、「prototype.js」と「scriptaculous.js(effects.js)」のライブラリが必要です。 サンプル デフォルトの動作（ホワイトアウト） グレーアウト・待ち時間なし・閉じるボタンなし・枠線なし・200px × 50px 縦長・待ち時間なし・緑二重枠線 薄いピンク(不透明度 0.5)・待ち時間 3 秒・ダイアログなし ブルースクリーン・待ち時間なし・同色ダイアログ・背景クリック無効・ボタンのラベル変更 画像を表示・枠線 1px・500px × 400px ダウンロード smartdialog.js v1
第1回 詳説：デベロッパーツールの使い方 | gihyo.jp
こんにちは、Google Chrome ExtensionsのAPI ExpertとChromium-Extensions-Japan管理人を担当している、太田と申します。いつもはクロスブラウザで連載していますが、今回はGoogle Chromeのデベロッパーツールについて紹介します。 昨今のJavaScript、HTML、CSSブームの背景には、開発環境、特にFirebugに代表されるようなデバッグツールの目覚しい発展が大きく貢献していると思われます。その反面、高機能化するデバッグツールの各種機能を使いこなすことが難しくなってきているという現実もあります。そこで、今回から全4回でGoogle Chromeに搭載されているデベロッパーツールの使い方とそれを利用したデバッグ・チューニングのノウハウをお届けしたいと思います。第1回はデベロッパーツールの機能紹介と基本的な使い方を解説します。 な
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
How to parse the bookmark file with java? - Google Chrome Help
このオブジェクトではサポートされていない操作です | akkun_choi pedia
ルーレット式ランダムリンク - JavaScript Market