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’}); }