Comentarios en: El carrusel de imágenes, retocado http://digitalicon.es/blog/carrusel-imagenes-retocado/ Sun, 29 Apr 2012 09:28:15 +0000 hourly 1 http://wordpress.org/?v=3.3.2 Por: Saúl González Fernández http://digitalicon.es/blog/carrusel-imagenes-retocado/#comment-252 Saúl González Fernández Tue, 06 Mar 2012 07:54:33 +0000 http://www.digitalicon.es/blog/?p=1811#comment-252 <p>@Manolo: Por lo que me comentas del directorio es posible que la ruta que vincula al .js sea errónea. En la cabecera del ejemplo verás una línea como ésta:</p> <pre><code> <script type="text/javascript" <i>src="DP.js"</i>></script> </code></pre> <p>Asegúrate que <code>src</code> apunta a la localización correcta del <i lang="en" xml:lang="en">script</i>.</p> <p>Si quieres mándame una dirección de prueba de la página por medio del <a href="http://digitalicon.es/contacto/" rel="nofollow">formulario de contacto</a> y veré si puedo echarte una mano.</p> @Manolo: Por lo que me comentas del directorio es posible que la ruta que vincula al .js sea errónea. En la cabecera del ejemplo verás una línea como ésta:


<script type="text/javascript" src="DP.js"></script>

Asegúrate que src apunta a la localización correcta del script.

Si quieres mándame una dirección de prueba de la página por medio del formulario de contacto y veré si puedo echarte una mano.

]]> Por: Manolo http://digitalicon.es/blog/carrusel-imagenes-retocado/#comment-251 Manolo Mon, 05 Mar 2012 18:40:49 +0000 http://www.digitalicon.es/blog/?p=1811#comment-251 Hola Saúl, por mas que miro y remiro no encuentro por ningun sitio la forma de saber cómo insertar los codigos en mi web, ¿podrías decirme dónde puedo encontrar algo? Lo pruebo en Dreamweaver y funciona perfecto, lo único es que he subido el .js a mi <i>hosting</i> y cuando inserto la ruta no me funciona, sólo funciona cuando está en el mismo directorio. Hola Saúl, por mas que miro y remiro no encuentro por ningun sitio la forma de saber cómo insertar los codigos en mi web, ¿podrías decirme dónde puedo encontrar algo? Lo pruebo en Dreamweaver y funciona perfecto, lo único es que he subido el .js a mi hosting y cuando inserto la ruta no me funciona, sólo funciona cuando está en el mismo directorio.

]]> Por: Saúl González Fernández http://digitalicon.es/blog/carrusel-imagenes-retocado/#comment-217 Saúl González Fernández Mon, 27 Feb 2012 07:47:17 +0000 http://www.digitalicon.es/blog/?p=1811#comment-217 <p>@Manolo: Tienes que modificar el marcado para que la imágen quede dentro del vínculo:</p> <pre><code> <ul id="diapos"> <li><a href="#d01"><img src="01.jpg" alt="" height="350" width="700" /></a></li>  <li><a href="#d02"><img src="02.jpg" alt="" height="350" width="700" /></a></li>  <li><a href="#d03"><img src="03.jpg" alt="" height="350" width="700" /></a></li>  </ul> </code></pre> @Manolo: Tienes que modificar el marcado para que la imágen quede dentro del vínculo:


<ul id="diapos">
  <li><a href="#d01"><img src="01.jpg" alt="" height="350" width="700" /></a></li> 
  <li><a href="#d02"><img src="02.jpg" alt="" height="350" width="700" /></a></li> 
  <li><a href="#d03"><img src="03.jpg" alt="" height="350" width="700" /></a></li> 
</ul>
]]> Por: Manolo http://digitalicon.es/blog/carrusel-imagenes-retocado/#comment-213 Manolo Mon, 27 Feb 2012 01:30:52 +0000 http://www.digitalicon.es/blog/?p=1811#comment-213 Hola Saúl, una pregunta, ¿cómo se podría poner un vinculo a la imagen? En este ejemplo el vínculo se ejecuta cuando clicamos en las letras 01, 02... Hola Saúl, una pregunta, ¿cómo se podría poner un vinculo a la imagen? En este ejemplo el vínculo se ejecuta cuando clicamos en las letras 01, 02…

]]> Por: Jorge http://digitalicon.es/blog/carrusel-imagenes-retocado/#comment-91 Jorge Sun, 12 Jun 2011 12:55:44 +0000 http://www.digitalicon.es/blog/?p=1811#comment-91 No hay nada como leer, ya me he dado cuenta, en CSS colocas las imagenes de precarga en la posición absoluta, gracias. No hay nada como leer, ya me he dado cuenta, en CSS colocas las imagenes de precarga en la posición absoluta, gracias.

]]> Por: Antonio http://digitalicon.es/blog/carrusel-imagenes-retocado/#comment-90 Antonio Mon, 23 May 2011 13:25:22 +0000 http://www.digitalicon.es/blog/?p=1811#comment-90 Perfecto... Funcionó, muchas gracias. Perfecto… Funcionó, muchas gracias.

]]> Por: Saúl González http://digitalicon.es/blog/carrusel-imagenes-retocado/#comment-89 Saúl González Sat, 21 May 2011 07:48:36 +0000 http://www.digitalicon.es/blog/?p=1811#comment-89 <p>Si te fijas en la <abbr>CSS</abbr> que hemos aplicado al carrusel, tenemos <code>#diapos</code> con un estilo que se ve cuando aún no se ejecuta el <i lang="en" xml:lang="en">script</i> y otro para <code>#diapos-on</code> cuando sí lo hace. Si quieres que desde un primer momento las imágenes aparezcan ya superpuestas, aplica a <code>#diapos</code> una posición relativa y este estilo a los elementos de la lista:</p> <pre><code> #diapos li{ position:absolute; top:0; left:0; width:700px; height:350px; list-style:none; } </code></pre> <p>No obstante, ten en cuenta que en este caso si el <i lang="en" xml:lang="en">script</i> falla el usuario se quedará sin la información de algunas de las imágenes.</p> Si te fijas en la CSS que hemos aplicado al carrusel, tenemos #diapos con un estilo que se ve cuando aún no se ejecuta el script y otro para #diapos-on cuando sí lo hace. Si quieres que desde un primer momento las imágenes aparezcan ya superpuestas, aplica a #diapos una posición relativa y este estilo a los elementos de la lista:


#diapos li{
  position:absolute;
  top:0;
  left:0;
  width:700px;
  height:350px;
  list-style:none;
}

No obstante, ten en cuenta que en este caso si el script falla el usuario se quedará sin la información de algunas de las imágenes.

]]> Por: Antonio http://digitalicon.es/blog/carrusel-imagenes-retocado/#comment-88 Antonio Thu, 19 May 2011 06:45:54 +0000 http://www.digitalicon.es/blog/?p=1811#comment-88 Saludos. Felicidades por el tutorial, de los mejores que he encontrado, y claro, no he dudado en usarlo. Más o menos todo bien, toqueteando algo, pero tengo un problema. En la página donde lo he puesto, carga otras muchas cosas, y en principio, cargo 3 imágenes para este carrusel. El problema lo tengo en que mientras carga todo, las 3 imágenes se me ven una a continuación de la otra... lógico ya que son... ¿cómo puedo hacerlo para que sólo se vea la primera... y las siguientes ya cuando empiece el carrusel? Muchas gracias. Saludos.

Felicidades por el tutorial, de los mejores que he encontrado, y claro, no he dudado en usarlo.
Más o menos todo bien, toqueteando algo, pero tengo un problema.

En la página donde lo he puesto, carga otras muchas cosas, y en principio, cargo 3 imágenes para este carrusel.

El problema lo tengo en que mientras carga todo, las 3 imágenes se me ven una a continuación de la otra… lógico ya que son… ¿cómo puedo hacerlo para que sólo se vea la primera… y las siguientes ya cuando empiece el carrusel?

Muchas gracias.

]]> Por: Bob http://digitalicon.es/blog/carrusel-imagenes-retocado/#comment-87 Bob Wed, 02 Mar 2011 17:51:19 +0000 http://www.digitalicon.es/blog/?p=1811#comment-87 Acabo de ver la respuesta #4. Mañana mismo lo pruebo. Muchas gracias por todo. Acabo de ver la respuesta #4. Mañana mismo lo pruebo. Muchas gracias por todo.

]]> Por: Saúl González http://digitalicon.es/blog/carrusel-imagenes-retocado/#comment-86 Saúl González Wed, 02 Mar 2011 11:21:53 +0000 http://www.digitalicon.es/blog/?p=1811#comment-86 <p>Vale, ya he localizado el problema.</p> <p>Los vínculos no funcionan bien porque ese ejemplo que me comentas es de la versión anterior del <i lang="en" xml:lang="en">script</i>; si pruebas el ejemplo de la nueva (<a href="http://www.digitalicon.es/ejemplos/nuevo-carrusel/carrusel-02.htm" rel="nofollow">http://www.digitalicon.es/ejemplos/nuevo-carrusel/carrusel-02.htm</a>) funcionan.</p> <p>Sobre lo de que no aparezca la capa semitransparente, es porque en la hoja de estilo el fondo lo hemos aplicado con <code>background:rgba(255,255,255,0.3);</code>, y la sintaxis RGBa aún no tiene soporte en Explorer 8. Puedes lograr ese efecto con un PNG-24 semitransparente como imagen de fondo. Echa un vistazo a <a href="http://www.digitalicon.es/blog/opacity-si-mola%E2%80%A6-%C2%BFy-la-legibilidad/" rel="nofollow">esta entrada</a> que publiqué hace tiempo, igual te sirve de ayuda.</p> Vale, ya he localizado el problema.

Los vínculos no funcionan bien porque ese ejemplo que me comentas es de la versión anterior del script; si pruebas el ejemplo de la nueva (http://www.digitalicon.es/ejemplos/nuevo-carrusel/carrusel-02.htm) funcionan.

Sobre lo de que no aparezca la capa semitransparente, es porque en la hoja de estilo el fondo lo hemos aplicado con background:rgba(255,255,255,0.3);, y la sintaxis RGBa aún no tiene soporte en Explorer 8. Puedes lograr ese efecto con un PNG-24 semitransparente como imagen de fondo. Echa un vistazo a esta entrada que publiqué hace tiempo, igual te sirve de ayuda.

]]>