listview on splitview doesn’t scroll

listview on splitview doesn’t scroll

BY 07 Aug 2013 Web Application Development

 

Hello.

I made test splitview page and added list to each panes. But listview in this case doesn’t scroll. Not in simulator, not in emulator. What is wrong?

SDK v2.2

 

Code:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <meta name="description" content="A Tizen Web UI FW single-page template generated by Tizen Web IDE"/>
    <meta name="viewport" content="width=device-width,user-scalable=no"/>
    <link rel="stylesheet" href="tizen-web-ui-fw/latest/themes/tizen-white/tizen-web-ui-fw-theme.css" name="tizen-theme"/>
    <title>Tizen Web IDE - Template - Tizen - Tizen Web UI Framework - Single-Page</title>
    <script src="tizen-web-ui-fw/latest/js/jquery.js"></script>
    <script src="tizen-web-ui-fw/latest/js/tizen-web-ui-fw-libs.js"></script>
    <script src="tizen-web-ui-fw/latest/js/tizen-web-ui-fw.js"data-framework-theme="tizen-white"></script>
    <script type="text/javascript" src="./js/main.js"></script>
    <link rel="stylesheet" type="text/css" href="./css/style.css"/>
</head>
<body>
    <div data-role="page">
        <div data-role="header" data-position="fixed">
            <h1>Single-page application </h1>
        </div>
        <div data-role="content">
       <div id="splitview" data-role="splitview" data-ratio="0.4, 0.6">
  <div id="left" class="ui-pane">
  <ul data-role="listview">
 <li><a href="#">Acura</a></li>
 <li><a href="#">Audi</a></li>
 <li><a href="#">BMW</a></li>
 <li><a href="#">Honda</a></li>
 <li><a href="#">Toyota</a></li>
 <li><a href="#">Peugeot</a></li>
 <li><a href="#">Renault</a></li>
 <li><a href="#">Maybach</a></li>
 <li><a href="#">Porsche</a></li>
 <li><a href="#">Robur</a></li>
 <li><a href="#">Goliath</a></li>
 <li><a href="#">Hansa</a></li>
 <li><a href="#">Lloyd</a></li>
 <li><a href="#">Wartburg</a></li>
 <li><a href="#">Facel</a></li>
 <li><a href="#">Scoda</a></li>
</ul>
  </div>
  <div id="right" class="ui-pane">
<ul data-role="listview">
<li><a href="#">Acid Green</a></li>
<li><a href="#">Alice Blue</a></li>
<li><a href="#">Amazon</a></li>
<li><a href="#">Antique White</a></li>
<li><a href="#">Atomic Tangerine</a></li>
<li><a href="#">Beaver</a></li>
<li><a href="#">Black Olive</a></li>
<li><a href="#">Blizzard Blue</a></li>
<li><a href="#">Blue Sapphire</a></li>
<li><a href="#">Bubbles</a></li>
<li><a href="#">Crimson Glory</a></li>
<li><a href="#">Dark Brown</a></li>
<li><a href="#">Deep Taupe</a></li>
<li><a href="#">Forest Green</a></li>
<li><a href="#">Fuchsia Pink</a></li>
<li><a href="#">Diamond</a></li>
<li><a href="#">Coral Pink</a></li>
<li><a href="#">Chinese Violet</a></li>
<li><a href="#">Caribbean Green</a></li>
<li><a href="#">Banana Mania</a></li>
<li><a href="#">Celeste</a></li>
</ul>
</div>
</div>
        </div>
        <div data-role="footer" data-position="fixed">
            <h4>Footer content</h4>
        </div>
    </div>
</body>
</html>
Written by
Keep Reading All Posts
Announcing the Tizen Studio 6.1 Release

BY

16 Apr 2025

Tizen Studio

Read More
Announcing the Tizen Studio 6.0 Release

BY

04 Nov 2024

Tizen Studio

Read More
Announcing the Tizen Studio 5.6 Release

BY

02 Apr 2024

Tizen Studio

Read More