Búsqueda en el Foro:
Buscar


Autor Mensaje
Mensaje20-01-2013, 16:56 (UTC)    
Título del mensaje: Problema con slider

Tengo un problema con un slider de imagenes y es que no puedo pasar las imagenes con la flecha que aparece abajo y el código no lo entiendo. Espero que me podáis ayudar plis. Dejo el código:

Código:
<div id="slider">
<div class="buttons"><span class="prev">prev</span> <span class="next">next</span></div>
<div class="holder">
<div class="frame">&nbsp;</div>
<div class="content">
<ul>
    <li class="fragment">
    <div class="image"><img src="http://i49.tinypic.com/2uolw6x.jpg" alt="google.es" /></div>
    <div class="cnt">
    <div class="cl">&nbsp;</div>
    <div class="side-a">
    <h4>Logo TDK Club</h4>
    <ul class="rating">
        <li><span class="star full-star">&nbsp;</span></li>
        <li><span class="star full-star">&nbsp;</span></li>
        <li><span class="star full-star">&nbsp;</span></li>
        <li><span class="star full-star">&nbsp;</span></li>
        <li><span class="star empty-star">&nbsp;</span></li>
        <li><span class="votes">1.456 votes</span></li>
    </ul>
    </div>
    <div class="side-b">
    <p>Logotipo para el club TDK</p>
    </div>
    <div class="cl">&nbsp;</div>
    </div>
    </li>
    <li class="fragment">
    <div class="image"><img src="http://i50.tinypic.com/292b1v7.jpg" alt="google.es" /></div>
    <div class="cnt">
    <div class="cl">&nbsp;</div>
    <div class="side-a">
    <h4>Titulo de la imagen 2</h4>
    <ul class="rating">
        <li><span class="star full-star">&nbsp;</span></li>
        <li><span class="star full-star">&nbsp;</span></li>
        <li><span class="star full-star">&nbsp;</span></li>
        <li><span class="star full-star">&nbsp;</span></li>
        <li><span class="star empty-star">&nbsp;</span></li>
        <li><span class="votes">1.456 votes</span></li>
    </ul>
    </div>
    <div class="side-b">
    <p>Descripcion de la imagen 2</p>
    </div>
    <div class="cl">&nbsp;</div>
    </div>
    </li>
    <li class="fragment">
    <div class="image"><img src="url de la imagen 3" alt="" /></div>
    <div class="cnt">
    <div class="cl">&nbsp;</div>
    <div class="side-a">
    <h4>titulo de la imagen 3</h4>
    <ul class="rating">
        <li><span class="star full-star">&nbsp;</span></li>
        <li><span class="star full-star">&nbsp;</span></li>
        <li><span class="star full-star">&nbsp;</span></li>
        <li><span class="star full-star">&nbsp;</span></li>
        <li><span class="star empty-star">&nbsp;</span></li>
        <li><span class="votes">1.456 votes</span></li>
    </ul>
    </div>
    <div class="side-b">
    <p>Descripcion imagen 3</p>
    </div>
    <div class="cl">&nbsp;</div>
    </div>
    </li>
    <li class="fragment">
    <div class="image"><img src="Url de la imagen 4" alt="" /></div>
    <div class="cnt">
    <div class="cl">&nbsp;</div>
    <div class="side-a">
    <h4>Titulo de la imagen 4</h4>
    <ul class="rating">
        <li><span class="star full-star">&nbsp;</span></li>
        <li><span class="star full-star">&nbsp;</span></li>
        <li><span class="star full-star">&nbsp;</span></li>
        <li><span class="star full-star">&nbsp;</span></li>
        <li><span class="star empty-star">&nbsp;</span></li>
        <li><span class="votes">1.456 votes</span></li>
    </ul>
    </div>
    <div class="side-b">
    <p>Descripcion de la imagen 4</p>
    </div>
    <div class="cl">&nbsp;</div>
    </div>
    </li>
</ul>
</div>
</div>
</div>
<br />
Mensaje21-01-2013, 03:40 (UTC)    
Título del mensaje:

Hola,

Con el html solo no se podra hacer mucho sin el css, y si hay enlaces subido a xooimage no se podra visualizar bien,

Acercate a este tema.
http://www.paginawebgratis.es/forum/viewtopic.php?t=66728

Estos slider soy muy personalizable para agregarlo.

Saludos.
______________
Mensaje21-01-2013, 06:30 (UTC)    
Título del mensaje: si

Muchas gracias por el aporte pero me gustaría modificar el slider que tengo actualmente en el caso de que se pudiera, claro. Creo que este es el código css completo:

Código:
#slider { width: 630px; height: 350px; position: relative; }
#slider .buttons { position: absolute; top: 250px; right: 15px; z-index: 101; }
#slider .buttons span { float: left; display: inline; width: 28px; height: 27px; font-size: 0; line-height: 0; text-indent: -4000px; cursor: pointer; margin-left: 2px; }
#slider .buttons span.prev { background: url(http://i47.tinypic.com/c2ook.png) no-repeat 0 0; }
#slider .buttons span.next { background: url(http://i47.tinypic.com/swv5zd.png) no-repeat 0 0; }
#slider .holder { width: 630px; height: 350px; position: relative; overflow: hidden; }
#slider .content { height: 350px; width: 100000px; position: absolute; top: 0; left: 0; }
#slider .fragment { float: left; display: inline; width: 630px; height: 350px; list-style-type: none; }
#slider .fragment .image { position: relative; width: 630px; height: 287px; }
#slider .frame { width: 638px; height: 287px; position: absolute; top: 0; left: 0; z-index: 100; background: url(http://i47.tinypic.com/14sjyj5.png) no-repeat 0 0; }
#slider .frame { font-size: 0; line-height: 0; text-indent: -4000px; }
#slider .fragment .cnt { margin-top: 5px; height: 49px; background: url(http://img29.xooimage.com/files/2/8/9/slider-cnt-bg-1622f44.gif) repeat-x; color: #fff; font-size: 11px; line-height: 1.4; padding: 8px 15px; }
#slider .fragment .cnt .side-a { float: left; display: inline; width: 150px; }
#slider .fragment .cnt .side-b { float: right; display: inline; width: 430px; }
#slider .fragment .cnt h4 { font-size: 19px; font-weight: bold; color: #212121; text-transform: uppercase; margin-bottom: 5px; }
#slider .fragment .cnt .rating li { float: left; display: inline; list-style-type: none; font-size: 9px; color: #050505; text-transform: uppercase; margin-right: 1px; }
#slider .fragment .cnt .rating li .star { float: left; display: inline; width: 15px; height: 15px; font-size: 0; line-height: 0; text-indent: -4000px; }
#slider .fragment .cnt .rating li .empty-star { background: url(http://i50.tinypic.com/v6p0de.gif); }
#slider .fragment .cnt .rating li .full-star { background: url(http://i48.tinypic.com/ygriw.gif); }
#slider .fragment .cnt .rating li .votes { float: left; display: inline; margin-top: 3px; margin-left: 4px; }/*
Mensaje21-01-2013, 11:18 (UTC)    
Título del mensaje: Re: si

hola, no se de donde sale el codigo, para poder ayudarte mejor, si ese sitio tiene un tutorial o algo orientativo o la descarga de ficheros, o no se como plantea este slider....
hace unas semanas, tuve que montoar yo tambien un slider, y estuve dando muchas vueltas, y por experiencia, al codigo le falta una parte, el javascript (.js) que es el que hace la funcion de animacion.
vamos aprobarlo de otra forma, en "texto encima de la pagina pon esto:
Cita:
<script type="text/css" src="/slider.css"></script>
<script type="text/javascript" src="/swfobject.js"></script>

lo marcado de verde, es la ruta que hace que tu codigo (div=slider) llame al css y si lo hay al javascript (si no tiene java, elimina esa frase)
coje un block de notas, y pega todo el codigo css y guardalo como "slider.css" por ejemplo, el caso es que termine en css y el nombre que le des, debe coincidir con el codigo html la parte donde empieza con div=slider...
te pongo un ejemplo, si lo quieres llamar, supongamos, pasaimagen seria:
el css = pasaimagen.css
y el el div, empezaria por: <div id="pasaimagen"> ...

ahora deberas usar un uploader, subidor de archivos directos que sepas con certeza que os archivos son directos y duraderos, yo en estos casos uso www.fileden.com facil, rapido y no caduca, ahy subes el js y el css, para poner las rutas en el codigo de "texto encima de la pagina"
con esto, evita tener que pones todo el css en la web, y ahorras mucho peso ademas de lograr poner el codigo en <head>...</head>...
el ultimo paso es poner tu codigo html, en la parte donde quieras ponerlo, y listo, prueba ahora si funciona...


pd: yo al final opte por crearme mi propio slider, con un programa
______________

10 años ayudando a la comunidad!!
>las cuestiones de problemas con webs se atienden en el foro.
>Ticket a: ayuda@paginawebgratis.es -- Reportes a: support-es@webme.com
Mensaje21-01-2013, 12:46 (UTC)    
Título del mensaje:

Gracias javi pero eso que me explicas es muy difícil para mi. Sé leer mas o menos los códigos html pero hasta el punto de crear mi propio slider o lo que me explicas no. El código lo cogí de una plantilla css. T dejo el link:

http://www.paginawebgratis.es/forum/viewtopic.php?t=47431

Haber si me puedes ayudar porque es el único slider que me gusta.
Mensaje22-01-2013, 15:54 (UTC)    
Título del mensaje:

pues justo lo que yo decia, tiene los java que debes colocar en texto encima de la pagina:
Código:
<script src="http://img21.xooimage.com/files/b/b/3/jquery-1.3.2.min-b8f180.js" type="text/javascript"></script>
<script src="http://img29.xooimage.com/files/0/4/2/fns-15a43ee.js" type="text/javascript"></script>

______________

10 años ayudando a la comunidad!!
>las cuestiones de problemas con webs se atienden en el foro.
>Ticket a: ayuda@paginawebgratis.es -- Reportes a: support-es@webme.com
Mensaje23-01-2013, 07:14 (UTC)    
Título del mensaje: no funciona

Pues a mi me sigue sin funcionar. Las imagenes no se pasan automáticamente y tampoco se mueven si le das a la flecha de la derecha. Ya no sé que hacer para que funcione. Puse todo lo que me dijiste pero no me funciona.
Mensaje23-01-2013, 09:15 (UTC)    
Título del mensaje: Re: no funciona

prozamologos escribió:
Pues a mi me sigue sin funcionar. Las imagenes no se pasan automáticamente y tampoco se mueven si le das a la flecha de la derecha. Ya no sé que hacer para que funcione. Puse todo lo que me dijiste pero no me funciona.


Hola,

Es porque los archivos estan subido a xooimage y al subirlo no se ven en la página, para poder verlo tienes que darle primero clic a estos enlaces para que tu navegador lo reconosca.

http://img21.xooimage.com/files/b/b/3/jquery-1.3.2.min-b8f180.js
http://img29.xooimage.com/files/0/4/2/fns-15a43ee.js

Yo te recomendaria que cambies de servidor.

Saludos.
______________
Mensaje23-01-2013, 09:30 (UTC)    
Título del mensaje:

Vale, muchas gracias. Lo he subido de nuevo con el mismo nombre a xooimage y sigue sin funcionarme el slider http://prozamologos.es.tl/slider.htm


Ultima edición por prozamologos el Mie Ene 23, 2013 5:35 am; editado 1 vez
Mensaje23-01-2013, 10:12 (UTC)    
Título del mensaje:

hola, segun veo en tu web, no estan colocados bien los codigos, te puse mas arriba el procedimiento a seguir., leetelo 2 o 3 veces si hace falta, y con paciencia lo conseguiras:

texto encima de la pagina: :
Código:
<script src="http://img21.xooimage.com/files/b/b/3/jquery-1.3.2.min-b8f180.js" type="text/javascript"></script>
<script src="http://img29.xooimage.com/files/0/4/2/fns-15a43ee.js" type="text/javascript"></script>
los con archivos directos resubidos. (dudo que xooimagen sea ilimitado y directo...)

el resto, el codigo de css en donde pone css, y el otro html en donde quieras el slider..
mi otro metodo era no poner el css colocarlo en un block de notas y guardalo como..... "slider.css" subirlo a un subidor de archivos directos y peguar la ruta en este codigo:
Código:
<script type="text/css" src="/slider.css"></script>
y colocarlo a continuacion de los otros dos, osea:
Código:
<script src="http://img21.xooimage.com/files/b/b/3/jquery-1.3.2.min-b8f180.js" type="text/javascript"></script>
<script src="http://img29.xooimage.com/files/0/4/2/fns-15a43ee.js" type="text/javascript"></script>
<script type="text/css" src="/slider.css"></script>

______________

10 años ayudando a la comunidad!!
>las cuestiones de problemas con webs se atienden en el foro.
>Ticket a: ayuda@paginawebgratis.es -- Reportes a: support-es@webme.com
Mensaje23-01-2013, 10:26 (UTC)    
Título del mensaje:

Vale pero yo tengo un lío impresionante. No sé cual es el código completo del slider. Tampoco sé en cual página subir los archivos directamente. Por lo demás lo he entendido todo.
Mensaje23-01-2013, 19:18 (UTC)    
Título del mensaje:

me da que no lees ... tu mismo pusiste en tu primer hilo el html y despues el css tambien te puse una pagina buena para subir archivos directos
______________

10 años ayudando a la comunidad!!
>las cuestiones de problemas con webs se atienden en el foro.
>Ticket a: ayuda@paginawebgratis.es -- Reportes a: support-es@webme.com
Mostrar mensajes anteriores:   


Powered by phpBB © 2001, 2005 phpBB Group