jQuery Mobile_简单的爱情故事
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,minimum-scale=1.0, maximum-scale=1.0,user-scalable=no"/>
<title>无标题文档</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css">
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
</head> <body>
<div data-role="page" id="home">
<div data-role="header">
<div data-role="navbar">
<ul>
<li><a href="#home" data-role="button" data-icon="home" data-inline="true">主页</a></li>
<li style="text-align:center"><h4>请听我讲一个爱情故事</h4></li>
<li><a href="#home" data-role="button" data-icon="arrow-l">后退</a></li>
</ul>
</div>
</div>
<div data-role="content" style="text-align:center"><a data-role="button" href="#page1" data-icon="arrow-r" data-iconpos="right" data-inline="true">简单的爱情故事</a></div>
<div data-role="footer"><h4>Copyright 山水一程</h4></div>
</div> <div data-role="page" id="page1">
<div data-role="header">
<div data-role="navbar">
<ul>
<li><a href="#home" data-role="button" data-icon="home" data-inline="true">主页</a></li>
<li style="text-align:center"><h4>请听我讲一个爱情故事</h4></li>
<li><a href="#home" data-role="button" data-icon="arrow-l">后退</a></li>
</ul>
</div>
</div>
<div data-role="content"><p>1.在一个宁静的小山村,男孩和女孩都来到了这个世界。</p>
<a href="#page2" data-role="button" data-icon="arrow-r" data-inline="true" data-iconpos="right">前进</a></div>
<div data-role="footer"><h4>Copyright 山水一程</h4></div>
</div> <div data-role="page" id="page2">
<div data-role="header">
<div data-role="navbar">
<ul>
<li><a href="#home" data-role="button" data-icon="home" data-inline="true">主页</a></li>
<li style="text-align:center"><h4>请听我讲一个爱情故事</h4></li>
<li><a href="#page1" data-role="button" data-icon="arrow-l">后退</a></li>
</ul>
</div>
</div>
<div data-role="content"><p>2.他们一起玩耍,直到3、4岁的时候,女孩去了另外一个城市。</p>
<a href="#page3" data-role="button" data-icon="arrow-r" data-inline="true" data-iconpos="right">前进</a>
</div>
<div data-role="footer"><h4>Copyright 山水一程</h4></div>
</div> <div data-role="page" id="page3">
<div data-role="header">
<div data-role="navbar">
<ul>
<li><a href="#home" data-role="button" data-icon="home" data-inline="true">主页</a></li>
<li style="text-align:center"><h4>请听我讲一个爱情故事</h4></li>
<li><a href="#page2" data-role="button" data-icon="arrow-l">后退</a></li>
</ul>
</div>
</div>
<div data-role="content"><p>3.男孩和女孩生活在各自的轨道上,小学、初中、高中、大学,生活有酸甜苦辣。</p>
<a href="#page4" data-role="button" data-icon="arrow-r" data-inline="true" data-iconpos="right">前进</a>
</div>
<div data-role="footer"><h4>Copyright 山水一程</h4></div>
</div> <div data-role="page" id="page4">
<div data-role="header">
<div data-role="navbar">
<ul>
<li><a href="#home" data-role="button" data-icon="home" data-inline="true">主页</a></li>
<li style="text-align:center"><h4>请听我讲一个爱情故事</h4></li>
<li><a href="#page3" data-role="button" data-icon="arrow-l">后退</a></li>
</ul>
</div>
</div>
<div data-role="content"><p>4.女孩毕业了,在J城市工作,男孩毕业了,在B城市工作。</p>
<a href="#page5" data-role="button" data-icon="arrow-r" data-inline="true" data-iconpos="right">前进</a>
</div>
<div data-role="footer"><h4>Copyright 山水一程</h4></div>
</div> <div data-role="page" id="page5">
<div data-role="header">
<div data-role="navbar">
<ul>
<li><a href="#home" data-role="button" data-icon="home" data-inline="true">主页</a></li>
<li style="text-align:center"><h4>请听我讲一个爱情故事</h4></li>
<li><a href="#page4" data-role="button" data-icon="arrow-l">后退</a></li>
</ul>
</div>
</div>
<div data-role="content"><p>5.工作了,致我们终将逝去的大学,在不同的城市。</p>
<a href="#page6" data-role="button" data-icon="arrow-r" data-inline="true" data-iconpos="right">前进</a>
</div>
<div data-role="footer"><h4>Copyright 山水一程</h4></div>
</div> <div data-role="page" id="page6">
<div data-role="header">
<div data-role="navbar">
<ul>
<li><a href="#home" data-role="button" data-icon="home" data-inline="true">主页</a></li>
<li style="text-align:center"><h4>请听我讲一个爱情故事</h4></li>
<li><a href="#page5" data-role="button" data-icon="arrow-l">后退</a></li>
</ul>
</div>
</div>
<div data-role="content"><p>6.男孩到女孩工作的J城市出差,他们联系了,他们走在一起了。</p>
<a href="#page7" data-role="button" data-icon="arrow-r" data-inline="true" data-iconpos="right">前进</a>
</div>
<div data-role="footer"><h4>Copyright 山水一程</h4></div>
</div> <div data-role="page" id="page7">
<div data-role="header">
<div data-role="navbar">
<ul>
<li><a href="#home" data-role="button" data-icon="home" data-inline="true">主页</a></li>
<li style="text-align:center"><h4>请听我讲一个爱情故事</h4></li>
<li><a href="#page6" data-role="button" data-icon="arrow-l">后退</a></li>
</ul>
</div>
</div>
<div data-role="content"><p>7.恋爱的时光总是过得很快,时光因为短暂,所以珍贵。</p>
<a href="#page8" data-role="button" data-icon="arrow-r" data-inline="true" data-iconpos="right">前进</a>
</div>
<div data-role="footer"><h4>Copyright 山水一程</h4></div>
</div> <div data-role="page" id="page8">
<div data-role="header">
<div data-role="navbar">
<ul>
<li><a href="#home" data-role="button" data-icon="home" data-inline="true">主页</a></li>
<li style="text-align:center"><h4>请听我讲一个爱情故事</h4></li>
<li><a href="#page7" data-role="button" data-icon="arrow-l">后退</a></li>
</ul>
</div>
</div>
<div data-role="content"><p>8.男孩和女孩结婚了,他们幸福的生活在一起。</p>
<a href="#page9" data-role="button" data-icon="arrow-r" data-inline="true" data-iconpos="right">前进</a>
</div>
<div data-role="footer"><h4>Copyright 山水一程</h4></div>
</div> <div data-role="page" id="page9">
<div data-role="header">
<div data-role="navbar">
<ul>
<li><a href="#home" data-role="button" data-icon="home" data-inline="true">主页</a></li>
<li style="text-align:center"><h4>请听我讲一个爱情故事</h4></li>
<li><a href="#page8" data-role="button" data-icon="arrow-l">后退</a></li>
</ul>
</div>
</div>
<div data-role="content"><p>9.爱情的结晶-他们的宝宝,来到了这个世界,带给我们欢乐。</p>
<a href="#page10" data-role="button" data-icon="arrow-r" data-inline="true" data-iconpos="right">前进</a>
</div>
<div data-role="footer"><h4>Copyright 山水一程</h4></div>
</div> <div data-role="page" id="page10">
<div data-role="header">
<div data-role="navbar">
<ul>
<li><a href="#home" data-role="button" data-icon="home" data-inline="true">主页</a></li>
<li style="text-align:center"><h4>请听我讲一个爱情故事</h4></li>
<li><a href="#page9" data-role="button" data-icon="arrow-l">后退</a></li>
</ul>
</div>
</div>
<div data-role="content"><p>10.十全十美,祝福男孩和女孩的生活。</p>
<a href="#home" data-role="button" data-icon="arrow-l" data-inline="true" data-iconpos="right">返回主页</a>
</div>
<div data-role="footer"><h4>Copyright 山水一程</h4></div>
</div>
</body>
</html>
jQuery Mobile_简单的爱情故事的更多相关文章
- Java面试题总结之数据结构、算法和计算机基础(刘小牛和丝音的爱情故事1)
Java面试题总结之数据结构.算法和计算机基础(刘小牛和丝音的爱情故事1)mp.weixin.qq.com 全文字数: 1703 阅读时间: 大约6 分钟 刘小牛是一名Java程序员,由于天天9 ...
- 用Python讲述冯绍峰和赵丽颖的爱情故事
昨天刷头条时得知赵丽颖当妈妈了.作为一名程序员突发奇想,不如用Python简单叙述一下冯绍峰和赵丽颖的爱情故事,于是有了本文. 代码十分简单,适合编程小白和有一些Python基础的准程序员,其中用到了 ...
- jquery实现简单瀑布流布局(续):图片懒加载
# jquery实现简单瀑布流布局(续):图片懒加载 这篇文章是jquery实现简单瀑布流布局思想的小小扩展.代码基于前作的代码继续完善. 图片懒加载就是符合某些条件时才触发图片的加载.最常见的具体表 ...
- jquery实现简单瀑布流布局
jquery实现简单瀑布流布局 是开头都会说的原理 瀑布流布局有两种,一种是固定列,一种是非固定列.在此主要记述第一种的实现. 固定列的特征是:无论页面如何缩放,每行的总列数都一致. 一行4列的瀑布流 ...
- Javascript对象、Jquery扩展简单应用
Javascript对象,表现方式一: person = new Object(); person.firstname = "An"; person.lastname = &quo ...
- Jquery实现简单的分页
转,Jquery实现简单的翻页功能 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " ...
- jQuery系列 第一章 jQuery框架简单介绍
第一章 jQuery框架简单介绍 1.1 jQuery简介 jQuery是一款优秀的javaScript库(框架),该框架凭借简洁的语法和跨平台的兼容性,极大的简化了开发人员对HTML文档,DOM,事 ...
- jQuery实现简单前端搜索功能
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 3-5 编程练习:jQuery实现简单的图片对应展示效果
3-5 编程练习:jQuery实现简单的图片对应展示效果 通过这个章节的学习, 老师带领大家完成了一个基本的图片切换特效,接下来,我们也实现一个类似的效果,点击相应的按钮,切换对应的图片. 效果图 : ...
随机推荐
- 【LeetCode OJ】Max Points on a Line
Problem: Given n points on a 2D plane, find the maximum number of points that lie on the same straig ...
- simple grammer
<?phpecho strlen("Hello world!"); // outputs 12?> <?phpecho str_word_count(" ...
- iOS支付
1.IOS purchase 介绍 所谓的IOS 内支付就是在应用中内嵌Store,在iOS APP 中使用Store Kit framework来实现In-App Purchase,Store Ki ...
- Android启动组件的三种主流及若干非主流方式
本文来自http://blog.csdn.net/liuxian13183/ ,引用必须注明出处 启动组件的一些方式,今天做一个简要的总结 Service:通过startService()启动,或者写 ...
- 11、网页制作Dreamweaver(补充:JS零碎知识点&&正则表达式)
JS知识点 回车符/r和换行符/n的区别:/r 相当于enter,是段落与段落之间的区别, /n 相当于shift+enter,是行与行之间距离,比较小 几种window操作方法: 1.获取当前窗口大 ...
- AssemblyInfo.cs的作用
总结:用来设置项目生成的dll的常规信息.(如版本.版权等等)它就相当于一个资源文件,存放资源信息. http://www.cnblogs.com/xuyuantao/articles/927285. ...
- wireshark使用详解
编号:1009时间:2016年4月29日15:52:44功能:wireshark使用详解URl:http://blog.jobbole.com/70907/URL:http://www.9upk.co ...
- python numpy 模块简单介绍
用python自带的list去处理数组效率很低, numpy就诞生了, 它提供了ndarry对象,N-dimensional object, 是存储单一数据类型的多维数组,即所有的元素都是同一种类型. ...
- Single Number-C++中的异或
Single Number Given an array of integers, every element appears twice except for one. Find that sing ...
- thrift在windows的编译/安装--c++版
前言: thrift是出于Facebook的rpc网络编程框架, 其对跨平台和多语言的支持优于google protobuf, 但thrift在java/c#语言上应用比较多, 资料也丰富, 在win ...