Ver Mensaje Individual
  #1 (permalink)  
Antiguo 10/11/2010, 16:45
Avatar de triqui
triqui
 
Fecha de Ingreso: diciembre-2008
Ubicación: Zaragoza(España)
Mensajes: 622
Antigüedad: 5 años, 8 meses
Puntos: 31
Como estan haciendo esta tabla?

Hola, quiero replicar esto que tienen en esta web. Es una quiniela.

http://www.sorteos.es/quiniela-de-futbol/

No entiendo como hacen el efecto de darle a cada columna un hover, que pasas por las columnas y se cambian de color...pero no es un hover, porque hago click derecho para ver la imagen...y no es una imagen...es un estilo, eso esta hecho con javascript + css?


Segun los inputs utiliza un tipo text... porque no utiliza <img> si yo veo imagenes o son css...

Tambien veo en su codigo mas abajo como que utiliza <map>...puede ser que utilize eso para hacer lo de las secciones.... podeis arrojarme un poco de luz para entenderlo..esta utilizando jquery + javascript...



este es el codigo de los inputs que tiene para crear esa quiniela.



Código HTML:
Ver original
  1. <tr>
  2.  
  3. <td>
  4.     <table>
  5.    
  6.     <tr>
  7.     <td>
  8.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row0a">
  9.     </td>
  10.     <td>
  11.  
  12.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row0b">
  13.     </td>
  14.     <td>
  15.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row0c">
  16.     </td>
  17.     </tr>
  18.    
  19.     <tr>
  20.     <td>
  21.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row1a">
  22.  
  23.     </td>
  24.     <td>
  25.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row1b">
  26.     </td>
  27.     <td>
  28.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row1c">
  29.     </td>
  30.     </tr>
  31.    
  32.     <tr>
  33.  
  34.     <td>
  35.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row2a">
  36.     </td>
  37.     <td>
  38.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row2b">
  39.     </td>
  40.     <td>
  41.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row2c">
  42.     </td>
  43.  
  44.     </tr>
  45.    
  46.     <tr>
  47.     <td>
  48.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row3a">
  49.     </td>
  50.     <td>
  51.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row3b">
  52.     </td>
  53.     <td>
  54.  
  55.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row3c">
  56.     </td>
  57.     </tr>
  58.    
  59.     <tr>
  60.     <td>
  61.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row4a">
  62.     </td>
  63.     <td>
  64.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row4b">
  65.  
  66.     </td>
  67.     <td>
  68.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row4c">
  69.     </td>
  70.     </tr>
  71.    
  72.     <tr>
  73.     <td>
  74.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row5a">
  75.     </td>
  76.  
  77.     <td>
  78.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row5b">
  79.     </td>
  80.     <td>
  81.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row5c">
  82.     </td>
  83.     </tr>
  84.    
  85.     <tr>
  86.     <td>
  87.  
  88.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row6a">
  89.     </td>
  90.     <td>
  91.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row6b">
  92.     </td>
  93.     <td>
  94.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row6c">
  95.     </td>
  96.     </tr>
  97.  
  98.    
  99.     <tr>
  100.     <td>
  101.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row7a">
  102.     </td>
  103.     <td>
  104.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row7b">
  105.     </td>
  106.     <td>
  107.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row7c">
  108.  
  109.     </td>
  110.     </tr>
  111.    
  112.     <tr>
  113.     <td>
  114.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row8a">
  115.     </td>
  116.     <td>
  117.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row8b">
  118.     </td>
  119.  
  120.     <td>
  121.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row8c">
  122.     </td>
  123.     </tr>
  124.    
  125.     <tr>
  126.     <td>
  127.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row9a">
  128.     </td>
  129.     <td>
  130.  
  131.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row9b">
  132.     </td>
  133.     <td>
  134.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row9c">
  135.     </td>
  136.     </tr>
  137.    
  138.     <tr>
  139.     <td>
  140.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row10a">
  141.  
  142.     </td>
  143.     <td>
  144.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row10b">
  145.     </td>
  146.     <td>
  147.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row10c">
  148.     </td>
  149.     </tr>
  150.    
  151.     <tr>
  152.  
  153.     <td>
  154.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row11a">
  155.     </td>
  156.     <td>
  157.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row11b">
  158.     </td>
  159.     <td>
  160.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row11c">
  161.     </td>
  162.  
  163.     </tr>
  164.    
  165.     <tr>
  166.     <td>
  167.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row12a">
  168.     </td>
  169.     <td>
  170.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row12b">
  171.     </td>
  172.     <td>
  173.  
  174.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row12c">
  175.     </td>
  176.     </tr>
  177.    
  178.     <tr>
  179.     <td>
  180.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row13a">
  181.     </td>
  182.     <td>
  183.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row13b">
  184.  
  185.     </td>
  186.     <td>
  187.     <input size="1" maxlength="1" class="input1" type=text value="0" name="bet0row13c">
  188.     </td>
  189.     </tr>
  190.    
  191.     </table>
  192. </td>
  193.  
  194. </tr>
__________________
La nueva red social de quinielas quiniela resultados - Demostración de triquinielas

Última edición por triqui; 10/11/2010 a las 16:51