• 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>
    
  • 相关阅读:
    [Java] 理解JVM之二:类加载步骤及内存分配
    [Java] 理解JVM之三:垃圾回收机制
    [Java] I/O底层原理之一:字符流、字节流及其源码分析
    [Java] 集合框架原理之二:锁、原子更新、线程池及并发集合
    [Web] Web请求过程之一:HTTP
    [Web] Web请求过程之二:DNS 域名解析
    [Java] 集合框架原理之一:基本结构与源码分析
    Hello World
    c++数据结构图论创建一个导航图,实现基本功能
    jquery1.9: unrecognized expression: a[@href=
  • 原文地址:https://www.cnblogs.com/cag2050/p/5084426.html
Copyright © 2020-2023  润新知