小强的HTML5移动开发之路（48）——（小练习）新闻订阅系统【1】
一、总体设计
二、数据库设计
--新闻类别表
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>
小强的HTML5移动开发之路（48）——（小练习）新闻订阅系统【1】的更多相关文章
- 小强的HTML5移动开发之路（18）——HTML5地理定位
来自:http://blog.csdn.net/dawanganban/article/details/18192091 在前面的<小强的HTML5移动开发之路(2)--HTML5的新特性> ...
- 小强的HTML5移动开发之路（14）——Video标签详解
来自:http://blog.csdn.net/dawanganban/article/details/18180605 在前面的小强的HTML5移动开发之路(5)--制作一个漂亮的视频播放器中制作了 ...
- 小强的HTML5移动开发之路（13）——HTML5中的全局属性
来自:http://blog.csdn.net/dawanganban/article/details/18179483 一.accssskey 快捷键 <!DOCTYPE HTML> ...
- 小强的HTML5移动开发之路（11）——链接，图片，表格，框架
来自:http://blog.csdn.net/dawanganban/article/details/18098193 一.HTML是什么? HTML(hypertext mark-uplangua ...
- 小强的HTML5移动开发之路（42）——HTML4与HTML5文档结构比较
一般来说,人们在书写包括HTML在内的文档时,习惯上按照类似于"章--节--小节"这样的层次结构来进行. 在HTML4中的描述方式: <html> <head&g ...
- 小强的HTML5移动开发之路（37）——jqMobi快速入门
在<小强的HTML5移动开发之路(33)-- jqMobi基础>中我们了解了什么是jqMobi,并从官方下载了jqMobi开发包,下载后解压目录如下: 拷贝上面的/css目录./plugi ...
- 小强的HTML5移动开发之路（12）——从一个多媒体标签说起
来自:http://blog.csdn.net/dawanganban/article/details/18136813 一.视频播放 <html> <head> <ti ...
- 小强的HTML5移动开发之路（3）——HTML5与HTML4比较
来自:http://blog.csdn.net/dawanganban/article/details/17652873 在前面介绍了HTML5的新特性,新标签的使用,智能表单设计,引入多媒体对象,C ...
- 小强的HTML5移动开发之路（1）——HTML介绍
来自:http://blog.csdn.net/dawanganban/article/details/17591373 HTML是HyperText Markup Language(超文本标记语言) ...
随机推荐
- 洛谷P3165 [CQOI2014]排序机械臂
题目描述 为了把工厂中高低不等的物品按从低到高排好序,工程师发明了一种排序机械臂.它遵循一个简单的排序规则,第一次操作找到摄低的物品的位置P1,并把左起第一个至P1间的物品反序:第二次找到第二低的物品 ...
- Linux平台下使用AdventNet ManageEngine OpUtils监控网络
AdventNet ManageEngine OpUtils 是一套系统和网络监视工具,它有Linux/Windows系统平台的免费版和企业版,该软件是一款用于监视诸如路由器,交换机,服务器或者桌面这 ...
- A题之拼音转数字
输入是一个仅仅包括拼音的字符串,请输出相应的数字序列.转换关系例如以下: 描写叙述: 拼音 yi er san si wu liu qi ba jiu 阿拉伯数字 1 2 3 4 5 6 ...
- 2. Spring Boot Controller
转自:https://blog.csdn.net/catoop/article/details/50501676
- WINWORD.EXE-损坏的图像
问题详情: 系统键 + R键,运行 再输入regedit HKEY_CLASSES_ROOT\.docx HKEY_CLASSES_ROOT\Word.Document.12 HKEY_CURREN ...
- GO语言学习（十四）Go 语言数组
Go 语言数组 Go 语言提供了数组类型的数据结构. 数组是具有相同唯一类型的一组已编号且长度固定的数据项序列,这种类型可以是任意的原始类型例如整形.字符串或者自定义类型. 相对于去声明number0 ...
- QQ群功能设计与心理学
刚刚在一个Java技术交流群,发了个 "博客投票"的广告. 群主两眼一黑,瞬间就把我给干掉了. 看到QQ给出的系统消息,发现QQ群的一个功能做得很不错. 大家注意到,右边有个&qu ...
- 格式化时间的一个好方法(补充moment)
/** * * 格式化时间 * @param {*} time * @param {*} fmt * @returns * time(new Date(), 'yyyy/MM/dd') ==> ...
- 翻翻git之---闪烁动画的TextView RevealTextView
转载请注明出处:王亟亟的大牛之路 今天没有P1啦!. 对换工作有想法的.能够找昨天的P1.哈哈 地址:http://blog.csdn.net/ddwhan0123/article/details/5 ...
- smack capable(CAP_MAC_OVERRIDE)
https://blog.csdn.net/ning_wei/article/details/9670947 LINUX中的capable int smk_curacc(char *obj_label ...