【jQuery】サムネイルを表示する JQuery Mobile学習動画 Twitter Facebook コピー 2020.04.21 2016.02.06 Jquery Mobileオンライン動画講座 この動画レッスンのポイントは下記です。 折りたたみできるページを作る 勉強に必要なツールについて。 今回のレッスンのプログラムのソースは以下です。 </p><br /><br /><br /><br /><br /><br /> <p><head><br /><br /><br /><br /><br /><br /><br /> <meta charset=”UTF-8″><br /><br /><br /><br /><br /><br /><br /> <meta name=”viewport” content=”width=device-width, minimum-scale=1, maximum-scale=1″><br /><br /><br /><br /><br /><br /><br /> <title>サンプル</title><br /><br /><br /><br /><br /><br /><br /> <link rel=”stylesheet” href=”http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css” /></p><br /><br /><br /><br /><br /><br /> <style><br /><br /><br /><br /><br /><br /> .ui-header .ui-title {<br /><br /><br /><br /><br /><br /><br /> margin: 0.6em 10% 0.8em;<br /><br /><br /><br /><br /><br /><br /> }<br /><br /><br /><br /><br /><br /><br /> </style><br /><br /><br /><br /><br /><br /> <p><script src=”http://code.jquery.com/jquery-1.6.4.min.js”></script><br /><br /><br /><br /><br /><br /> <script src=”http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js”></script><br /><br /><br /><br /><br /><br /><br /> </head><br /><br /><br /><br /><br /><br /><br /> <body></p><br /><br /><br /><br /><br /><br /> <div data-role=”header”><br /><br /><br /><br /><br /><br /> <h1>サムネイルを表示する</h1><br /><br /><br /><br /><br /><br /> </div><br /><br /><br /><br /><br /><br /> <div data-role=”content”><br /><br /><br /><br /><br /><br /> <div data-role=”listview”><br /><br /><br /><br /><br /><br /> <li><br /><br /><br /><br /><br /><br /> <a href=”test.html”><br /><br /><br /><br /><br /><br /><br /> <img src=”image/1.jpg”></p><br /><br /><br /><br /><br /><br /> <h1>見出し1</h1><br /><br /><br /><br /><br /><br /> <p>詳細</p><br /><br /><br /><br /><br /><br /> <p> </a><br /><br /><br /><br /><br /><br /> </li><br /><br /><br /><br /><br /><br /> <li><br /><br /><br /><br /><br /><br /> <a href=”test.html”><br /><br /><br /><br /><br /><br /><br /> <img src=”image/2.jpg”></p><br /><br /><br /><br /><br /><br /> <h1>見出し2</h1><br /><br /><br /><br /><br /><br /> <p>詳細</p><br /><br /><br /><br /><br /><br /> <p> </a><br /><br /><br /><br /><br /><br /> </li><br /><br /><br /><br /><br /><br /> <li><br /><br /><br /><br /><br /><br /> <a href=”test.html”><br /><br /><br /><br /><br /><br /><br /> <img src=”image/3.jpg”></p><br /><br /><br /><br /><br /><br /> <h1>見出3し</h1><br /><br /><br /><br /><br /><br /> <p>詳細</p><br /><br /><br /><br /><br /><br /> <p> </a><br /><br /><br /><br /><br /><br /> </li><br /><br /><br /><br /><br /><br /> <li><br /><br /><br /><br /><br /><br /> <a href=”test.html”><br /><br /><br /><br /><br /><br /><br /> <img src=”image/4.jpg”></p><br /><br /><br /><br /><br /><br /> <h1>見出4し</h1><br /><br /><br /><br /><br /><br /> <p>詳細</p><br /><br /><br /><br /><br /><br /> <p> </a><br /><br /><br /><br /><br /><br /> </li><br /><br /><br /><br /><br /><br /> <li><br /><br /><br /><br /><br /><br /> <a href=”test.html”><br /><br /><br /><br /><br /><br /><br /> <img src=”image/5.jpg”></p><br /><br /><br /><br /><br /><br /> <h1>見出5し</h1><br /><br /><br /><br /><br /><br /> <p>詳細</p><br /><br /><br /><br /><br /><br /> <p> </a><br /><br /><br /><br /><br /><br /> </li><br /><br /><br /><br /><br /><br /> </ul><br /><br /><br /><br /><br /><br /> </div><br /><br /><br /><br /><br /><br /> <p></body></p><br /><br /><br /><br /><br /><br /> <p> 更新情報 関連商品 プラグインを使わないスキルを身につけたい人のためのjQueryテクニカルノート