ネットで簡単☆ お小遣いをもらっちゃう方法を一緒に勉強しましょう♪
--/--/--(--)--:--
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。


2009/07/04(土)00:54
この前、JavaScriptで改造をすると言ったからには、
少しは何かやってるぜ!って感じを見せとかないとね。

ということで、今日JavaScript + jQueryを使って、アコーディオンUIを作ってみました。
(作ったと言ってもサンプルを少しいじっただけですが...^^;)


さて、何かいろいろと意味不明な言葉が出てきましたね^^;

JavaScriptは、前回少し説明したので良いとして、

・jQuery
・アコーディオンUI

って何じゃい!!ですよね。

「jQuery」は、そのまま「ジェイクエリ」と読みます。
説明が難しいんですが、ライブラリと言ってJavaScriptで使える色んな機能がまとまっているものです。

てか、ライブラリだとか、そんなのは知らなくていいです^^;
知らなくても大丈夫なように、僕がフォローします♪


次は、アコーディオンUIです。
アコーディオンとUIという言葉をくっつけて僕が勝手に作った言葉です。

では、アコーディオンを使って「jQuery」「UI」「アコーディオン」を
簡単に説明しますので、下のアコーディオンで遊んでいってください^^



       

↓アコーディオン↓

アコーディオン試作

JavaScriptとjQueryを使って、何か作ってみたかったので
視覚的にも興味を惹き、jQueryの面白さを感じてもらえるかな?
と思ったので、アコーディオンを作ってみました^^
カチカチいじって、JavaScriptの面白さを感じてみてください^^

JavaScript + jQueryについて

jQueryというのは、JavaScriptにおける色んな処理を、
簡単に実現できるようにするライブラリです。
jQueryは少し説明が難しいので、読み飛ばしてください(笑)

ちなみに、最近、人気が出てきているライブラリのようです。

UIとは

UIとは、「User Interface」の頭文字を取ったものです。
簡単に言えばブラウザの「戻る」ボタンとか、
「更新」「中止」ボタンのようなものがUIです。
※"簡単に"言うとですので、厳密には違います。

アコーディオンとは

あなたがカチカチいじっているモノがアコーディオンと呼ばれるUIです。
ユーザ・インターフェースがどんなものか大体イメージつきましたか?
このように、jQueryを使えば自分のサイトで色んな表現ができるようになります^^

ソースについて

このアコーディオンのソースの公開についてですが、
僕自身、jQueryは勉強中ということもあって、
いい加減なソースを見せたくないという気持ちはありますが、
要望があれば、実装までの流れを紹介しようと思います。

と言っても、サンプルはネットにゴロゴロありますので、
作ろうと思えば誰でも作れるので、試してみてください^^


と、これがアコーディオンというものです^^
なかなか面白いですよね。

ただ、調子に乗ってこういうのをやりすぎるとサイトが重くなって
ユーザビリティの低下を招くことになります(笑)

何事もバランスが大事ですね^^



コメント
この記事へのコメント
これいいですね!

なんかに使えないかと思案中です。
トップページに使えそうだなぁ、、、とか(笑)

2009/07/04(土) 02:39 | URL | るじゅ #-[ 編集]
おはようございます。
休んでる間、訪問ありがとうございましたo(_ _)o
これすごいですね!さすがseccoさん^^
いろいろ知ってますね!勉強になりますよ~。
作り方とか紹介してくださいね^^
2009/07/04(土) 05:48 | URL | ananpapa 「無料でお小遣い稼ぎやってみる!!」 #-[ 編集]
>るじゅさん
アコーディオンはトップページにもいいですけど、
用途がいろいろ考えられるので、オススメなUIです^^
そのうち作り方UPしますね^^

>ananpapaさん
おかえりなさい^^
他にも面白いUI作れるんですよ♪
他のもそのうち紹介します^^
2009/07/04(土) 08:59 | URL | secco #-[ 編集]
管理人のみ閲覧できます
このコメントは管理人のみ閲覧できます
2009/07/04(土) 19:20 | | #[ 編集]
管理人のみ閲覧できます
このコメントは管理人のみ閲覧できます
2009/07/04(土) 19:21 | | #[ 編集]
seccoさん
一括応援できました。
お忙い中
無知な私に、親切、丁寧な指導
何より貴重な時間をさいていただいて
本当に有難うございました。
これからもseccoさんについていきます
師匠
今後とも宜しくお願いします。
(^0^)凸。
2009/07/05(日) 10:35 | URL | クロマティー #-[ 編集]
コメントを投稿する
URL:
Comment:
Pass:
秘密: 管理者にだけ表示を許可する
 
トラックバック
この記事のトラックバックURL
http://seccosecco.blog53.fc2.com/tb.php/79-29e193f9
この記事にトラックバックする(FC2ブログユーザー)
この記事へのトラックバック
ランキング参加中

seccoのブログは皆さんの
応援に支えられています。


ワンクリックで応援できます。
ポップアップをブロックしている場合、
正常に動作しません。
リンクをクリックしてください。

brog_ranking


TREview

カテゴリ

最新コメント

相互リンク

おすすめASP
Yahoo!ローグル

無料SEOツール

キーワードアドバイス
ツールプラス


URL

サイトタイトル

ディレクトリ登録
by ホームページ登録

サイトマップラス

サイトマップラス
Powered by SEO対策

アクセスアップ対策
アクセスカウンター




アクセスランキング

プロフィール

secco

Author:secco
ネットでお小遣い稼ぎの方法を勉強中です。

ブログ内検索

月別アーカイブ
ブログを書いて稼ごう
オススメ書籍

RSSリンクの表示
ブロとも申請フォーム
ブログランキング

コミュニティ


ブロガー(ブログ)交流空間 エディタコミュニティ

MindManager
 | seccoのブログで小遣い稼ぎTOPへ | 
Copyright © seccoのブログで小遣い稼ぎ All Rights Reserved.

Designed by DAIGO / Material by 素材くん「無料WEB素材屋」
レーシック
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。