提示:如何用jquery建立类Twitter站点.
Twitter是世界上最流行的互联网服务
,它为用户提供微博客服务
,界面简洁美观
。本文中,我们将使用jqueyr建立一个类twitter站点
。你将学习jquery一些的技巧,以及如何一起使用
PHP和
mysql。你会喜欢的。
GuofeiJi是中国青岛的一位软件工程师,供职于阿尔卡特-朗讯。他的兴趣是jquery,
PHP及其它web设计技术。
介绍
通过twitter,用户可以任何时候发布他们在做什么,twitter会及时显示这些信息。从而,每个朋友都能同时知道你在做什么。twitter主页如下:
在本教程中,我们将实现类似twitter的界面,并且会使用PHP实现信息发布功能,数据会保存到
mysql数据库中。
第一步:界面布局
界面布局和twitter.com非常相似。本例中,只会显示消息文本框和消息显示区域,如上图所示。html代码如下:
以下为引用的内容:
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<title>jQueryTutorial:Twitter-LikeSitebyJiGuofei</title>
</head>
<body>
<divid="title">
<h1><ahref="#"><img_fcksavedurl=""#"><img"_fcksavedurl=""#"><img"_fcksavedurl=""#"><img"_fcksavedurl=""#"><img"src="twilike.png"alt="Twitter-LikeSite"></a></h1>
</div>
<divid="arrow"><imgsrc="images/arrow-up.gif"alt="arrow"/></div>
<divid="container">
<formid="commentForm">
<fieldset>
<legend><spanid="counter"></span>Characters</legend>
<textareaid="message"name="message"></textarea>
<inputname="btnSign"class="submit"type="submit"id="submit"value="Update"/>
</fieldset>
</form>
<divid="messagewindow">
Thisareawillbeusedtodisplaythemessages.
</div>
</div>
<divid="footer">
<divid="footer_a">
ThisisjustaexampletolearnjQuery.
</div>
</div>
</body>
</html>
将代码保存为index.php,我们将向文件中添加一些PHP代码以便显示消息。