本文为 兄弟连IT教育 机构官方 HTML5培训 教程，主要介绍：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
-
);
三、系统封面开发
-
>
-
<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 studioh1>
-
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: ''
-
}
-
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
-
>
-
<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>
阅读(1067) | 评论(0) | 转发(0) |
