小强的HTML5移动开发之路(48)——(小练习)新闻订阅系统【1】
2024-09-02 00:58:19
一、总体设计
二、数据库设计
--新闻类别表
create table news_cate(
news_cateid int primary key auto_increment,
news_iconurl varchar(50),
news_catname varchar(5),
news_catedesc varchar(500));
--新闻数据表
create table news_data(
news_id int primary key auto_increment,
news_title varchar(50),
news_content varchar(500),
news_source varchar(50),
news_cateid int,
news_adddate datetime
);
三、系统封面开发
<!DOCTYPE html>
<html>
<head>
<title>练习</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,
initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" />
<link href="css/jquery.mobile-1.0.1.min.css"
rel="stylesheet" type="text/css"/>
<link href="css/rttopHtml5.css"
rel="stylesheet" type="text/css"/>
<script src="js/jquery-1.6.4.js"
type="text/javascript" ></script>
<script src="js/jquery.mobile-1.0.1.js"
type="text/javascript" ></script>
</head>
<body>
<div data-role="page" id="load_index" data-theme="c">
<div data-role="header" data-position="fixed">
<h4>阳光小强</h4>
</div>
<p class="border_p01"></p>
<div class="load">
<p class="t">心是一个人的翅膀,心有多大世界就有多大,每个人都有一颗不平凡的心——相信自己</p>
<p><img src="images/rttop_loading.gif" alt="" /></p>
<p class="l">正在加载数据...</p>
</div>
<div data-role="footer" data-position="fixed" >
<h1>©2014 blog.csdn.net/dawanganban studio</h1>
</div>
</div>
<script src="js/rttopHtml5.base.js"
type="text/javascript"></script>
<script src="js/rttopHtml5.news.js"
type="text/javascript" ></script>
</body>
</html>
</html>
在上面代码中引入了两个js文件
rttopHtml5.base.js
var rttophtml5mobi = {
author: 'tgrong',
version: '1.0',
website: 'http://localhost'
}
rttophtml5mobi.utils = {
setParam: function(name, value) {
localStorage.setItem(name, value)
},
getParam: function(name) {
return localStorage.getItem(name)
}
}
基础的属性设置
rttopHtml5.new.js
//封面页面创建事件
function changepage() {
window.location.href = "index.htm";
}
$('#load_index').live("pagecreate", function() {
var id = setInterval("changepage()", 3000);
})
创建一个changepage()函数,设置window对象location.href路径,绑定本页面的pagecreate事件,每隔3秒执行changepage()方法。
index.htm
<!DOCTYPE html>
<html>
<head>
<title>练习</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,
initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" />
<link href="css/jquery.mobile-1.0.1.min.css"
rel="stylesheet" type="text/css"/>
<script src="js/jquery-1.6.4.js"
type="text/javascript" ></script>
<script src="js/jquery.mobile-1.0.1.js"
type="text/javascript" ></script>
</head>
<body>
<div data-role="page" id="index_index">
<div data-role="header" data-position="fixed"
data-position="inline">
<h4>阳光新闻</h4>
</div>
<div data-role="content"> </div>
<div data-role="footer" data-position="fixed" >
<h1></h1>
</div>
</div>
</body>
</html>
最新文章
- Mybatis实现数据的增删改查(CRUD)
- asp.net捕获全局未处理异常的几种方法
- PHP常用函数备用
- hdu 4474 Yet Another Multiple Problem
- asp.net 使用JQuery 调用Ashx 后面直接写方法名,通过反射找到对应的方法
- php简单实现MVC
- 根据Android架构分层推荐开发书籍
- Linux下的CPU使用率与服务器负载的关系与区别
- Windows7下32位IE异常不能打开解决方法
- Js 30 BOM
- ThinkPHP分页使用例子(二十一)
- 解决win10客户机本地账户登陆导致远程桌面没法访问问题
- 2016年团体程序设计天梯赛-决赛 L1-3. 出租(20)
- 【C++】浅谈三大特性之一继承(三)
- 仿网易新闻app下拉标签选择菜单
- pthread创建线程的简单演示
- uva11806
- instr函数的";重载";
- 【NOIP2015】字串
- 将HTML字符转换为DOM节点并动态添加到文档中