您的位置：首页 > Web前端 > JQuery

移动新闻网站,掌上移动新闻,移动新闻客户端,jQuery Mobile移动新闻网站,移动新闻网站demo,新闻阅读器开发

2014-07-09 17:25 344 查看

我们坐在地铁上，常常拿出手机查看新浪移动新闻，腾讯新闻，或者刷微信看新闻等等功能。你们有没有想过他们是如何实现的。移动互联网，越来越热闹了。

因为HTML5来了，jQuery Moblie来了。今天我就用jqm来给大家做一个简单的移动新闻网站。

先看效果图：

好吧，我们来看看实现的代码：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>jQuery Mobile伪专家移动新闻</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width"/>
<!--<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css">
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
--><link rel="stylesheet" type="text/css" href="../jQuery/jquery.mobile-1.3.2.min.css">

<script type="text/javascript" src="../jQuery/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="../jQuery/jquery.mobile-1.3.2.min.js"></script>
<script type="text/javascript">
</script>
</head>
<!-- 博客地址：http://blog.csdn.net/xmtblog/article/details/34420755 -->
<body>
<div data-role="page" id="onePage">
<div data-role="header" data-position="fixed" data-theme="b">
<h1>
涛哥伪专家移动新闻
</h1>
</div>

<div data-role="content">
<ul data-role="listview" data-inset="true">
<li data-role="list-divider">2014年7月9日16:42:59 <span class="ui-li-count">2</span></li>
<li><a href="#">
<h2>涛哥伪专家移动新闻</h2>
<p><strong>作者：涛哥</strong></p>
<p>涛哥伪专家移动新闻成立于2014年7月9日。中国知名企业家涛哥于2012年5月创立的个性化商业资讯网站。涛哥伪专家移动新闻的愿景是：创造让用户更有效率地获取商业资讯并进行交流的方式。网站内容是由编辑和用户共同筛选，然后再精要加工，走个性化与社会化结合的路线。</p>
<p class="ui-li-aside"><strong>6:24</strong>PM</p>
</a></li>
<li><a href="#">
<h2>涛哥伪专家移动新闻</h2>
<p><strong>作者：涛哥</strong></p>
<p>涛哥伪专家移动新闻成立于2014年7月9日。中国知名企业家涛哥于2012年5月创立的个性化商业资讯网站。涛哥伪专家移动新闻的愿景是：创造让用户更有效率地获取商业资讯并进行交流的方式。网站内容是由编辑和用户共同筛选，然后再精要加工，走个性化与社会化结合的路线。</p>
<p class="ui-li-aside"><strong>9:18</strong>AM</p>
</a></li>
<li data-role="list-divider">2014年7月9日16:43:10 <span class="ui-li-count">1</span></li>
<li><a href="#">
<h2>涛哥伪专家移动新闻</h2>
<p><strong>作者：涛哥</strong></p>
<p>涛哥伪专家移动新闻成立于2014年7月9日。中国知名企业家涛哥于2012年5月创立的个性化商业资讯网站。涛哥伪专家移动新闻的愿景是：创造让用户更有效率地获取商业资讯并进行交流的方式。网站内容是由编辑和用户共同筛选，然后再精要加工，走个性化与社会化结合的路线。</p>
<p class="ui-li-aside"><strong>4:48</strong>PM</p>
</a></li>
</ul>
</div>

<div id="footer" data-role="footer" data-theme="b" data-position="fixed">
<h1>
涛哥伪专家移动新闻
</h1>
</div>
</div>
</body>
</html>

好吧，就到这里，如有后续新版本再奉献上。欢迎大家关注我的个人博客！

点击资料下载：http://download.csdn.net/download/xmt1139057136/7612517

如有不懂，请加qq群：135430763，共同学习！

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： 移动新闻开发移动新闻demo 移动新闻示例 jqm阅读器移动网站建设

相关文章推荐

新的分享

章节导航