1 <h1>Image viewer</h1>2 3 <div id="container"></div>4 5 <!--6 <input id="slide" type="range"7 min="-240" max="240" step="1" value="0"8 onchange="updateSlider(this.value)" /><label id="slide_label">0</label> -->9 10 11 <button onclick="mi_picvi.select(mi_picvi.getSelectedId()-1);"> < </button>12 <button onclick="mi_picvi.select(mi_picvi.getSelectedId()+1);"> > </button>13 14 <br>15 Select card id<select onchange="mi_picvi.select(this.value);">16 <option value="-1">-1</option>17 <option value="0">0</option>18 <option value="1">1</option>19 <option value="2">2</option>20 <option value="3">3</option>21 <option value="4">4</option>22 <option value="5">5</option>23 <option value="6">6</option>24 <option value="7">7</option>25 <option value="8">8</option>26 <option value="9">9</option>27 <option value="10">10</option>28 <option value="11">11</option>29 <option value="12">12</option>30 </select>31 32 <script type="text/javascript">33 34 var container = document.getElementById('container');35 var mi_picvi = new PicVi(container);36 37 mi_picvi.add('UNO');38 mi_picvi.add('<br>DOS');39 mi_picvi.add('<br><br>TRES');40 mi_picvi.add('<br><br><br>CUATRO');41 mi_picvi.add('<br><br><br><br>CINCO');42 mi_picvi.add('<br><br><br><br><br>SEIS');43 mi_picvi.add('<br><br><br><br><br><br>SIETE');44 mi_picvi.add('<br><br><br><br><br><br><br>OCHO');45 mi_picvi.add('<br><br><br><br><br><br><br><br>NUEVE');46 mi_picvi.add('<br><br><br><br><br><br><br><br><br>DIEZ');47 48 mi_picvi.select(3);49 50 function updateSlider(v) {51 document.getElementById('slide_label').innerHTML = v;52 }53 54 55 56 57 58 </script>59 60 <style type="text/css">61 62 #container {63 position: absolute;64 width: 240px;65 height: 320px;66 border: solid 16px #333333;67 left: 400px;68 top: 0;69 }70 </style>Enlace
El enlace para compartir es: