jquerymobile

<!DOCTYPE html>

<html>

<head>

<link rel="stylesheet"

href="../../ui/jquery.mobile-1.4.5/jquery.mobile-1.4.5.min.css">

<link rel="stylesheet"

href="../../ui/jquery.mobile-1.4.5/jquery.mobile-1.4.5.css">

<script src="../../ui/jquery.mobile-1.4.5/js/jquery.js"></script>

<script src="../../ui/jquery.mobile-1.4.5/jquery.mobile-1.4.5.min.js"></script>

<link rel="stylesheet" type="text/css"

href="../../ui/main/css/style.css" />

<script type="text/javascript"

src="../../ui/main/js/jquery-1.8.0.min.js"></script>

<script type="text/javascript">

function getDown() {

var gundong = document.getElementsByClassName("gundong");

var L = gundong.length;

var show = 1;

for ( var i = 0; i < L; i++) {

if (gundong[i].style.display == ‘block‘) {

show = i;

break;

}

}

if (show + 2 < L) {

gundong[show].style.display = ‘none‘;

gundong[show + 2].style.display = ‘block‘;

}


}


function getUp() {

var gundong = document.getElementsByClassName("gundong");

var L = gundong.length;

var show = 1;

for ( var i = 0; i < L; i++) {

if (gundong[i].style.display == ‘block‘) {

show = i;

break;

}

}

if (show - 1 >= 0 && show + 2 <= L) {

gundong[show - 1].style.display = ‘block‘;

gundong[show + 1].style.display = ‘none‘;

}


}

</script>

<style type="text/css">

ul {

float: left;

margin-right: 5px;

text-align: center;

}


li {

float: left;

margin-right: 5px;

text-align: center;

}


a {

width: 80px;

}


#q {

position: fixed;

}

</style>

</head>

<body>

<div data-role="page">

<div data-role="header">

<div data-role="controlgroup" data-type="horizontal" style="width: 100%;">

<ul style="width: 100%;">

<li><input type=‘button‘ value="<"></li>

<li class="gundong" id="liudong" style="display: block"><a

href="#pageone" data-role="button">转转转转</a></li>

<li class="gundong" id="liudong" style="display: block"><a

href="#" data-role="button">播转转转</a></li>

<li class="gundong" id="liudong" style="display: none"><a

href="#" data-role="button">到转转转</a></li>

<li class="gundong" id="liudong" style="display: none"><a

href="#" data-role="button">新转转转</a></li>

<li class="gundong" id="liudong" style="display: none"><a

href="#" data-role="button">浪</a></li>

<li class="gundong" id="liudong" style="display: none"><a

href="#" data-role="button">微</a></li>

<li class="gundong" id="liudong" style="display: none"><a

href="#" data-role="button">博</a></li>

<li class="gundong" id="liudong" style="display: none"><a

href="#" data-role="button">转播到新浪微博</a></li>

<li class="gundong" id="liudong" style="display: none"><a

href="#" data-role="button">转播到新浪微博</a></li>

<li class="gundong" id="liudong" style="display: none"><a

href="#" data-role="button">转播到新浪微博</a></li>

<li class="gundong" id="liudong" style="display: none"><a

href="#" data-role="button">转播到新浪微博</a></li>

<li><input type=‘button‘ value=">"></li>

</ul>

</div>

   </div>

</div>


<div data-role="content">

<p>这些按钮仅供演示,无任何效果。</p>

</div>


<div data-role="footer">

<h1>我的页脚</h1>

</div>

</div>

</body>

</html>


郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。