ので、振り直したい時はこうする。
array_merge(array_unique($array));
マージさせればいいんだね。
【PHP】array_unique()はインデックスを振りなおしてくれない。
【CSS3】box-sizingプロパティーでpadding、borderをwidth、heightに含めるか否かを操作する。
要素の幅や高さが絶対に変わってほしくない時に「box-sizing」を知っていると幸せになれる。
指定可能な値は下記の通り。
| 値 | 詳細 |
|---|---|
| content-box | padding と border の幅を要素の幅と高さに含めない。デフォルト値。 |
| border-box | padding と border の幅を要素の幅と高さに含める。 |
これをうまく活用すれば要素のサイズを自分の意図したサイズに固定することが出来る。
【HTML5/CSS3】placeholderの色をCSSで操作する。
webkit系とmoz系のみ対応している模様。
まずはwebkit。
/*コロンが2個な点に注意*/
input::-webkit-input-placeholder { color: red; }
次にmoz。
input:-moz-placeholder { color: red; }
colorだけではなくテキスト装飾系は大抵効いてくれる。
【jQuery】変数が空か判定する。
下記リンクにめちゃくちゃ便利でシンプルなプラグインがおいてあったのでメモ。
http://www.laktek.com/2011/01/07/jquery-isblank/
jQueryにisBlank()関数を追加する。
(function($){
$.isBlank = function(obj){
return(!obj || $.trim(obj) === "");
};
})(jQuery);
実行結果は下記の通り。
$.isBlank(" ") //true
$.isBlank("") //true
$.isBlank("\n") //true
$.isBlank("a") //false
$.isBlank(null) //true
$.isBlank(undefined) //true
$.isBlank(false) //true
$.isBlank([]) //true
ふぉぉぉぉい！めっちゃ便利！！
【jQuery】CSSを動的に読み込む。
jQueryプラグインにしてみた。といってもそんなにたいそうなことはしていない。
一応重複ロード機能付き。
(function($) {
$.loadCss = function(href) {
var links = $('head > link');
$.each(links, function(key, elem) {
if($(elem).attr('href') == href) {
return false;
}
});
$('<link>', {
rel: 'stylesheet',
type: 'text/css',
href: href
}).appendTo('head');
}
})(jQuery);
【CakePHP2.4】jsonpでビューを出力する。
CakePHP2.4以降からjsonp出力がサポートされたのでやってみる。
// コントローラー内のメソッド
public function index {
// 出力したいデータ
$result = ['hoge', 'piyo', 'fuga'];
$this->viewClass = 'Json';
$this->set([
'result' => $result,
'_serialize' => ['result'],
// 下記変数をセットすると出力がjsonpになる。
'_jsonp' => true
]);
}
呼び出しの際は、上記メソッドにアクセスし、クエリストリングで「?callback=functionName」を渡す。
※functionNameは任意の関数名。
これでレスポンスヘッダの「Content-Type」も「application/Javascript:」になってくれる。
【jQuery】秒速でタブUIメニューを実装する。
まずリストタグでメニューを定義。
var tabMenu = $('<ul>', {class: 'tab-menu'});
tabMenu.append($('<li>', {class: 'active'}).append($('<a>', {href: '#'}).html('タブ1')));
tabMenu.append($('<li>').append($('<a>', {href: '#'}).html('タブ2')));
tabMenu.append($('<li>').append($('<a>', {href: '#'}).html('タブ3')));
tabMenu.append($('<li>').append($('<a>', {href: '#'}).html('タブ4')));
tabMenu.append($('<li>').append($('<a>', {href: '#'}).html('タブ5')));
tabMenu.append($('<li>').append($('<a>', {href: '#'}).html('タブ6')));
tabMenu.append($('<li>').append($('<a>', {href: '#'}).html('タブ7')));
次に各タブのコンテンツ要素を定義
var tabContent = $('<div>', {class: 'tab-content'});
tabContent.append($('<div>').html('コンテンツ1'));
tabContent.append($('<div>').html('コンテンツ2'));
tabContent.append($('<div>').html('コンテンツ3'));
tabContent.append($('<div>').html('コンテンツ4'));
tabContent.append($('<div>').html('コンテンツ5'));
tabContent.append($('<div>').html('コンテンツ6'));
tabContent.append($('<div>').html('コンテンツ7'));
最後に挙動実装。
var tabs = tabMenu.children();
var contents = tabContent.children();
$.each(contents, function(key, elem) {
if(key != 0) {
$(elem).hide();
}
$(tabs[key]).click(function() {
var that = this;
var index = 0;
$.each(tabs, function(key) {
if(this == that) {
index = key;
}
});
$.each(contents, function(key) {
if(index == key) {
$(this).show();
$(tabs[key]).addClass('active');
} else {
$(this).hide();
$(tabs[key]).removeClass('active');
}
});
return false;
});
});
完了！！うん！！簡単だね！！
【Git】「core.autocrlf」の値を編集する。
めも。
git config --global core.autocrlf input # or git config --global core.autocrlf true #or git config --global core.autocrlf false
的な感じ。