大中小ボタンでフォントサイズを変更する

/**
 * フォントサイズを変更する
 *
 * 小中大ボタン
 * <img src="img/smalloff.png" id="fontSizeSmall">
 * <img src="img/middleon.png" id="fontSizeMiddle">
 * <img src="img/largeoff.png" id="fontSizeLarge">
 *
 * コンテンツ内
 * <div class="fontSizeChange">aaa</div>
 * <span class="fontSizeChange">aaa</span>
 *
 * @author ao-system
 */
(function(window,document){
	var _fontSizeSmallId = 'fontSizeSmall';		//id名
	var _fontSizeMiddleId = 'fontSizeMiddle';	//id名
	var _fontSizeLargeId = 'fontSizeLarge';		//id名
	var _percentSmall = '85%';
	var _percentMiddle = '100%';
	var _percentLarge = '130%';
	var _fontSizeElms = null;
	var _cookieName = 'fontSizeChange';		//クッキーはこの1個だけ使用
	var _targetClassName = 'fontSizeChange';
	init();

/**
 * addEventListener クロスブラウザ対応
 *
 */
	function addEvt(elm, tpe, func) {
		if (elm.addEventListener) {
			return elm.addEventListener(tpe, func, false);
		} else if (elm.attachEvent) {
			return elm.attachEvent('on' + tpe, func);
		} else {
			return elm['on' + tpe] = func;
		}
	}

/**
 * 文字列中に特定の文字列を含むか否か
 *
 */
	function isIncludeString(src,needle) {
		if (src == null) {
			return false;
		}
		var dst = src.replace(needle,'');
		if (dst.length != src.length) {
			return true;
		}
		return false;
	}

/**
 * クッキーに登録
 *
 */
	function setCookie(v) {
		var expire = new Date();
		expire.setTime( expire.getTime() + 1000 * 60 * 30);
		document.cookie = _cookieName + '=' + v + '; expires=' + expire.toUTCString();
	}

/**
 * クッキー読み取り
 *
 */
	function getCookie() {
		var result = new Array();
		var allcookies = document.cookie;
		if (allcookies != '') {
			var cookies = allcookies.split(';');
			for (var i = 0; i < cookies.length; i++) {
				var cookieOne = cookies[i].split('=');
				//result[cookieOne[0].replace(' ','')] = decodeURIComponent(cookieOne[1].replace(' ',''));
				result[cookieOne[0].replace(' ','')] = cookieOne[1].replace(' ','');
			}
		}
		return isset(result[_cookieName]) ? result[_cookieName] : '';
	}

/**
 * isset
 *
 */
	function isset(data) {
		return (typeof(data) != 'undefined');
	}

/**
 * initial
 *
 */
	function init() {
		_fontSizeElms = document.getElementsByClassName(_targetClassName);	//対象リストアップ
		fontSizeButtons();
		var cookiePercent = getCookie();
		if (cookiePercent != '') {
			setFontSize(cookiePercent);
		}
	}

/**
 * initial イベントリスナー登録
 *
 */
	function fontSizeButtons() {
		if (document.getElementById(_fontSizeSmallId)) {
			addEvt(document.getElementById(_fontSizeSmallId),'click',function(){setFontSize(_percentSmall);});
		}
		if (document.getElementById(_fontSizeMiddleId)) {
			addEvt(document.getElementById(_fontSizeMiddleId),'click',function(){setFontSize(_percentMiddle);});
		}
		if (document.getElementById(_fontSizeLargeId)) {
			addEvt(document.getElementById(_fontSizeLargeId),'click',function(){setFontSize(_percentLarge);});
		}
	}

/**
 * font-size属性のセット、差し替え
 *
 */
	function setFontSize(percentStr) {
		var elms = _fontSizeElms;
		for (var i = 0; i < elms.length; i++) {
			if (elms[i].tagName.toLowerCase() == 'table') {
				var subElms = elms[i].getElementsByTagName('th');
				for (var j = 0; j < subElms.length; j++) {
					setFontSizeElm(percentStr,subElms[j]);
				}
				var subElms = elms[i].getElementsByTagName('td');
				for (var j = 0; j < subElms.length; j++) {
					setFontSizeElm(percentStr,subElms[j]);
				}
			} else {
				setFontSizeElm(percentStr,elms[i]);
			}
		}
		changeButton(percentStr);
		setCookie(percentStr);
	}

/**
 * font-size属性のセット、差し替え 処理実行
 *
 */
	function setFontSizeElm(percentStr,elm) {
		if (elm.firstChild == undefined) {	//要素内が空の場合は何もしない
			return;
		}
		if (elm.firstChild.getAttribute == undefined
			|| elm.firstChild.getAttribute('style') == undefined
			|| isIncludeString(elm.firstChild.getAttribute('style'),'font-size') == false) {
			var spanElm = document.createElement('span');
			spanElm.style.fontSize = percentStr;
			spanElm.style.lineHeight = percentStr;
			spanElm.innerHTML = elm.innerHTML;
			elm.innerHTML = '';
			elm.appendChild(spanElm);
		} else {
			var styles = elm.firstChild.getAttribute('style').split(';');
			var findFlag = false;
			for (var j = 0; j < styles.length; j++) {
				if (isIncludeString(styles[j],'font-size') && isIncludeString(styles[j],percentStr)) {
					findFlag = true;
					break;
				}
			}
			if (findFlag) {
				//何もしない
			} else {
				elm.firstChild.style.fontSize = percentStr;
				elm.firstChild.style.lineHeight = percentStr;
			}
		}
	}

/**
 * 小中大ボタンの切り替え
 *
 */
	function changeButton(percentStr) {
		offSrc(_fontSizeSmallId);
		offSrc(_fontSizeMiddleId);
		offSrc(_fontSizeLargeId);
		if (percentStr == _percentSmall) {
			onSrc(_fontSizeSmallId);
		} else if (percentStr == _percentMiddle) {
			onSrc(_fontSizeMiddleId);
		} else if (percentStr == _percentLarge) {
			onSrc(_fontSizeLargeId);
		}
	}

/**
 * src属性をoffが付加されているものにする
 *
 */
	function offSrc(idName) {
		var src = document.getElementById(idName).getAttribute('src');
		if (isIncludeString(src,'off.')) {
			//何もしない
		} else if (isIncludeString(src,'on.')) {
			src = src.replace('on.','off.');
			document.getElementById(idName).setAttribute('src',src);
		}
	}

/**
 * src属性をonが付加されているものにする
 *
 */
	function onSrc(idName) {
		var src = document.getElementById(idName).getAttribute('src');
		if (isIncludeString(src,'on.')) {
			//何もしない
		} else if (isIncludeString(src,'off.')) {
			src = src.replace('off.','on.');
			document.getElementById(idName).setAttribute('src',src);
		}
	}

})(window,document);