Ver Mensaje Individual
  #1 (permalink)  
Antiguo 26/02/2015, 13:54
Avatar de ceaped
ceaped
 
Fecha de Ingreso: febrero-2004
Mensajes: 2.185
Antigüedad: 20 años, 9 meses
Puntos: 9
Pregunta Un solo estilo para varios tooltip

Buenas tardes
Utilizo este toolTip:
aquí/

En el head:

Código Javascript:
Ver original
  1. <script type="text/javascript" charset="utf-8" src="js/jquery.min.js"></script>
  2. <script type="text/javascript" charset="utf-8" src="js/original.js" ></script>

Código Javascript:
Ver original
  1. <script type="text/javascript" charset="utf-8">
  2. $(document).ready(function(){
  3.        
  4. $("#stay-target-1").ezpz_tooltip({
  5. contentPosition: 'belowStatic',
  6. stayOnContent: true,
  7. offset: 0
  8. });
  9.  
  10. $("#stay-target-2").ezpz_tooltip({
  11. contentPosition: 'belowStatic',
  12. stayOnContent: true,
  13. offset: 0
  14. });
  15.  
  16. });
  17. </script>

Y en el body:

Código HTML:
Ver original
  1. <div class="marco_revista_1">
  2. <div class="stay-tooltip-target tooltip-target" id="stay-target-1">
  3. <img src="images/boton_1.jpg"></div>
  4. </div>
  5.  
  6. <div class="marco_revista_1">
  7. <div class="stay-tooltip-target tooltip-target" id="stay-target-2">
  8. <img src="images/boton_2.jpg"></div>
  9. </div>
  10.  
  11. <div class="stay-tooltip-content tooltip-content" id="stay-content-1">
  12. <img src="images/imagen_1.jpg" />
  13. <p>Texto...</p>
  14. </div>


Y el CSS:

Código CSS:
Ver original
  1. #stay-content-1 {
  2.     width: 450px;
  3.     height: auto;
  4.     margin: 0 auto 0 auto;
  5.     border: none;
  6.     }
  7.    
  8. #stay-content-1 p {
  9.     font-family: 'Merriweather', serif;
  10.     font-size: 0.7em;
  11.     color: #023568;
  12.     line-height: 20px;
  13.     margin-top: 10px;
  14.     text-align: justify;
  15.     float: left;
  16.     }
  17.    
  18. #stay-content-1 h5 {
  19.     font-family: 'Merriweather', serif;
  20.     font-size: 0.8em;
  21.     color: #023568;
  22.     margin-bottom: 10px;
  23.     font-weight: normal;
  24.     line-height: 15px;
  25.     text-align: left;
  26.     }
  27.  
  28. #stay-content-2 {  
  29.     width: 450px;
  30.     height: auto;
  31.     margin: 0 auto 0 auto; 
  32.     border: none;  
  33.     }
  34.    
  35. #stay-content-2 p {
  36.     font-family: 'Merriweather', serif;
  37.     font-size: 0.7em;
  38.     color: #023568;
  39.     line-height: 20px;
  40.     margin-top: 10px;
  41.     text-align: justify;
  42.     float: left;
  43.     }
  44.    
  45. #stay-content-2 h5 {
  46.     font-family: 'Merriweather', serif;
  47.     font-size: 0.8em;
  48.     color: #023568;
  49.     margin-bottom: 10px;
  50.     font-weight: normal;
  51.     line-height: 15px;
  52.     text-align: left;
  53.     }

¿Cómo hago para solo generar un estilo (css) para todos y no tener que repetir "stay-content-1", "stay-content-2...etc"

Gracias por su ayuda
__________________
Diseñador Gráfico publicitario