首頁 探索 說明
註冊 登入
Omnimaga
/
OmnomIRC-node
镜像来自 [email protected]:Omnimaga/OmnomIRC-node.git
2
0
複刻 0
Files 問題管理 0 Wiki
瀏覽代碼

Style wireframe and script changes

Made the close button universal.
Modified the Setting pane to fill the screen.
Head is expanded by default. Click handlers on the head area. Head will
auto hide 1s after page load.
Added close buttons to the Users and Settings panes.
Nathaniel van Diepen 12 年之前
父節點
c4331cccf2
當前提交
37b20d33e5
共有 3 個文件被更改，包括 17 次插入 和 5 次删除
分割檢視 顯示文件統計
  1. 3 3
      www/css/style.css
  2. 3 1
      www/index.html
  3. 11 1
      www/js/omnomirc.js

+ 3 - 3
www/css/style.css
查看文件 

@@ -17,13 +17,13 @@ html,body{
 
 	-ms-user-select: none;
 
 	user-select: none;
 
 }
 
-#tabs-list span.tab .close-button{
 
+.close-button{
 
 	float: right;
 
 	font-weight: bold;
 
 	font-size: 16px;
 
 	font-family: Arial,Liberation Sans,DejaVu Sans,sans-serif;
 
 }
 
-#tabs-list span.tab .close-button:hover{
 
+.close-button:hover{
 
 	color: red;
 
 }
 
 #head{
 
@@ -84,7 +84,7 @@ html,body{
 
 	z-index: 20;
 
 }
 
 #settings.open{
 
-	width: 50%;
 
+	width: 100%;
 
 }
 
 #entry{
 
 	width: 100%;

+ 3 - 1
www/index.html
查看文件 

@@ -12,7 +12,7 @@
 
 		<link rel="stylesheet" href="css/style.css"></link>
 
 	</head>
 
 	<body>
 
-		<div id="head">
 
+		<div id="head" class="hovered">
 
 			<div id="info" class="unselectable">
 
 				<span id="title"></span>
 
 				<span id="topic"></span>
 
@@ -27,10 +27,12 @@
 
 			<button id="send" value="send">send</button>
 
 			<div id="users">
 
 				<span class="unselectable">Users</span>
 
+				<span class="close-button">&times;</span>
 
 				<ul id="user-list"></ul>
 
 			</div>
 
 			<div id="settings">
 
 				<span class="unselectable">Settings</span>
 
+				<span class="close-button">&times;</span>
 
 				<ul id="settings-list"></ul>
 
 			</div>
 
 		</div>

+ 11 - 1
www/js/omnomirc.js
查看文件 

@@ -133,15 +133,22 @@
 
 				$(this).removeClass('open');
 
 			},
 
 			timeout: 1000
 
+		}).children('.close-button').click(function(){
 
+			$(this).parent().removeClass('open');
 
+			return false;
 
 		});
 
 		$("#head").hoverIntent({
 
 			over: function(){
 
-				$(this).addClass('hovered');
 
+				setTimeout(function(){
 
+					$('#head:hover').addClass('hovered');
 
+				},1000);
 
 			},
 
 			out: function(){
 
 				$(this).removeClass('hovered');
 
 			},
 
 			timeout: 1000
 
+		}).click(function(){
 
+			$(this).addClass('hovered');
 
 		});
 
 		$('.unselectable').attr('unselectable','on');
 
 		//DEBUG
 
@@ -155,5 +162,8 @@
 
 		//END DEBUG
 
 		$o.refreshTabs();
 
 		$o.event('ready');
 
+		setTimeout(function(){
 
+			$('#head').removeClass('hovered');
 
+		},1000);
 
 	});
 
 })(window,jQuery);