protector.html 9.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262
  1. <!doctype html>
  2. <head>
  3. <title>Protection Time 50+</title>
  4. <link type="text/css" rel="Stylesheet" href="css/protector.css" />
  5. <link type="text/css" rel="Stylesheet" href="css/especificos.css" />
  6. <link type="text/css" rel="Stylesheet" href="css/menu.css" />
  7. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  8. <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=places"></script>
  9. <!-- <script src="js/aplicacion.js"></script>-->
  10. <script>
  11. window.onload = function(){
  12. var contact = document.querySelectorAll("#switcher div");
  13. var datos = ["1",
  14. "2",
  15. "3",
  16. "4"];
  17. var titulos = ["1",
  18. "2",
  19. "3",
  20. "4"];
  21. for(var i =0; i < contact.length; i++)
  22. contact[i].onclick=function() {
  23. document.getElementById("prod-text").innerHTML=datos[this.id];
  24. document.getElementById("prod-title").innerHTML=datos[this.id];
  25. for(var i =0; i < contact.length; i++)
  26. contact[i].style.color="white";
  27. this.style.color="red";
  28. }
  29. };
  30. </script>
  31. </head>
  32. <body>
  33. <div id="top_wrapper">
  34. <div id="navbar">
  35. <ul id="navlist">
  36. <li> volver </li>
  37. <li> elige tu protector </li>
  38. <li> c&oacute;mo aplicar </li>
  39. <li> m&aacute;s informaci&oacute;n </li>
  40. <li> indice uv en tu zona</li>
  41. </ul>
  42. </div>
  43. </div>
  44. <img id="title" src="Images/logo-nuevo.png"/>
  45. <div id="protector-slide">
  46. <div id="slide-wrapper">
  47. <img src="Images/protector/grosella.png" id="prod-image" />
  48. <div id="prod-description">
  49. <div id="prod-title">PROTECTION TIME FPS 50+ Fluido facial con color + ác Hialurónico</div>
  50. <div id="prod-text">Protección reforzada frente a los rayos UVA y UVB, gracias a un sistema filtrante óptimo Específico, combinado con Acido Hialurónico, hidratante protector de la piel. Ayuda a prevenir intolerancias solares y daño celular provocado por la acción de rayos UV. Textura fluida, no grasa. Acabado imperceptible. <br/>
  51. Sin perfume. Sin parabenos, con color.</div>
  52. </div>
  53. <div id="switcher">
  54. <div id="0">&#11044;</div><div id="1">&#11044;</div><div id="2">&#11044;</div><div id="3">&#11044;</div>
  55. <!-- <img id="grosella" src="Images/protector/grosella-thumb.png">
  56. <img id="sesamo" src="Images/protector/sesamo-thumb.png">
  57. <img id="sepicalm" src="Images/protector/sepicalm-thumb.png">
  58. <img id="hialuronico" src="Images/protector/hialuronico-thumb.png">-->
  59. </div>
  60. <div id="space"></div>
  61. </div>
  62. </div>
  63. <div id="aplicacion" class="seccion">
  64. <h1> <span>C&oacute;mo Aplicar </span></h1>
  65. <p>
  66. ESPECIFICOS Buenos Aires, te cuida… <br/><br/>
  67. El efecto de las radiaciones UV en la piel es acumulativo, progresivo e irreversible.<br/>
  68. Exponerse al sol sin protección puede ser nocivo para las personas. <br/><br/>
  69. Elige cuidarte del sol este verano…<br/>
  70. </p>
  71. <div class="descripciones">
  72. <div id="time" class="descripcion">
  73. <div id="timeIcon" class="imageIcon"></div>
  74. Aplicar la crema antes de salir a la playa o la piscina, y como mínimo 30 minutos antes de exponerse al sol. <br/>
  75. Reaplicar cuando sea necesario de acuerdo a cada fototipo cutáneo. <b>Se recomienda cada dos horas </b>para mantener la protección, especialmente después de un baño o nadar<br/>
  76. </div>
  77. <div id="extend" class="descripcion">
  78. <div id="extendIcon" class="imageIcon"></div>
  79. Extender PROTECTION TIME 50+ sobre la piel bien seca.<br/>
  80. Aplicar una capa abundante, extendido por toda la piel sin dejar zonas sin protección.
  81. </div>
  82. </div>
  83. <div class="descripciones">
  84. <div id="water" class="descripcion">
  85. <div id="waterIcon" class="imageIcon"></div>
  86. No pulverizar sobre la piel con agua mientras se toma el sol.<br/>
  87. En el caso de haberse humedecido, seque con toalla y aplique foto protector Protection Time 50+. No olvide orejas, nuca y pies.<br/>
  88. </div>
  89. <div id="hat" class="descripcion">
  90. <div id="hatIcon" class="imageIcon"></div>
  91. Proteger la cabeza con un sombrero o gorra con visera; los ojos con gafas adecuadas.<br/>
  92. Evitar la exposición al sol entre las 11 y las 15 horas (horario de máxima radiación ultravioleta).
  93. </div>
  94. </div>
  95. <div class="descripciones">
  96. <div id="cloud" class="descripcion">
  97. <div id="cloudIcon" class="imageIcon"></div>
  98. Utilizar protección solar aunque esté nublado.<br/>
  99. </div>
  100. <div id="hat" class="descripcion">
  101. <div id="drinkIcon" class="imageIcon"></div>
  102. Beber agua o líquidos sin alcohol para evitar la deshidratación.<br/>
  103. </div>
  104. </div>
  105. <div id="informacion" class="seccion">
  106. <h1> <span>Más información</span></h1>
  107. <p>
  108. PROTECTION TIME 50+ te ayuda prevenir, evitando las exposiciones dañinas a los rayos ultra violetas (UV).<br/><br/>
  109. Factor de Protección Solar, es un número que mide cuánto tiempo se puede estar expuesto al sol para producir el mismo enrojecimiento o eritema que si no se hubiese utilizado la crema de protección solar. <br/><br/>
  110. Es decir: Sin la utilización de un protector, la piel deberá estar expuesta al sol durante 4 minutos para empezar a enrojecerse (eritema)</br>
  111. Si se utiliza una crema de FPS de 5, se tardarán 20 minutos</br>
  112. Utilizando un FPS 50, <b>se tardarán 200 minutos.</b><br/>
  113. <br/><br/>
  114. La intensidad (RUV) depende de:
  115. </p>
  116. <div class="descripciones">
  117. <div class="descripcion">
  118. <b>La elevación del sol: </b><br/>
  119. Cuanto más alto está el sol en el cielo, mayor es la intensidad de las radiaciones UV.
  120. </div>
  121. <div class="descripcion">
  122. <b>Protección de las nubes:</b><br/>
  123. Las radiaciones UV son más intensas cuando el cielo está despejado, pero pueden ser intensas aun cuando el cielo está nublado.
  124. </div>
  125. </div>
  126. <div class="descripciones">
  127. <div class="descripcion">
  128. <b>Latitud:</b><br/>
  129. Cuanto más cerca se está del ecuador, más intensas son las radiaciones UV.
  130. </div>
  131. <div class="descripcion">
  132. <b>Altitud:</b><br/>
  133. La intensidad de las radiaciones UV aumenta un 5% por cada 1000 metros de altitud.
  134. </div>
  135. </div>
  136. <div class="descripciones">
  137. <div class="descripcion">
  138. <b>Reflexión por el suelo:</b><br/>
  139. Muchas superficies reflejan los rayos del sol y aumentan la exposición general a las radiaciones ultravioleta (por ej., el césped, la tierra y el agua reflejan menos de 10%; la nieve recién caída y el hielo, entre 80% y 90%; la arena seca de las playas, entre 20% y 30%; y la espuma del mar, 25%).
  140. </div>
  141. <div class="descripcion">
  142. <b>Capa de Ozono: </b><br/>
  143. Este gas absorbe una parte de las radiaciones UV del sol. A medida que la capa de ozono se adelgaza, aumenta la cantidad de radiaciones UV que llegan a la superficie terrestre.
  144. </div>
  145. </div>
  146. </div>
  147. <div id="uv" class="seccion">
  148. <h1> <span>Indice UV en tu zona</span></h1>
  149. <p>
  150. ESPECIFICOS Buenos Aires desarrolló una aplicación para que puedas consultar el índice UV en tu zona.<br/>
  151. Sólo necesitas ingresar tu ubicación y recibirás dicho índice
  152. </p>
  153. <div id="app">
  154. <input type="text" id="direccion" placeholder="Por favor completa tu direccion">
  155. <div id="result">
  156. <p id="cargando">Cargando...</p>
  157. </div>
  158. </div>
  159. <a href="https://play.google.com/store/apps/details?id=eba.dv.uv"><img src="Images/playstore.png" style="width:50px"></a><br/>
  160. Descargá la aplicación para tu celular<br/>
  161. Accediendo a Google Play y buscando "Indice UV Especificos Buenos Aires"
  162. <br/><br/><br/>
  163. <b>Cómo actuar según el índice ? </b><br/><br/>
  164. <img src="Images/protector/INDICES.png"><br/><br/>
  165. Alcance de la aplicación:<br/><br/>
  166. <b> Para Argentina: </b> <br/>Alcance sobre todo el país
  167. <br/><br/>
  168. <b> Para Ecuador: </b><br/>
  169. <div class="descripciones">
  170. <div class="descripcion">
  171. Ambato<br/>
  172. Bahia de Caraquez<br/>
  173. Canar<br/>
  174. Catamayo<br/>
  175. Cocafrancisco<br/>
  176. Corazon<br/>
  177. Cuenca<br/>
  178. Esmeraldas<br/>
  179. Guayaquil<br/>
  180. Ibarra<br/>
  181. Inaquito<br/>
  182. Izobamba<br/>
  183. La Concordia Canton<br/>
  184. Latacunga<br/>
  185. La Tola<br/>
  186. Loja La Argelia<br/>
  187. Macas<br/>
  188. Machala<br/>
  189. </div>
  190. <div class="descripcion">
  191. Manta<br/>
  192. Milagro<br/>
  193. Nueva Loja<br/>
  194. Nuevo Rocafuerte<br/>
  195. Portoviejo<br/>
  196. PuertoIla<br/>
  197. Puyo<br/>
  198. Quero Chaca<br/>
  199. Quito<br/>
  200. Riobamba<br/>
  201. Rumipamba<br/>
  202. Salinas<br/>
  203. San Cristobal<br/>
  204. Santa Rosa<br/>
  205. Seymour<br/>
  206. Tena<br/>
  207. Tiputini<br/>
  208. Tulcanel Rosal<br/>
  209. </div>
  210. </div>
  211. <br/>
  212. <b> Para México: </b> <br/>
  213. <div class="descripciones">
  214. <div class="descripcion">
  215. Acapulco<br/>
  216. Chihuahua<br/>
  217. Culiacan<br/>
  218. Culiacan<br/>
  219. Guadalajara<br/>
  220. Hermosillo<br/>
  221. La Paz<br/>
  222. </div>
  223. <div class="descripcion">
  224. Merida<br/>
  225. Mexicali<br/>
  226. Mexico<br/>
  227. Monterrey<br/>
  228. San Luis Potosi<br/>
  229. Torreon<br/>
  230. Tuxtla<br/>
  231. </div>
  232. </div>
  233. </div>
  234. </body>
  235. </html>