yuheijotaki.com

2015/04/03 : 
jQuery スニペット

ファイル整理のためメモ

//
$(function(){
});

//
$(window).on('load', function(){
});

//
$(window).on('resize', function(){
});

//
$(window).on('load resize', function(){
});

//
hoge();
function hoge() {
}

//
$('.hoge').each(function(){
});

//
$('.hoge').click(function() {
});

//
if ( $('.hoge').hasClass('active') ) {
	//alert('activeクラスがあります');
} else {
	//alert('activeクラスがありません');
}

// 秒間隔
setInterval(function(){
},1000);

// 秒後
setTimeout(function(){
},1000);

// 秒後 clearInterval
timerID = setInterval(function(){
},1000);
clearInterval(timerID);

//
var windowWidth = $(window).width();
var windowHeight = $(window).height();
var hogeWidth = $('.hoge').css('width');
var hogeHeight = $('.hoge').css('height');

// css
$('.hoge').css({'width':'1000px'});

// important
$('.hoge').css({'cssText': 'width: 1000px !important;'});

// 2の倍数
$('.hoge:nth-child(2n)');

// 何番目(0~)
$('.hoge').eq(0);

// animate
$('.hoge').animate({'top':'0px'},100,'linear');

// scrollTop
$('html,body').animate({scrollTop:0},100,'linear');

// 要素があれば
var elm = $('hoge').length;
if (elm) {
} else {
}

// cssプロパティが合えば
var tgt = $('.hoge');
if(tgt.css('display')=='none') {
} else if (tgt.css('display')=='block') {
}

// リンク拡大
$('.hoge').click(function(){
	var tgtLink = $('a' ,this).length;
	if (tgtLink) {
		window.location=$(this).find('a').attr('href');
		return false;
	}
});
$('.hoge').hover(function(){
	$(this).css({'cursor':'pointer'});
},function(){
	$(this).css({'cursor':'default'});
});

// 画像パス 差し替え
var tgtPath = $('hoge img').attr('src');
var replacePath = tgtPath.replace('logo_active.png','logo.png');
$('hoge img').attr({src:replacePath});

// select 変更
$('.hoge').change(function () {
	var tgtVal = $('.hoge option:selected').val();
	if ( tgtVal == 'A' ) {
		// if 'A'
	} else if ( tgtVal == 'B' ) {
		// if 'B'
	}
}).change();

// input textarea focus / blur
$('input, textarea').focus(function(){
	// focus
}).blur(function(){
	// blur
});

// ストップウォッチ
stopWatch();
function stopWatch() {
	var startTime =  (new Date()).getTime();
	setInterval( function(){
		$('.watch').text(((new Date()).getTime()-startTime)/1000).toFixed(2);
	}, 100);
	$('body').append('<p class='watch'></p>');
	$('.watch').css({'position':'absolute', 'top':'0', 'left':'0', 'color':'#000', 'background':'#fff'});
}