小繁的Blog

腾讯Q组内部考核题

under 学习笔记 2010-02-27 pm

这个是从Hemin那里看到的,我没找鬼哥要,刚好没见过,就拿来练手了.题目的综合性还是比较大.

详细的题目要求还是从这里看吧:
http://www.hemin.cn/demo/tengxunMS10-01-17/考核题关注.doc
http://www.hemin.cn/demo/tengxunMS10-01-17/q_group.psd

<!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>QQ群空间</title> <link rel="stylesheet" href="http://www.aiyooo.net/demo/qqgroup/qqgroup.css" type="text/css" /> </head> <body> <div id="header"> <div id="nav"> <a href="http://www.aiyooo.net/blog/" title="tencent" id="logo">Tencent QQ群</a> <div class="abc"> <a href="#" title="首页">首页</a>| <a href="#" title="help">帮助</a>| </div> <a href="#" title="exit" class="rf exit">退出登陆</a> <a href="#" title="mygroup" class="bgico1 mygroup lf">我加入的群</a> <div id="banner" class="clear"> <h2>爱生活爱自己</h2> <p id="ad"><span>[广东省]</span> 同一个时代,不同的两个时空,超越时空的声音,带动你.</p> </div> <div class="info"> <a href="#" title="群空间管理" class="rf bgico1 ctrl">群空间管理</a> <span class="userimg icoimg">侯小繁</span> <span>创建于 2010.2.20</span> </div> </div> </div> <div id="container"> <div id="center" class="pub"> <div class="notice"> <img src="http://www.aiyooo.net/demo/qqgroup/images/jwban.gif" alt="曾经的2班" width="180" height="110"/> <h2>群内公告</h2> <p>为了赎罪，我选择了爱你！为了赎罪，我选择了爱你！为了赎罪，我选择了爱你！为了赎罪，我选择了爱你！为了赎罪，我选择了爱你！为了赎罪，我选择了爱你！为了赎罪，我选择了爱你！</p> </div><div class="newpost"> <a href="#" class="rf bgico1 post" title="发新贴">发新贴</a> </div> <div id="bbs" class="clear"> <h2>群空间论坛</h2> <table cellspacing="0" cellpadding="0"> <thead> <tr> <td class="title">文章标题</td> <td class="author">作者</td> <td class="time">时间</td> <td class="reply">浏览/回复</td> </tr> </thead> <tbody> <tr> <td class="title"><span>[<a href="#">通知版</a>]</span><a title="个人中心将显示部分QQ好友动态" href="">个人中心将显示部分QQ好友动态</a></td> <td><a href="#" class="icoimg hdphot">aiyoo@~</a></td> <td>10.02 10:02</td> <td class="reply">10/0</td> </tr> <tr> <td class="title"><span class="icoimg voice">[<a href="#">通知版</a>]</span><a title="个人中心将显示部分QQ好友动态" href="">个人中心将显示部分QQ好友动态</a></td> <td><a href="#" class="icoimg hdphot">aiyoo@~</a></td> <td>10.02 10:02</td> <td class="reply">10/0</td> </tr> <tr> <td class="title"><span>[<a href="#">通知版</a>]</span><a title="个人中心将显示部分QQ好友动态" href="">个人中心将显示部分QQ好友动态</a></td> <td><a href="#" class="icoimg hdphot">aiyoo@~</a></td> <td>10.02 10:02</td> <td class="reply">10/0</td> </tr> <tr> <td class="title"><span>[<a href="#">通知版</a>]</span><a title="个人中心将显示部分QQ好友动态" href="">个人中心将显示部分QQ好友动态</a></td> <td><a href="#" class="icoimg hdphot">aiyoo@~</a></td> <td>10.02 10:02</td> <td class="reply">10/0</td> </tr> <tr> <td class="title"><span>[<a href="#">通知版</a>]</span><a title="个人中心将显示部分QQ好友动态" href="">个人中心将显示部分QQ好友动态</a></td> <td><a href="#" class="icoimg hdphot">aiyoo@~</a></td> <td>10.02 10:02</td> <td class="reply">10/0</td> </tr> <tr> <td class="title"><span>[<a href="#">通知版</a>]</span><a title="个人中心将显示部分QQ好友动态" href="">个人中心将显示部分QQ好友动态</a></td> <td><a href="#" class="icoimg hdphot">aiyoo@~</a></td> <td>10.02 10:02</td> <td class="reply">10/0</td> </tr> <tr> <td class="title"><span>[<a href="#">通知版</a>]</span><a title="个人中心将显示部分QQ好友动态" href="">个人中心将显示部分QQ好友动态</a></td> <td><a href="#" class="icoimg hdphot">aiyoo@~</a></td> <td>10.02 10:02</td> <td class="reply">10/0</td> </tr> <tr> <td class="title"><span>[<a href="#">通知版</a>]</span><a title="个人中心将显示部分QQ好友动态" href="">个人中心将显示部分QQ好友动态</a></td> <td><a href="#" class="icoimg hdphot">aiyoo@~</a></td> <td>10.02 10:02</td> <td class="reply">10/0</td> </tr> <tr> <td class="title"><span>[<a href="#">通知版</a>]</span><a title="个人中心将显示部分QQ好友动态" href="">个人中心将显示部分QQ好友动态</a></td> <td><a href="#" class="icoimg hdphot">aiyoo@~</a></td> <td>10.02 10:02</td> <td class="reply">10/0</td> </tr> <tr> <td class="title"><span>[<a href="#">通知版</a>]</span><a title="个人中心将显示部分QQ好友动态" href="">个人中心将显示部分QQ好友动态</a></td> <td><a href="#" class="icoimg hdphot">aiyoo@~</a></td> <td>10.02 10:02</td> <td class="reply">10/0</td> </tr> </tbody> </table> </div> <div class="more"><a href="" class="rf" title="更多">更多>></a></div> </div> <div id="left" class="pub"> <div id="quninfo"> <h2>普通群<span>[非公开]</span></h2> <a href="#" class="bgico1 upgrouad rf" title="升级群空间">升级群空间</a> <ul class="xxiinfo"> <li><span>群成员数</span>87/100人</li> <li><span>相册空间</span><p class="space bgico1"><span style="width:0%" class="icoimg">相册空间使用0%</span></p>0/10M</li> <li><span>硬盘空间</span><p class="space bgico1"><span style="width:63%" class="icoimg">硬盘空间使用63%</span></p>10/16M</li> </ul> </div> <div id="menu" class="test" > <ul> <li class="home bgico1"><a href="#" title="首页">首页</a></li> <li class="bbs bgico1"><a href="#" title="论坛">论坛</a> <ul> <li><a href="" title="讨论版">讨论版</a></li> <li><a href="" title="贴图版">贴图版</a></li> <li><a href="" title="随写">随写</a></li> <li><a href="" title="分享">分享</a></li> </ul> </li> <li class="photo bgico1"><a href="#" title="相册">相册</a></li> <li class="noted bgico1"><a href="#" title="群聊天记录">群聊天记录</a></li> <li class="users bgico1"><a href="#" title="群成员">群成员</a></li> </ul> </div> </div> <div id="right" class="pub"> <div class="payandplan"> <ul> <li><a href="#" title="充值" class="pay bgico1">充值</a></li> <li><a href="#" title="群返利计划" class="plan bgico1">群返利计</a></li> </ul> </div> <div id="userlist"> <div> <h2>成员列表</h2> <ul> <li id="qunzhu" class="icoimg" ><a href="" title="爱生活PP滴人儿" class="hdphot icoimg">爱生活PP滴人儿滴人儿滴人儿</a></li> <li class="admin icoimg"><a href="" title="爱生活PP滴人" class="hdphot icoimg">爱生活PP滴人</a></li> <li class="admin icoimg"><a href="" title="爱生活PP滴人" class="hdphot icoimg">爱生活PP滴人</a></li> <li><a href="" title="爱生活PP滴人" class="hdphot icoimg">爱生活PP滴人</a></li> <li><a href="" title="爱生活PP滴人" class="hdphot icoimg">爱生活PP滴人</a></li> <li><a href="" title="爱生活PP滴人" class="hdphot icoimg">爱生活PP滴人</a></li> <li><a href="" title="爱生活PP滴人" class="hdphot icoimg">爱生活PP滴人</a></li> <li><a href="" title="爱生活PP滴人" class="hdphot icoimg">爱生活PP滴人</a></li> <li><a href="" title="爱生活PP滴人" class="hdphot icoimg">爱生活PP滴人</a></li> <li><a href="" title="爱生活PP滴人" class="hdphot icoimg">爱生活PP滴人</a></li> <li><a href="" title="爱生活PP滴人" class="hdphot icoimg">爱生活PP滴人</a></li> <li><a href="" title="爱生活PP滴人" class="hdphot icoimg">爱生活PP滴人</a></li> <li><a href="" title="爱生活PP滴人" class="hdphot icoimg">爱生活PP滴人</a></li> <li><a href="" title="爱生活PP滴人" class="hdphot icoimg">爱生活PP滴人</a></li> <li><a href="" title="爱生活PP滴人" class="hdphot icoimg">爱生活PP滴人</a></li> </ul> <p><a href="" title="更多">更多>></a></p> </div> </div> </div> </div> <div id="footer" class="clear"> <p> <a title="关于腾讯" href="#">关于腾讯</a> <a title="About Tencent" href="#">About Tencent</a> <a title="服务条款" href="#">服务条款</a> <a title="广告服务" href="#">广告服务</a> <a title="腾讯招聘" href="#">腾讯招聘</a> <a title="客服中心" href="#">客服中心</a> <a title="网站导航" href="#">网站导航</a> </p> <p class="copy"><strong>Copyright © 1998 - 2008 Tencent Inc. All Rights Reserver</strong></p> <p class="copy">腾讯公司版权所有腾讯网络文化经营许可证 </p> </div> </body> </html>

Tips:You can change the code before run.

测试：IE6,7,8,FF3.5+,chrome,safari,Opera.

Tags:面试题

Continue to Read

无耻的服务商！

under 那些事 2010-01-21 pm

被广告了，杯具了n个月!
似乎是网通被联通合并不久后。每天都会在浏览器里出现广告，从转向劫持到广告页面再到现在更隐蔽的站内弹出浮动广告,让用户以为是网站的弹出广告.联通的流氓行为越来越让人无法接受！问题似乎并只出现在石家庄的用户，保定廊坊均如此！

开始还以为是浏览器杯具了，检查了系统Ie，Firefox还是被广告困扰。搜索之后发现原来不只是我这样，都以为是DNS劫持，换成Google的DNS后还是被流氓了。搞半天是路由劫持！clicklifter.com 现在的浮动窗广告服务器。受够了！它的信誉在此终止。

刚刚向工信部写了投诉信，等待答复吧。

Continue to Read

转:如何精简用户界面

under 网页设计 2010-01-3 pm

简洁、易用、友好、直观。这些词语经常被提及，但在执行过程中经常被遗忘。这是因为软件功能的复杂性所导致的。如何处理好软件的复杂功能往就可以决定它的命运。一个复杂的界面会让用户不知如何操作。如果，减少复杂的操作过程并精简操作界面，那该软件的用户体验就大大的提升了。

去除无用的功能

研究发现：80%的用户仅仅使用软件20%的功能。而那些没用的功能不仅浪费开发时间，也使得软件更加难以使用（这些功能对用户的阻碍作用大于有用价值）。软件试图尽力可以把任何事都做好。而一个成功的软件应是简练精干的，可单独智能化的解决单个问题。

精简的软件可通过削减功能得到。通过默认去除的方法判断一个功能是否有必要保留。将软件所有的功能进行真正的筛选。

Tags:交互设计

Continue to Read

小黑特惠

under 那些事 2009-12-27 pm

收到联想小黑的圣诞贺卡,提示10年3月仍有小黑学生机特惠活动.还有机会参加~~~~

Continue to Read

4

噢~Google Wave 邀请

under 那些事 2009-11-11 pm

Google Wave 居然可以邀请人了，到处都在发送邀请，邀请不希奇了。

希奇的是对Wave的未知。

病毒式传播

Tags:那些事

Continue to Read

感冒~

under 那些事 2009-09-14 pm

感冒发烧，痛苦中…
没有猪流感的症状。
手机发布。

Continue to Read

4

主题更新

under 那些事 2009-09-4 pm

更换了theme,早打算自己做了,一直跳票到现在.对WP-theme不是太了解,功能上还是有好多问题,样式虽然简单,但没在ie6下测试.

虽然空间好久没有更新,但是先说这么多噻~~

Tags:theme. wp

Continue to Read

2

Event对象跨浏览器的兼容性

under java script- 学习笔记 2009-06-16 am

Event对象关联了所有事件,以提供有关事件的信息,但是对Eevent对象的访问各浏览器却存在着差异.
先来看一个Demo:

<!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>Event对象支持</title> </head> <body > <div id="face" style="position:absolute;width:18px;height:18px;background-color:#0CC;"> </div> <div id="info"></div> <script> document.getElementById('face').style.position='absolute'; function getPos(){ var posx=event.clientX; var posy=event.clientY; var str="<p>("+posx+","+posy+")</p>"; document.getElementById('info').innerHTML=str; document.getElementById('face').style.left=posx+'px'; document.getElementById('face').style.top=posy+'px'; } document.onmousemove=getPos; </script> </body> </html>

Tips:You can change the code before run.

在IE中可以正常的运行,如果您是在FF中运行其代码会出现event is not defined的错误提示.在IE中会把event附加成window对象的一个属性,在作为事件处理的一部分访问时会相应填写Event对象所含的数据.

对于基于Netscape的浏览器,是需要作为函数的一个参数传入.

function getPos(evnt){
var posx=evnt.clientX;
var posy=evnt.clientY;
var str=”
(“+posx+”,”+posy+”)

“;
document.getElementById(‘info’).innerHTML=str;
document.getElementById(‘face’).style.left=posx+’px’;
document.getElementById(‘face’).style.top=posy+’px’;
}

不过这种方法无法在IE中被实例化,所以只需在函数中进行相应判断
evnt=evnt||window.event;这样可以对浏览器的兼容.

<!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>Event对象支持</title> </head> <body > <div id="face" style="position:absolute;width:18px;height:18px;background-color:#0CC;"> </div> <div id="info"></div> <script> document.getElementById('face').style.position='absolute'; function getPos(evnt){ evnt=evnt||window.event; var posx=evnt.clientX; var posy=evnt.clientY; var str="<p>("+posx+","+posy+")</p>"; document.getElementById('info').innerHTML=str; document.getElementById('face').style.left=posx+'px'; document.getElementById('face').style.top=posy+'px'; } document.onmousemove=getPos; </script> </body> </html>

Tips:You can change the code before run.

需要注意的是在body中使用内联方法需要显式onmousemove=”getPos(event)”,传入event对象以便对ff的兼容.

Continue to Read

Aiyooo^TM

腾讯Q组内部考核题

无耻的服务商！

转:如何精简用户界面

去除无用的功能

小黑特惠

噢~Google Wave 邀请

感冒~

主题更新

Event对象跨浏览器的兼容性

Categories

链接