JavaScriptユーザエージェント判別・判定
Updated 2015.11.24 / Published 2015.04.02 新しいFirefox OSやWindows Phoneを含めた2015年現在のユーザエージェントを判定し分岐処理を行う手順をご紹介します。OSや機種毎の処理を行っていくには、もはや無理がありますので、タブレットかスマートフォンかを判別することのみにフィーチャーしています。 ユーザエージェント情報に依存して、分岐処理を行うと、常に付きまとう悩みの種が新しいOSの登場です。今年もすでにauからFirefox OSを搭載したスマートフォンであるFx0が新たに登場し、次いで日本国内でもWindows Phoneが発売されることが決まっており、ユーザエージェント情報に依存して処理を行っている部分は相次いで見直しを迫られることになりますので、以下、ご参考に活用いただければと思います。 var _ua = (functi
Slideout.js - A touch slideout navigation menu for your mobile web apps.
$ npm install slideout $ bower install https://github.com/mango/slideout.git $ component install mango/slideout 1. First of all, you'll need to have a menu ("#menu") and a main content ("#panel") into your body. <nav id="menu"> <header> <h2>Menu</h2> </header> </nav> <main id="panel"> <header> <h2>Panel</h2> </header> </main> 2. Add the Slideout.js styles (index.css) in your web application. body
Matter.js
Rigid bodies Compound bodies Composite bodies Concave and convex hulls Physical properties (mass, area, density etc.) Restitution (elastic and inelastic collisions) Collisions (broad-phase, mid-phase and narrow-phase) Stable stacking and resting Conservation of momentum Friction and resistance Events Constraints Gravity Sleeping and static bodies See all features
新しい地理院地図のソースコードがGitHubに公開されていたので、Fx0(FirefoxOS)にアプリとしてインストールしてみた。
国土地理院、「地理院地図」がスマホ対応、「触地図」特設サイトや西之島のGIFアニメも登場 スマートフォンやタブレット端末に対応して使いやすくなった地理院地図ですが、そのソースコードがGithubにて公開されています。 gsi-cyberjapan/gsimaps (利用する場合の注意点については、README.mdを参照ください) すごい……すごいぞ国土地理院！ これで、誰でも自分専用の地理院地図を作って利用することができますね！ すでに「地図タイルを追加する方法」を書かれている方も。 地理院地図に地図タイルを追加して公開する方法 そこで自分も、最近買ったばっかりのFx0に地理院地図をアプリとしてインストールしてみました。 やったこと 下記からzipファイルをダウンロード。 gsi-cyberjapan/gsimaps １．Firefox Developer EditionのWebIDEで
第3回 位置情報を取得してみよう（後編） | gihyo.jp
連載第3回目の今回は、JavaScriptを利用した位置情報の取得方法を解説します。 Geolocation APIを利用する Geolocation APIとは、JavaScriptで位置情報を取得するAPIのことで、現在W3Cで仕様を策定中ではありますが、Firefox 3.5やGoogle Chrome 5、Safari 5など、いくつかのモダンなブラウザではすでに利用できます。 ただし、プラグインや設定などによって利用できるかどうかは変わってくるため、コードの中で利用可否の判定を行う場合は、ブラウザ名とバージョンで判定するのではなく、geolocationオブジェクトが利用可能かどうかで判定するのが一般的です。 位置情報を取り扱うgeolocationオブジェクトは、window.navigatorから取得することができます。window.navigator.geolocation
第2回 TitaniumでTwitterクライアント | gihyo.jp
前回の記事で環境構築と土台となるプロジェクとの作成ができたので、今回から実用的なアプリの制作に入ります。数回にわけてTwitterクライアントを作成しますので、ネットワーク周りや画像の取り扱いまでTitaniumの簡便さを体験していただければと思います。 どんなものを作るか まずは、実際に作るアプリのイメージを固めましょう。TwitterアプリはiPhoneアプリの中でも優れたアプリが多く激戦区となっているジャンルです。一方でTwitterを使い込んでいくと自分のよく使うWebサービスと連携させたくなり、自分の使い方にカスタマイズしたアプリも欲しくなるものです。ということで、Twitterのひと通りの機能を実装しつつ拡張しやすいシンプルなアプリを目指しましょう。 図1 画面イメージ 画面構成としてはこのようなアプリをイメージしておきましょう。 まずはTableView Twitterアプリ
Use Appcelerator Titanium to build mobile apps for iPhone & Android and desktop apps for Windows, Mac OS X & Linux from Web technologies
In 2022, Axway made all private source code of the Titanium SDK public in the open source Titanium SDK GitHub repository. For more information, please read the full announcement and what you need to know about transitioning your apps. Amplify Enterprise Marketplace Today, Axway focuses on helping API development teams govern, secure, productize, and monetize APIs in a central marketplace—one you
2013年のWeb標準 | gihyo.jp
株式会社ミツエーリンクスの渡邉卓です。昨年の「2012年のWeb標準」と同様、2013年もWebコンテンツのフロントエンド設計および実装に関連した各種標準や、周辺領域の動きに関する短期的な予測を寄稿させていただきます。 2013年のWeb標準については「HTML5仕様の安定化」「タッチスクリーン環境の混沌」「ECMAScript 6」をキーワードとして取りあげます。 HTML5仕様の安定化 2012年12月17日、HTML5仕様は勧告候補（CR）に到達しました。同時にHTML Canvas 2D Contextも勧告候補（CR）になっています。よほどのことがない限り、HTML5は2014年中に勧告（Rec）予定です。W3CによるHTML5仕様は、一旦安定したといえるでしょう。 このリリースでW3Cは、「HTML5」としては大規模な仕様追加・削除・変更をこれ以上行わないと明言したことに
本当にあったTouchEventの怖い話 - Qiita
事前知識: ブラウザ毎の差異 Android 2.x, 3.x 2.x, 3.x では伝統的に TouchEvent がまともに使えません。 経験上、一部端末でdocument.createEvent('TouchEvent')するとNOT_SUPPORTED_ERRを吐くなどの現象が見られ、seleniumのこのコードでも、MouseEventsを利用して無理矢理回避しています。 4.x (Stock Browser & WebView) 4.x では、やっと TouchEvent が利用できるようになります。 が、 イベントの初期化方法が後述する iOS のソレと異なっています。同じくselenium上のコードではこのように回避しているのが見受けられます。 // Android's initTouchEvent method is not compliant with the W3C
JavaScriptグラフィックス
TOPICS Web , HTML/CSS , JavaScript 発行年月日 2012年03月 PRINT LENGTH 288 ISBN 978-4-87311-528-3 原書 Supercharged JavaScript Graphics FORMAT PDF Webテクノロジーが進化したことによりJavaScriptグラフィックスを使ったリッチなWebアプリケーション開発が可能になりました。本書ではJavaScriptによる最新のグラフィックスプログラミングについて解説します。ゲームやDHTMLエフェクト、HTML5 Canvasなどの実例を通して、高性能なJavaScriptグラフィックスの実装方法を学びます。グラフィックスやアニメーションだけでなく、WebSocketを用いた通信、Google Chart Tools、スマートフォン向けのトピックまで幅広く扱います。日本語
jQuery Mobile
TOPICS Programming , Web , HTML/CSS , JavaScript 発行年月日 2011年12月 PRINT LENGTH 192 ISBN 978-4-87311-526-9 原書 jQuery Mobile FORMAT PDF モバイルWebアプリ開発用のJavaScriptライブラリjQuery Mobileの解説書。jQuery Mobileの仕組みと使い方をチュートリアル形式で解説します。jQuery Mobileはスマートフォンやタブレット型PC向けのタッチアプリに最適化されたWebフレームワークです。jQuery Mobileを使えば、さまざまなデバイスで共通の表示と振る舞いをするモバイルWebアプリを簡単に開発できます。本書ではHTML5/CSS3/JavaScriptのコード例と画面例を使ってjQuery Mobileの使い方をステップバイ
[JS]スマホやタブレット向けの操作を楽しくするさまざまなアニメーションを実装できるスクリプト -Impulse
Bouncy Scrolling ※アニメーションGIFにしたらサイズがすごかったので静止画像です。 デモページには他にもたくさんのデモがあります。 Impulseの使い方 実装は各デモによってHTMLやJavaScriptが異なるので、「Pulldown Menu」で実装方法を紹介します。 Step 1: 外部ファイル 当スクリプトを外部ファイルとして記述します。 ここは全デモ共通です。 <head> ... <script src="/scripts/impulse.js"></script> </head> Step 2: HTML ヘッダ、メニュー、コンテンツをそれぞれdiv要素で実装します。 <body> <div class="nav-header"> <div class="hamburger-menu-handle"></div> </div> <div class="pu
![[JS]スマホやタブレット向けの操作を楽しくするさまざまなアニメーションを実装できるスクリプト -Impulse](https://cdn-ak-scissors.b.st-hatena.com/image/square/b00ab7bf5a19e33db792ea0ed5fb6335ba4f97e7/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201403%2F2014090106.png)
ChocolateChip UI
How to Print a Test Page on Epson Printer? What is a Printer Test Page? Printer Test Pages are used for checking several things with your printer for maintaining and resolving the troubleshooting issues with the ink cartridges on your printer or just in the general maintenance of your printer. What Problems will a Test Page Resolve? A printer test page will detect and […] Continue reading Document
Tapquo
The blog tapquo.com has been acquired by FindMyHosting.com. Its best and archived contents are kept alive as sub-pages of FindMyHosting.com/tapquo/ FindMyHosting.com takes no responsibility for the factual accuracy or anything else regarding the archived Tapquo contents posted under FindMyHosting.com/tapquo/ About Tapquo.com: Tapquo, founded in 2011, was built to develop meaningful projects design
jQuery Mobile
jQuery Mobile is no longer supported To read more about the status of the jQuery Mobile project, see the announcement blog post. A Touch-Optimized Web Framework jQuery Mobile is a HTML5-based user interface system designed to make responsive web sites and apps that are accessible on all smartphone, tablet and desktop devices. Seriously cross-platform with HTML5 jQuery Mobile framework takes the "w
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Effective web performance tuning for smartphone
Titanium Mobileで作る！ iPhone／Androidアプリ 記事一覧 | gihyo.jp
http://impulse.luster.io/
モバイル時代のWebパフォーマンス
Sorry, the website has been stopped