Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<link href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" rel="stylesheet" type="text/css" />
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
​
</head>
<body>
<div data-role="page" id="home" >
    <div data-role="header">
        <h1>Home</h1>
        <a href="#page2" data-role="button" data-inline="true" data-icon="star">Страница 2</a>       
        <a href="#" data-role="button" data-icon="gear">^</a>
    </div><!-- /header -->  
    <div data-role="content">                   
  <ul data-role="listview" data-inset="true" data-filter="true">
    <li><a href="#choice" class='car'>Acura</a></li>
    <li><a href="#choice" class='car'>Audi</a></li>
    <li><a href="#choice" class='car'>BMW</a></li>
    <li><a href="#choice" class='car'>Cadillac</a></li>
    <li><a href="#choice" class='car'>Ferrari</a></li>
</ul>
    </div><!-- /content -->
</div><!-- /page -->
  
<div data-role="page" id="page2">
    <div data-role="header">
        <h1>Страница #2</h1>
      <a href="#home" data-role="button" data-inline="true" data-icon="star">Домой</a> 
      <a href="#" data-role="button" data-icon="gear">^</a>
    </div><!-- /header -->
    <div data-role="content">          
        <p>Hello world</p>    
<a href="#" data-role="button" data-icon="star" data-theme="a">Button</a>
<a href="#" data-role="button" data-icon="star" data-theme="b">Button</a>
<a href="#" data-role="button" data-icon="star" data-theme="c">Button</a>
<a href="#" data-role="button" data-icon="star" data-theme="d">Button</a>
<a href="#" data-role="button" data-icon="star" data-theme="e">Button</a>
​
    </div><!-- /content -->
</div><!-- /page -->
​
​
<div data-role="page" id="choice">
    <div data-role="header">
        <h1>Выбор</h1>
        <a href="#home" data-role="button" data-inline="true" data-icon="star">Домой</a> 
        <a href="#" data-role="button" data-icon="gear">^</a>
    </div><!-- /header -->  
    <div data-role="content">          
      <p>Вы выбрали <span id='chosencar'>...</span></p>   
      <a href="#home" data-role="button" data-inline=true data-icon="back">Назад</a> 
    </div><!-- /content -->
</div><!-- /page -->
  
</body>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
archanjspro
0viewers