weixin_33688840 2016-07-24 14:22 采纳率: 0%
浏览 18

jQuery移动面板作为菜单

I am trying to add two panels to my site one (myPanel) that opens when i swipe left to right and another that opens when swiping from right to left(myPanel2). I did that in a sense but I am having another issue. In panel1 and two I need to add links that when clicked will go to the corresponding pages. It seems to work but, instead of loading the page it does an ajax get of the page. Also after i click once on a link clicking on a new link does nothing. Here is my code

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<title>mobile app</title>
<link rel="stylesheet" type="text/css" href="css/normalize.css" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
<link rel="stylesheet" type="text/css" href="css/icons.css" />
<link rel="stylesheet" type="text/css" href="css/component.css" />
<link rel="stylesheet" type="text/css" href="css/mystyles.css" />
<script src="js/modernizr.custom.js"></script>

<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
</head>
<body>
<div data-role="page" id="pageone">
  <div data-role="panel" id="myPanel" data-display="overlay" data-ajax="false">
                <h2><img src="images/logo.png" alt="" title="" /></h2>
                <ul>
                    <li class="home"><a href="home.html" class="close-panel">Home</a></li>
                    <li class="news"><a href="news.html" class="close-panel">News</a></li>
                </ul>       


  </div>
<div data-role="panel" id="myPanel2" data-position="right" data-display="overlay">
    <h2>Panel Header</h2>
    <p>You can close the panel by clicking outside the panel, pressing the Esc key or by swiping.</p>
  </div>

  <div data-role="header">
    <h1>Page Header</h1>

    <a href="#myPanel" class="ui-btn ui-btn-inline ui-corner-all ui-shadow">Open Panel left</a>

    <a href="#myPanel2" class="ui-btn ui-btn-inline ui-corner-all ui-shadow">Open Panel right</a>
  </div>

  <div data-role="main" class="ui-content">
    <div class="homepage-banner">
    <ul id="home_ads">
    <li><span><img src="images/home-logo.png" /></span> </li>
    </ul>
    </div>
  </div>

  <div data-role="footer">
    <h1>Page Footer</h1>
  </div>
</div>
</body>
</html>

I assumed data-ajax="false" would do the trick but it isn't ideas?

  • 写回答

0条回答

      报告相同问题?

      悬赏问题

      • ¥30 如何降低hdfs中datanode的JVM内存用量
      • ¥20 SQL数据查询,子查询
      • ¥15 c++字符串分割问题
      • ¥15 vue+uniapp
      • ¥15 android freedom
      • ¥15 使用自定义的类型代替内置类型可行吗
      • ¥15 关于STM32的SPI和ENDAT接口编码器通信的问题
      • ¥15 关于#pdfbox#生成的PDF文件正常,转图片中文乱码的问题,如何解决?
      • ¥15 ADS中有关DAC控件的使用问题
      • ¥15 win11如何运行geoserver