「スニペット」タグアーカイブ

忘れがちなことの記事メモと忙しいので突っ込んどく系の記事メモ

忘れがちなことメモ

【CSS】ul,olのリストを横並びにするときにfloatじゃなくてdisplay:inline-blockを使う方法 | delaymania

【CSS】ul,olのリストを横並びにするときにfloatじゃなくてdisplay:inline-blockを使う方法

display: none; のDOMに対してtransitionを使う際の注意 – Qiita
https://qiita.com/gonshi_com/items/4ae066ef4bea6d519854

backgroundまとめ。ショートハンド、複数指定、各プロパティ – Qiita
https://qiita.com/katsunory/items/1e952d3f5ab2a0306c4d
続きを読む 忘れがちなことの記事メモと忙しいので突っ込んどく系の記事メモ

css 忘れがちな書き方とか

まついさんだ〜(知り合いではないがよくアイコン見かけるので心のなかでペンギンの人と呼んでいる)
よく忘れるCSSの小技 – Qiita
http://qiita.com/matsui_q/items/9de76659429593ed7a88

べんりだ〜。やっぱペンギンの人いい人だ〜〜。
親要素いっぱいに領域を広げるやつとか:after要素用に便利だよね。

sublime text スニペット

保存場所をすぐ忘れるのでメモ

■保存場所(mac)
/Users/[**user name**]/Library/Application Support/Sublime Text 2/Packages/User/snippets

■せつめいしてくれているやつ(あとでよむ)
http://succi.jp/blog/?p=257

■Sublime Text 2でjQuery用のスニペットを自作するときの注意点 | REFLECTDESIGN
http://re-dzine.net/2012/10/jquery-snippets-for-sublime-text-2/

iphone android js切り分け 2タイプ

//UAを確認してandroidならviewportを変更
var viewport = document.getElementById("viewport");
if (navigator.userAgent.indexOf('Android') > 0) {
	viewport.setAttribute("content", "width=device-width,user-scalable=1");
}else if ((navigator.userAgent.indexOf('iPhone') > 0 && navigator.userAgent.indexOf('iPad') == -1) || navigator.userAgent.indexOf('iPod') > 0 ) {
	viewport.setAttribute("content", "width=device-width,user-scalable=0,initial-scale=0.5");
}

//htmlの準備ができてからUAを確認してbodyにクラス追加
$(function() {
	var agent = navigator.userAgent;
	if(agent.search(/Android/) > 0){
		$("body").addClass("android");
	}else if((agent.search(/iPhone/) > 0 && agent.search(/iPad/) == -1)|| navigator.userAgent.indexOf('iPod') > 0){
		$("body").addClass("iphone");
		alert($("body").attr("class"));
	}
});

せっといんたーばる せっとたいまー

せっといんたーばる

	<script type="text/javascript">
	
	var timer;
	//ページロード時にタイマー処理を登録
	window.onload = function(){
		timer = window.setInterval(
		   function(){
			   var dat = new Date();
			   document.getElementById('result').innerHTML= dat.toLocaleTimeString();
		   },
		   1000
		);
	};
	
	</script>
<body>
	<input type="button" id="bt" value="タイマー停止" onclick="clearInterval(timer)" />
	<div id="result"></div>

seTimeoutもおなしかんじ~

変数で文章を置き換え

	//その2 第一引数だけ仮引数で文章が渡されてその文章内を可変長引数の内容で置き換えて呼び出す
	function printf(format){
		for(var i=1; i<arguments.length; i++){
			var pattern = new RegExp('\\{'+ (i-1) +'\\}','g');
			format = format.replace(pattern,arguments&#91;i&#93;);
		}
		document.writeln(format+'<br />');
	}
	//第一引数だけが仮引数で呼び出される
	//ほかの引数(可変長引数)はargumentsに格納される
	//第一引数のプレイスホルダを第二引数以降の値で置き換える
	printf('こんにちは{0}さん、{1}さん<br />', '加藤', '山田');

関数の定義のしかた。いろんなカタチ

	//関数の定義のしかた。いろんなカタチ
	
	function triangle1(base,height){	//function命令での定義:関数triangleを直接定義
		return base*height/2
	};
	
	document.writeln(triangle1(10,2)+'<br />');
	document.writeln('function命令での定義<br />');

	var triangle2 = new Function('base','height','return base*height/2');//Functionコンストラクタでの定義:あまりしないほうがよい?
	document.writeln(triangle2(5,2)+'<br />');
	document.writeln('Functionコンストラクタでの定義 実行時に評価されるため、使うところより前に関数をおかないとエラー<br />');


	var triangle3 = function(base,height){//関数リテラルでの定義:無名関数を変数triangleに格納
		return base*height/2
	};
	
	document.writeln(triangle3(20,2)+'<br />');
	document.writeln('関数リテラルでの定義 実行時に評価されるため、使うところより前に関数をおかないとエラー<br />');

	//]]>