Saicron's リファレンス

jQuery.old

最終更新:

saicron

- view
管理者のみ編集可

jQuery.old

jQuery is a new kind of JavaScript Library.

jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. jQuery is designed to change the way that you write JavaScript.
+ jQueryとは…
jQueryとは


Contents



リファレンス

+ リファレンス…
リファレンス


Official






jQueryを始める

jQueryを書く場所、書き方

+ ダウンロードしたローカルのjQueryファイルを使う…
ダウンロードしたローカルのjQueryファイルを使う
jQueryをダウンロードする
  • Downloading jQuery - jQuery
    • Current Release(最新版)、Minified(jQueryを使うとき)、Uncompressed(jQueryファイル自体を読むとき)。
HTMLファイルでjQueryを使えるようにする。
<html>
<head>
  <script type="text/javascript" src="path/to/jquery.js"></script>
  <script type="text/javascript">
    // ここに処理を記述します。
  </script>
</head>
<body>
  <a href="http://jquery.com/">jQuery</a>
</body>
</html>
 
jQueryを使い始めるには - jQuery日本語リファレンス
+ インターネット上のjQueryファイルを使う…

インターネット上のjQueryファイルを使う

Google AJAX Libraries API
+ 直接 src=…でリンクする…
region(直接 src=…でリンクする
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script>
$(function(){
  $("#test").html("Hello World!")
});
</script>
</head>
<body>
 
<div id="test"></div>
 
</body>
</html>
 
  • <head>内の<script src=… がjQueryファイルへのリンク。
  • <head>内の<script>…</script>にjQuery(JavaScript)のプログラムコードを書く。

ツール

  • ScriptSrc.net (GoogleにホスティングされているjQueryなどのタグをクリップボードにコピーする)
    • <script src=… の箇所。これをファイルに貼り付けるだけでいい。
+ JavaScriptでロードする…
JavaScriptでロードする
<html>
<head>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">google.load('jquery', '1')</script>
</head>
…
 
  • google.load('jquery', '1')の'1'はjQueryのバージョン1シリーズの最新版を指定していることになる(Google AJAX Libraries API)

jQuery関数


.ready()


Event

マウスカーソルが要素の上に乗ったとき



Tutorial

+ jQuery Tutorial…
jQuery Tutorial


tmp



ダイアログ



関連ページ


jQuery



基本


jQuery UI

+ jQuery UIとは…
jQuery UI provides abstractions for low-level interaction and animation, advanced effects and high-level, themeable widgets, built on top of the jQuery JavaScript Library, that you can use to build highly interactive web applications.
jQuery UIは、JavaScript(Ajax)フレームワークjQueryのプロジェクトがjQuery用に開発している、以下の機能を提供するプラグインです。

  • ドラッグ&ドロップなどのマウス操作の機能拡張
  • ユーザーインターフェイスを改善するウィジェット(アコーディオン、日付入力、ダイアログ、スライダー、タブなど)

Easing

+ easingとは…
easingとは
easingとは、エフェクトの動きを加速/ 減速させるための関数です。
例えばフェードアウトの動きを考えたとき、通常は透明度の変化量は経過時間に対して線形です。全体で1秒かかって消える処理であれば、0.5秒経過時の透明度は0.5になります。
しかし、ここでeaseInQuadの動きを適用すると、変化量は線形ではなく2次関数の曲線になります。(下記サンプル参照)
そのため、最初はゆっくりと薄くなっていき、後半に急激に消えていくような効果が得られます。
Easing/jQuery (jQuery日本語リファレンス)
+ GSGD JQuery Easing Plugin…
このeasingプラグインでは、 version 1.3時点で32パターンが提供されています。
これ以外にもeasingは比較的容易に自作することが出来、animateなどと組み合わせることで豊かな表現が可能になります。
Easing/jQuery (jQuery日本語リファレンス)

可変グリッド

ウィンドウサイズを変えるとコンテンツが再配置される可変グリッドレイアウトです。

+ チュートリアル…
チュートリアル
+ 個別…
個別

プラグイン集


Resource

  • Ajax - php & javascript room

タグ:

JavaScript jQuery
記事メニュー
人気記事ランキング
ウィキ募集バナー