Amazon

ラベル jQuery の投稿を表示しています。 すべての投稿を表示
ラベル jQuery の投稿を表示しています。 すべての投稿を表示

2011年10月23日日曜日

スマートフォン向けWebアプリ開発に有用なリンク

iOSやAndroidなどのスマートフォン用のネイティブアプリを開発するにはObjective-CやJavaによる開発を行わなければならないが、
せめて見た目だけでもそれっぽく見せたいなら
jQuery Mobileが使えそう。

jQuery Mobileのドキュメント
iOSやAndroidのネイティブっぽいUIを作るためのjQueryのプラグイン

ナビゲーションバーに使えるアイコン(無償、有償)
http://glyphish.com/


jQuery Mobileを使用するには
http://jquerymobile.com/download/
から落としてくるか

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.min.css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.min.js"></script>
 
で直接呼び出す。 
 
Page-Themeを変更したければ
http://blog.livedoor.jp/aki_mana/archives/3458912.html 
 
【参考】 
jQuery mobile でスマートフォン用のフッターを作成 
jQueryのテンプレート 

JavaScriptでiOSアプリもAndroidアプリも開発
初心者でも2週間でiPhoneアプリが作れちゃうTitanium Mobileがすごい件 
Titanium MobileでiPhoneアプリを開発、リリースしました
PhoneGap

Titanium Mobileで作る! iPhone/Androidアプリ
 

2011年10月9日日曜日

Twitterのようなアプリを作る時に役立つ情報


○Twitterみたいに文字数を動的にカウントしてくれるjQueryのplugin
http://cssglobe.com/post/7161/jquery-plugin-simplest-twitterlike-dynamic-character-count-for-textareas

○jQueryの直接呼び出し
- Google Libraries APIを使用することでサーバーに置いておかなくてすむ
http://code.google.com/intl/ja/apis/libraries/devguide.html#jquery

jQuery
    name: jquery
    latest version: 1.6.4 (view older versions)
    load request: google.load("jquery", "1.6.4");
    extras: uncompressed:true (as in google.load("jquery", "1.6.4", {uncompressed:true});
    path: https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js
    path(u): https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.js
    site: http://jquery.com/
    note: 1.2.5 and 1.2.4 are not hosted due to their short and unstable lives in the wild...

jQuery UI
    name: jqueryui
    latest version: 1.8.16 (view older versions)
    load request: google.load("jqueryui", "1.8.16");
    extras: uncompressed:true (as in google.load("jqueryui", "1.8.16", {uncompressed:true});
    path: https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js
    path(u): https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js
    site: http://jquery.com/
    note: This library depends on jquery. You must also load jquery before loading this module. Version 1.8.3 is not hosted due to its short life, and the alias 1.8.3 actually loads 1.8.4.


使い方は二種類
1. 「Google AJAX Search API」からGoogle APIキーを貰って来る。WebサイトのURLを登録する必要がある。

各ライブラリの呼び出しにはgoogle.load()を使用してライブラリおよびその目的のバージョンの番号を付ける。例えば貰ったAPIキーが「ABCDEFG」だとして、後は下記のような感じでJavaScriptを記述する。
<script type="text/javascript" src="http://www.google.com/jsapi?key=ABCDEFG"></script>  
<script type="text/javascript">  
    google.load("prototype""1.6.0.3");  
    google.load("jquery""1.3.1");  
    google.load("jqueryui""1.5.3");  
    google.load("scriptaculous""1.8.2");  
    google.load("mootools""1.2.1");  
    google.load("dojo""1.2.3");  
    google.load("swfobject""2.1");  
    google.load("yui""2.6.0");  
</script> 

マイナーバージョン(1.x.yのx,y)を省略すると最新のバージョンを自動取得してくれる。



2. Google Libraries APIのpathから直接呼び出す。

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/blitzer/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
<script type="text/javascript"  src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/jquery-ui.min.js"></script>


のような感じ

Amazon3