jquery mobile视图的切换和跳转

jquery mobile视图的切换和跳转,第1张

概述&lt!DOCTYPE html&gt&lthtml&gt &lthead&gt &lttitle&gt三国&lt/title&gt &ltmeta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0" /&gt &ltscript type="tex

@H_301_1@<!DOCTYPE HTML>
<HTML>
    <head>
        <Title>3国</Title>
        <Meta name="vIEwport" content="wIDth=device-wIDth,initial-scale=1,user-scalable=0" /> 
        <script type="text/JavaScript" src="@H_301_1@http://code.jquery.com/jquery⑴.5.min.Js"></script@H_301_1@>
        <link rel="stylesheet" href="@H_301_1@http://code.jquery.com/mobile/1.0a3/jquery.mobile⑴.0a3.min.CSS@H_301_1@" />
        <script type="text/JavaScript" src="@H_301_1@http://code.jquery.com/mobile/1.0a3/jquery.mobile⑴.0a3.min.Js"></script@H_301_1@>
    </head>
    <body>
        <div data-role="page" ID="homepage" data-position="fixed">
            <div data-role="header">
                <h1>3国</h1>
            </div>
            <div data-role="content">
                <a data-role="button" data-icon="forward" data-theme="a" href="#page_liu">蜀国</a>
                <a data-role="button" data-icon="forward" data-theme="a" href="#page_wu">吴国</a>
                <a data-role="button" data-icon="forward" data-theme="a" href="#page_cao">魏国</a>
            </div>
            <div data-role="footer" data-position="fixed">
                <h4>3国时期</h4>
            </div>
         </div>
         <div data-role="page" ID="page_liu" data-position="fixed">
            <div data-role="header">
                <h1>蜀国</h1>
                <a data-role="button" data-icon="back" data-theme="a" href="#homepage">返回</a>
            </div>
            <div data-role="content">
                刘备,关羽,张飞
            </div>
            <div data-role="footer" data-position="fixed">
                <h4>刘备的天下</h4>
            </div>
         </div>
         <div data-role="page" ID="page_wu" data-position="fixed">
            <div data-role="header">
                <h1>吴国</h1>
                <a data-role="button" data-icon="back" data-theme="a" href="#homepage">返回</a>
            </div>
            <div data-role="content">
              孙权,周瑜,黄盖
            </div>
            <div data-role="footer" data-position="fixed">
                <h4>孙权的天下</h4>
            </div>
         </div>
         <div data-role="page" ID="page_cao" data-position="fixed">
            <div data-role="header">
                <h1>魏国</h1>
                <a data-role="button" data-icon="back" data-theme="a" href="#homepage">返回</a>
            </div>
            <div data-role="content">
                曹 *** ,曹仁,曹丕
            </div>
            <div data-role="footer" data-position="fixed">
                <h4>曹 *** 的天下</h4>
            </div>
         </div>
     </body>
</HTML>

@H_301_1@效果图:

@H_301_1@

@H_301_1@ 

@H_301_1@ 


总结

以上是内存溢出为你收集整理的jquery mobile视图切换和跳转全部内容,希望文章能够帮你解决jquery mobile视图的切换和跳转所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/web/1018985.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-23
下一篇 2022-05-23

发表评论

登录后才能评论

评论列表(0条)

保存