無聊的html程式碼

longerandlonger發表於2013-01-22
HTML

jquery，隱藏，顯示，漸隱，漸顯


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
	<style type="text/css">
		body {
			margin:0 auto;
			width:800px;
		}
		#switcher {
			border:1px solid;
			padding:5px;
			width:300px;
		}
		.speech p {
			text-indent:2em;
		}
		.more {
			text-decoration:none;
			color:#e59
		}
		.more:hover {
			text-decoration:underline;
			color:#95e
		}
	</style>
	<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.0.min.js"></script>
	<script type="text/javascript">
		$(document).ready(function() {
			var $speech = $('div.speech');
			var defaultSize = parseFloat($speech.css('fontSize'));
			$('#switcher button').click(function(event) {
				var fontSize = parseFloat($speech.css('font-size'));
				switch (this.id) {
					case 'switcher-larger':
						fontSize *= 1.4;
						break;
					case 'switcher-small':
						fontSize /= 1.4;
						break;
					default:
						fontSize = defaultSize;
				}
				console.log('fontSize:' + fontSize);
				$speech.css('fontSize', fontSize + 'px');
			});
			var $thePara = $('p').eq(1);
			$thePara.hide();
			$('a.more').click(function() {
				if ($thePara.is(':hidden')) {
					$thePara.fadeIn(0);
					$(this).text('Read Less');
				} else {
					$thePara.fadeOut(0);
					$(this).text('Read More');
				}
				//$('p').eq(1).slideDown(5000);//show()fadeIn()
				//$(this).slideUp(4000);//hide()fadeOut()
				return false;
			});
		});
	</script>
</head>
<body>
	<h1>APM角度上看：NoSQL和關聯式資料庫並無不同</h1>
	<div id="switcher">
		<div class="label">Text Size</div>
		<button id="switcher-default">Default</button>
		<button id="switcher-larger">Bigger</button>
		<button id="switcher-small">Smaller</button>
	</div>
	<div class="speech">
		<p>最重要的不是資料庫本身的效能，而是使用資料庫的應用程式。應用程式的邏輯決定了使用資料庫的方式，當然也有很多途徑來調優資料庫用以掩飾應用程式本身的問題。所以我們需要監視和優化應用程式的使用模式，同時應用程式邏輯又由輸入資料或者是大多數情況下與使用者互動的方式決定；所以我們必須分析使用者的行為，而使用者的操作決定了資料庫的使用方式。另一方面，我們需要明白這些行為對資料庫的影響。這裡的重點在於獲悉當資料的效能達到最高標準，卻仍然成為應用程式的主要瓶頸 —— 它們是否被錯誤的使用或者是使用了一個錯誤的訪問模式。
		</p>
		<p>【CSDN報導】AWS終於著手解決故障頻發的東部資料中心了，AWS將在弗吉尼亞州北部建立新的資料中心，它將在2014年建成，這將從根本上解決AWS東部區域故障頻發的問題。位於弗吉尼亞州的Ashburn資料中心在2004年開始服役，並在2006年提供AWS服務，它是AWS最古老同時也是最大的資料中心，因此各方面出現故障的機率也較高。根據獨立的調查，AWS上70%以上的IP地址指向這裡。
		</p>
		<a href="javascript:void(0);" class="more">Read More</a>
		<p>Jexus Web server是Linux平臺上最強勁的ASP.NET WEB伺服器，同時也是linux平臺上的一款優秀的高效能HTML WEB伺服器。其最新版V5.2已於昨日正式釋出。
			與5.1相比，Jexus5.2有如下變化:
			1、修復了5.1釋出以來發現的所有BUG；
			2、為FastCGI、反向代理增加了對“多重Cookie”的支援；
			3、增加了對響應資料進行“分塊傳輸”的支援；
			4、增加了正常讀取中文亂碼檔名（windows檔案複製到linux系統上後中文檔名成為亂碼）的支援；
			5、為ASP.NET開放了開放HTTP OPTIONS/PUT/DELETE協議，為“RESTful Web API”的正常執行提供了平臺基礎；
			6、對執行緒池控制、應用程式域域間資料傳遞方式進行了改進，效能特別是ASP.NET的處理速度得到大幅度提升（靜態檔案處理速度提高了5%，ASP.NET處理速度提高了40%）。
		</p>
	</div>
</body>
</html>


相關文章