STEP 4 - タブパネルをプラグイン化してみよう！
Hypertext Markup Language の略。Webサイトをマークアップするためのマークアップ言語です。
Cascading Style Sheets の略。HTML や XML を装飾するために使われる言語です。
プラウザで動作するプログラム言語で、主に HTML や CSS を操作するために使われます。JS と略されることもあります。
JavaScript のライブラリのひとつです。比較的習得しやすいため、プログラミングに慣れていない Webデザイナーにも人気のライブラリです。
Webデザインをする上で、写真を補正したり、UIパーツを作るのに人気のソフトウェアです。
イラストを制作するのに適したソフトウェア。Webデザインでは幅広い用途で使われています。
Web制作におけるグラフィックを作成することに特化したソフトウェア。Photoshop や Illustorator に比べ、Web制作ならではの機能が充実しています。
作成したタブパネルを、メソッドにしてプラグイン化しています。
jQuery Code
$.fn.jqueryTab = function(){
this.each(function(){
var tab = this;
var activePanelId = $(".active a", tab).attr("href");
$(".panel > div:not(" + activePanelId + ")", tab).hide();
$("> ul a", tab).click(function(){
$("> ul li.active", tab).removeClass("active");
$(".panel > div", tab).hide();
$(this).parent("li").addClass("active");
$($(this).attr("href")).show();
return false;
});
});
return this;
};
$(function() {
$("#tab, #tab2").jqueryTab();
});