/ASP.Net_ChatRoom

一个小聊天室

Primary LanguageC#

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title>局域网聊天室测试版本1</title>
    <style>
	body{
		background-color:gray;
	}
	.pageHead h1{
		background-color:green;
		text-align:center;
		margin:auto;
		height:50px;
		line-height:50px;
	}
	.pageBody{
		height:500px;
	}
	.pageIndex{
		width:200px;
		height:auto;
		float:left
	}
	.pageIndex ul{
		width:inherit;
		height:200px;
		list-style:none;
	}
	.pageIndex ul li{
		width:inherit;
		margin:20px 0px 20px 0px;
		font-size:25px;
		text-decoration:none;
		cursor:pointer;
	}
	.pageBody-content{
		float:right;
		margin-top:10px;
	}
	.pageBody-content h3{
		text-align:center;
	}
    </style>
    <script type="text/javascript">
		function summary(){
			var doc = document.getElementsByClassName("pageBody-content");
			var contentWidth = document.body.clientWidth - document.getElementsByClassName("pageIndex").item(0).offsetWidth;
			doc.item(0).style.width = contentWidth + "px";
			doc.item(0).innerHTML= "<h3>--功能简介--</h3><p本>局域网聊天目前支持账号注册,登录,聊天显示昵称</p>";
			//alert(document.getElementsByClassName("pageIndex").item(0).style.width);
			return 0;
		}
		function guide(){
			var doc = document.getElementsByClassName("pageBody-content");
			var contentWidth = document.body.clientWidth - document.getElementsByClassName("pageIndex").item(0).offsetWidth;
			doc.item(0).style.width = contentWidth + "px";
			doc.item(0).innerHTML= "<h3>--使用方法--</h3><p>使用起来没什么特别的, 开启服务端客户端和服务端在同一局域网 ,注册账号登陆就可以聊天了</p>";
			//alert(document.getElementsByClassName("pageIndex").item(0).style.width);
			return 0;
		}
		function notice(){
			var doc = document.getElementsByClassName("pageBody-content");
			var contentWidth = document.body.clientWidth - document.getElementsByClassName("pageIndex").item(0).offsetWidth;
			doc.item(0).style.width = contentWidth + "px";
			doc.item(0).innerHTML= "<h3>--使用方法--</h3><p>需要SQL Server,自己把服务端中的AccountDB目录下数据库添加到SqlServer中,否则会发生未知错误</p><p>需要修改服务端App.config文件中的连接字符串,不会的自行百度</p><p>服务端不可双开,端口会冲突 多个客户端不可在同一目录测试, 配置文件会冲突</p>";
			//alert(document.getElementsByClassName("pageIndex").item(0).style.width);
			return 0;
		}
		function last(){
			var doc = document.getElementsByClassName("pageBody-content");
			var contentWidth = document.body.clientWidth - document.getElementsByClassName("pageIndex").item(0).offsetWidth;
			doc.item(0).style.width = contentWidth + "px";
			doc.item(0).innerHTML= "<h3>--写在最后--</h3><p>本项目仅供wpf学习者参考, 作者CG,转载请注明出处</p><p>未经原作者同意, 不得用于商业目的,原作者CG保留一切权利!</p>";
			//alert(document.getElementsByClassName("pageIndex").item(0).style.width);
			return 0;
		}
		onload = function(){
			summary();
		}
    </script>
</head>
<body>
<div class="pageHead">
    <!--页头-->
    <h1> 局域网聊天室</h1>
    </div>
    
    <div class="pageBody">
    <!--页体-->
    	<div class="pageIndex">
        <ul >
        	<li onClick="summary()">功能简介</a></li>
            <li onClick="guide()">使用方法</a></li>
            <li onClick="notice()">注意事项</a></li>
            <li onClick="last()">写在最后</a></li>
        </ul>
        </div>
    	<div class="pageBody-content">
        	
        </div>
	</div>
</body>
</html>