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>