')
.children()
.css("position", "relative")
.append('
')
.find("." + _arrowClass + "s")
.css({
"position": "absolute",
"top": _top,
"right": _right,
"color": arrowColor,
"font-size": "9px",
"line-height": "1",
"cursor": "pointer"
})
.find("." + _arrowClass)
.hover(function(){
$(this).css("color", arrowActiveColor);
}, function(){
if(!$(this).is("." + _activeArrowClass))
$(this).css("color", arrowColor);
})
.click(function(){
if($(this).is("." + _arrowClass + "-ascend")){
action.call($(this), j, "ascend");
}else{
action.call($(this), j, "descend");
}
});
break;
}
//動作部
var action = function(colNo, mode){
$tbody = $table.find("tbody");
var $tr = $tbody.find("tr");
var trArr = $.makeArray($tr);
trArr.sort(function(tr1, tr2){
var $tr1 = $(tr1),
$tr2 = $(tr2);
var cell1 = $tr1.find("th, td").eq(colNo).text(),
cell2 = $tr2.find("th, td").eq(colNo).text();
//大文字小文字を区別する場合
if(options.caseSensitive){
cell1 = cell1.toLowerCase();
cell2 = cell2.toLowerCase();
}
return cell1 == cell2 ? 0 : cell1 > cell2 ? 1 : -1;
})
//逆
if(mode == "descend") trArr.reverse();
$tbody.empty().append($(trArr));
//色変更
$chColor = $(this).is("." + _arrowClass) ? $(this) : $(this).siblings("." + _arrowClass);
$thead.find("." + _arrowClass)
.removeClass(_activeArrowClass)
.css("color", arrowColor);
$chColor
.css("color", arrowActiveColor)
.addClass(_activeArrowClass);
if(callback) callback.call($table[0]);
};
})
});
};
/*** tblHover ***
■設定
$obj.tblHover({
type: "cross", //"cross" or "row" or "col" or "cell"
hoverClass: "hover",
onlyTbody: true,
ignoreTh: true,
clickMark: true
});
■解説
テーブルのセルにマウスオーバーでマーカーとしてクラス：[設定:hoverClass]を追加。
[設定:type]は
"cross" : 行、列両方にマーカー
"row" : 行だけにマーカー
"col" : 列だけにマーカー
"cell" : 対象セルだけマーカー
[設定:clickMark]がtrueならクリックでマーカー固定。
[設定:onlyTbody]がtrueならtbody内だけで、theadとかtfoot無視。
[設定:ignoreTh]がtrueならthは無視。
*************************************************/
$.fn.tblHover = function(options ,callback){
options = $.extend({
type: "cross", //"col" or "row" or "cell" or "cross"
hoverClass: "hover",
onlyTbody: true,
ignoreTh: true,
clickMark: true
},options);
var $this = this;
var cellTag = options.ignoreTh ? "td" : "th, td";
var clicked = false,
colored = false,
hover = true;
return $this
.each(function(i){
var $table = $(this);
//テーブル以外ならスルー
if(!$table.is("table")) return true; //continue
var $thead = $table.find("thead"),
$tbody = $table.find("tbody"),
$tfoot = $table.find("tfoot");
if(options.onlyTbody) $table = $tbody;
var $trs = $table.find("tr");
$trs
.each(function(i){
$tr = $(this);
$tr.find(cellTag)
.each(function(j){
var $cell = $(this);
$cell
.hover(function(){
if(hover)
action.call(this, [i, j], 0);
}, function(){
if(hover)
action.call(this, [i, j], 1);
});
if(options.clickMark)
$cell
.click(function(){
if(!clicked){
clicked = [i, j];
hover = false;
}else{
if(clicked[0] == i && clicked[1] == j){
//action.call(this, [i, j], 1);
clicked = false;
hover = true;
}else{
action.call(this, [colored[0], colored[1]], 1);
action.call(this, [i, j], 0);
clicked = [i, j];
}
}
});
//動作部
var action = function(addr, remove){
var method = remove ? "removeClass" : "addClass";
var row = addr[0],
col = addr[1];
var $target = $(this);
switch(options.type){
case "cell":
if(remove) $target = $trs.eq(row).find(cellTag).eq(col);
break;
case "row":
$target = $trs.eq(row).find(cellTag);
break;
case "col":
$target = $trs.map(function(){
return $(this).find(cellTag)[col];
});
break;
case "cross":
default:
$target = $trs.map(function(k){
var $tgCell = $(this).find(cellTag);
return row == k ? $tgCell.get() : $tgCell[col];
});
break;
}
colored = [row, col];
$target[method](options.hoverClass);
};
});
});
});
};
/*** pageInit ***
■解説
$obj.pageInit({
hogehoge : fugafuga
}, callback);
$("body")がhogehogeな時に$(fugafuga)を対象にcallback(hogehoge, fugafuga)する。
ちなみにcallbackは[対象Object]のメソッドとして実行されるのでthisは[対象Object]になる。
■例
$obj.pageInit({
".foo" : "#id1",
".bar" : "#id2"
}, function(test, target){
$(this).addClass("baz");
});
*************************************************/
$.fn.pageInit = function(mapping, callback, options){
options = $.extend({
testObject: "body"
}, options);
var $this = this;
var $body = $(options.testObject);
if(callback && typeof callback == "string")
callback = $.isFunction(eval(callback)) && eval(callback);
if(!mapping || !callback || !$.isFunction(callback)) return $this;
$.each(mapping, function(i, v){
if($body.is(i)){
$this.find(v).each(callback, [i, v]);
}
});
return $this
};
})(jQuery);
←反応する
←反応する
←反応しない
←反応しない
←反応しない
←中の画像が切り替わる
↑リンクマウスオーバー時、ID:fugaの画像（yyy.jpg）が切り替わる。
←これ自身が切り替わる
*************************************************/
$.fn.chimg = function(options){
options = $.extend({
exclude: "active",
prefix: "",
postfix: "_o",
targetAttr: "target",
prefixAttr: "prefix",
postfixAttr: "postfix",
rolloverAttr: "rollover",
autoActive: false,
acceptNotLink: false
},options);
var exclude = options.exclude,
acceptNotLink = options.acceptNotLink;
var $this = this;
return $this
.each(function(){
var $elms = $(this);
//リンク以外を許可するか
if(acceptNotLink){
var tags = "img, input:image";
$elms = $elms.is(tags) ? $elms.filter(tags) : $elms.find(tags);
}else{
var tags = "a, area, input:image";
$elms = $elms.is(tags) ?
$elms.filter(tags) :
$elms.parents(tags).length ?
$elms :
$elms.find(tags);
}
if(!$elms.length) return true; //continue
$elms
.each(function(){
var $elm = $(this);
//操作対象
var target = $elm.attr(options.targetAttr);
var $target = target ? $("#" + target) : $elm;
var tags = "img, input:image";
$target = ($target.is(tags) ? $target : $target.find(tags)).eq(0);
//prefix,postfix設定
var prefix = $elm.attr(options.prefixAttr);
var postfix = $elm.attr(options.postfixAttr);
prefix = prefix ? prefix : options.prefix;
postfix = postfix ? postfix : options.postfix;
var src = $target.attr("src");
if(!src) return true; //continue
//マウスオーバーイメージのパス
var osrc = $elm.attr(options.rolloverAttr);
if(!osrc){
var ftype = src.substring(src.lastIndexOf("."));
var imgName = src.replace(ftype, "");
if(src.lastIndexOf("/") != -1)
imgName = imgName.substring(src.lastIndexOf("/") + 1);
osrc = src.replace(imgName, prefix + imgName + postfix);
}
$.preload(osrc);
//除外設定
var isExclude = !!($target.is("." + exclude) || $target.parents("." + exclude).length);
//autoActive
if(options.autoActive && isExclude){
$target.attr("src", osrc);
}
//動作部
var action = function(chsrc){
if(!isExclude)
$target.attr("src", chsrc);
};
//イベント
$elm.hover(function(){
action(osrc);
}, function(){
action(src);
});
});
});
};
/*** テーブル(やリスト等)交互色 ***
■設定
$obj.alternate({
evenClass: "even",
oddClass: "odd",
onlyTbody: true,
childOnly: false,
rowTag: false
});
■解説
[対象Object]内のtrやliタグなんかに交互に
class="[設定:oddClass]"とclass="[設定:evenClass]"を付与する。
cssで色をつければ交互色に。
table要素で使われる場合に、[設定:onlyTbody]がtrueの場合、theadやtfoot内の
trをカウントしない。
[設定:childOnly]がtrueの場合、子要素のみに適用される。(孫以下スルー)
[設定:rowTag]が指定されている場合、その指定したobjectに交互に
class付与される。（タグ(例:"div")でもクラスでも(例:".hoge")OKっす）
■例（こんなかんじになるよ、と）