jQueryは軽量のAjaxフレームワークです。JavaScriptの標準的なコーディングとは異なりますが、非常に短いコードで大きな効果があるスクリプトを記述できるようになります。prototype.jsがRuby風に記述できるライブラリだとすればjQueryはCSS風にJavaScriptを記述できるライブラリといえるでしょう。 主な特徴としては以下のとおりです。
jQueryで、CSSを操作して、アニメーションをしたい時があると思います。 そんなときはたいてい、 [js] $("#box1").css({color:"#F00"}).animate({left:"300px"},4000); [/js] の様なscriptを書くと思います。 また、 “アニメーションしてから、文字色変えたい!!” なんてことはよくあると思います。 そして、きっと僕みたいな人は、こんなコードを想像するわけです。 [js] $("#box2").animate({left:"300px"},4000).css({color:"#F00"}); [/js] しかし、現実は、こちらのデモのように、CSSが操作されてから、アニメーションをしてしまうのです。一番最初の例と全く変わらない動作をしてしまいます。 現実というのは時に残酷ですね。 実は、jQueryのanimateとい
This shop will be powered by Are you the store owner? Log in here
私はコンテンツを作るのは得意ですが、トップページがどうも苦手で…。 「まとめてゲーム」を作る際、トップページに何か華が欲しいと考えていました。 そこで思いついたのはサイトの要点を説明する、ちょっとしたムービーですね。 華やかなだけでなく、サイトを訪問者に知ってもらうこともできますので。 セオリーで言えばFlashを使用したいところです。 ただ一応使用経験はありましたが、もう5年ほど前の話です。 …完全に忘れてますね。(笑) 仕方ないので、何か簡単に実現できる方法が無いか?と探していたところ、jQueryのプラグインとして動作する「CrossSlide」というものを見つけました。 元々の用途はフェードを基本とした写真のスライドショーですが、使い方によってはFlashで作るような簡易的なムービーもどきも作れます。(笑) CrossSlideのメリットと機能とても簡単です。 これに尽きますね。(
Selectors/API/jQuery 基本 #id 指定されたidを持つ要素を選択する。 element 指定されたタグ名の要素を選択する。 .class 指定されたクラスを持つ要素を選択する。 * 全ての要素を選択する。 selector1, selector2, ..., selectorN 複数のセレクターを指定して集合要素を選択する。 階層 ancestor descendant ancestorを先祖に持つdescendantを選択する。 parent > child 親子関係を指定して要素を選択する。 prev + next 前後関係を指定して要素を選択する。 prev ~ siblings prev以降の兄弟関係にある要素を選択する。 基本フィルタ :first 先頭の要素を選択する。 :last 末尾の要素を選択する。 :not(selector) 指定したセレクターを
prettyPopin is a jQuery plugin that serves as a modal box. It is easily customizable and proved a lightweight solution to quickly and easily display content in context. It provides a nice way to display simple content or simple forms. If you want to display iframed content, video, images or flash, please take a look at prettyPhoto as it is a better alternative. For the full documentation, please t
Adobe の Creative Suite 5.5 が発表になりましたね。 Dreamweaver の進化っぷりが凄まじいです。マジで。 HTML5+CSS3への対応が目に付きますが、個人的にはjQuery MobileとPhoneGapフレームワークの導入に注目します。 アプリ開発はこれまで、Objective-Cやjavaが主流でしたがDreamweaverでアプリへの書き出しまで出来てしまうなんて…。今後、モバイルアプリケーションの統合開発環境のデファクトスタンダードになる予感が。 ってことで、まずはjQuery Mobileを理解せねば! jQery Mobile についてはまだ書籍はあまりなく洋書しかありませんでしたので、参考になる記事を取り上げてみます。 http://jquerymobile.com/ 本家サイト jQuery Mobile Gallery http://w
#ff0000">2009年6月3日更新:ブラウザの「戻る」でフェード状態が残らないように修正。またリンクになっていなくてもフェードの対象にするようにした。 マウスカーソルが画像の上に重なったとき、その画像ファイル名の最後が _rollout となっている場合、その _rollout 画像を _rollover にフェードさせるJavaScriptです。 クロスフェードするロールオーバー処理 動作サンプル サンプルのロールオーバー用の画像は次のようなファイル名になっています。 menu01_rollout.png 最初のメニューの標準画像 menu01_rollover.png 最初のメニューのロールオーバー画像 menu02_rollout.png 2番目のメニューの標準画像 menu02_rollover.png 2番目のメニューのロールオーバー画像 menu03_rollout.pn
Appetizers A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart. Lobster Bisque Smoked Salmon Terrine Tuna Ceviche Wild Mushroom Flan Almond Bruschetta Green Chilli Canapee Artichoke Rucula Salad Main Course Drops of rain could be heard hitting the pane, which made him feel quite sad. Wild Sea Bass Filet Linguini and Cla
外部htmlファイルをjquery-ajaxでインクルードしてメインのページに表示させる 外部に html で別ファイルを作り、それを読み込んでメインのページに表示させる方法です。まずはDemoを見てください。 1. jquery.js と ajax-dynamic-content.js をダウンロードする。 2.インクルードする html ファイルの <head> 部分に以下の2行を追記する。 <script type="text/javascript" src="ajax.js"></script> ← 適格場所は変更 <script type="text/javascript" src="ajax-dynamic-content.js"></script> ← 適格場所は変更
2009年に紹介したものを中心としたjQueryのプラグイン100選です。 カルーセル・ニュースティッカー関連 ギャラリー・画像拡大関連 ナビゲーション関連 タブ関連 パネル・ボックス関連 角丸関連
Check out Cycle2, the latest in the Cycle line of slideshows. Overview The jQuery Cycle Plugin is a slideshow plugin that supports many different types of transition effects. It supports pause-on-hover, auto-stop, auto-fit, before/after callbacks, click triggers and much more. It also supports, but does not require, the Easing Plugin. How it Works The plugin provides a method called cycle which is
There are several tutorials that walk people through how to create a jQuery slideshow, but there aren't many that focus on making it function without JavaScript. This is because most people believe it isn't possible but I am going to explain an exceedingly simple method that shows it is indeed possible. You'll soon be kicking yourself and asking "How did I not think of that?"… In this tutorial I w
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く