Comunidad de diseño web y desarrollo en internet online

Ayuda con Galeria Jquery

Citar            
MensajeEscrito el 14 Dic 2013 06:27 pm
Hola Gente como va???

Esperaba que puedan ayudarme.
Necesito hacer esta galeria Jquerry
http://www.gcmingati.net/wordpress/wp-content/lab/jquery/imagestrip/imageslide-plugin.html.

Con la diferencia que en vez de seleccionar con números lo pueda hacer con la palabras que yo lo asigne.

Ejemplo que en vez de 1 diga "Chevrolet" que en vez de 2 diga "Audi", etc.

Y que lo pueda hacer en otra capa separado de la imágen. Es posible con esta Galeria o es mejor recurrir a otra ? cual sería?

Espero que me puedan ayudar de verdad necesito resolver esto

Desde ya muchas gracias a todos.

Por Elcanalla86

30 de clabLevel



 

chrome
Citar            
MensajeEscrito el 14 Dic 2013 08:19 pm
Hola,
sólo lo he mirado por encima, pero creo que si en la línea:

jQuery("div#stripTransmitter" + j + " ul").append("<li><a title='" + jQuery(this).find("img").attr("alt") + "' href='#'>"+(n+1)+"<\/a><\/li>");

cambias (n+1) por jQuery(this).find("img").attr("alt"), y poniendo en los alt la palabra que quieras funcionaría.

Las imágenes y los selectores están en dos div diferentes, así que puedes colocarlos donde quieras con css.

Por isidoro

Claber

498 de clabLevel

2 tutoriales

Genero:Masculino  

firefox
Citar            
MensajeEscrito el 15 Dic 2013 07:41 am
Genial amigooooo.

Sí sabía era ahí donde había que tocar pero no supe bien que poner.
Funcionó a la parfección, mil gracias.

GENIO

Saludos

Por Elcanalla86

30 de clabLevel



 

chrome
Citar            
MensajeEscrito el 16 Dic 2013 01:21 am
Ok Funciono a la perfección hasta que me tope con tener que hacer varios items en diferentes divs o ul.
Y no consigo hacerlo.

Tengo la siguiente lista

Código :

<div id="botoneralinea2">
                <div id="listaslineas">
                
                
              <div id="listalineasuno">
              
              <ul class="listalinea1">
              <li><img src="imagenes/estrella.png" /><span>Hogar</span></li>
              <li><img src="imagenes/guia.png" /><a href="">Aroma de Hogar</li>
             
              
              
              </ul>
              
              
              <ul class="listalinea2">
               <li><img src="imagenes/estrella.png" /><span>Textil</span></li>
              <li><img src="imagenes/guia.png" /><a href="">Agua de Ropa</a></li>
              </ul>
              
              </div>
              
               <div id="listalineasdos">
                 <ul class="listalinea3">
              <li><img src="imagenes/estrella.png" /><span>Baño</span></li>
              <li><img src="imagenes/guia.png" /><a href="">Jabón Líquido</a></li>
            <li><img src="imagenes/guia.png" /><a href="">Espuma de baño</a></li>
             </ul>
              
              
              </div><!------------ listaslineastres------------>
              
              
              <div id="listalineastres">
              <ul class="listalinea4">
                <li><img src="imagenes/estrella.png" /><span>Relax</span></li>
              <li><img src="imagenes/guia.png" /><a href="">Sales de baño</a></li>
            <li><img src="imagenes/guia.png" /><a href="">Bombas <br /><small class="esfer">esfervecentes</small> </a></li>
           
             <li><img src="imagenes/guia.png" /><a href="">Body splash</a></li>
             
           
              
              </ul>
                </div><!------------ listaslineascinco------------>
                
                
                <div id="listalineascuatro">
              <ul class="listalinea5">
                <li><img src="imagenes/estrella.png" /><span>Accesorios</span></li>
              <li><img src="imagenes/guia.png" /><a href="">Esponjas</a></li>
            <li><img src="imagenes/guia.png" /><a href="">Cepillos</a></li>
           
             <li><img src="imagenes/guia.png" /><a href="">Manoplas</a></li>
                   <li><img src="imagenes/guia.png" /><a href="">Masajeadores</a></li>
                   </ul>
                   
                   <ul class="listalinea6">
                   <li><br /></li>
                   <li><img src="imagenes/guia.png" /><a href="">cisnes</a></li>
            <li><img src="imagenes/guia.png" /><a href="">turbantes</a></li>
           
             <li><img src="imagenes/guia.png" /><a href="">Cofias</a></li>
                   <li><img src="imagenes/guia.png" /><a href="">Guantes exfos</a></li>
                   
                   </ul>
             
           
              
              </ul>
                </div><!------------ listaslineascinco------------>
              
              
              
              </div><!------------ listaslineas------------>
              
              
                </div><!------------ botonera2------------>
                







Las imágenes de al lado son de adorno las verdaderas imágenes las puse con los nombres como dice en la instalación

Como hago para que cada boton de las lista me cambie la imágen.


La imágenes no tienen ningún link se podra anexar encontes con un link <a href=""></a>

Si es asi como hago?

Ayudaaaaa jaja

Espero me puedan ayudar gracias.

Por Elcanalla86

30 de clabLevel



 

chrome
Citar            
MensajeEscrito el 16 Dic 2013 07:34 am
Hola,
ahora no me deja entrar en el enlace de la galería, pero me imagino que la galería estará hecha para usar con un único ul, así que si no quieres modificar el código js tendrás que meter todos los li en un ul.
Me imagino que en la galería los li flotan a la izquierda, así que si les pones un display: inline-block, y le das al ul un width que se ajuste a la anchura de las líneas, los li saltarán automáticamente.
Además si las imágenes de la izquierda van a ser de adorno como dices, es mejor que uses el pseudo-elemento :before, le das un width y un height y le pones esa imagen como background en lugar de usar un img.

Por isidoro

Claber

498 de clabLevel

2 tutoriales

Genero:Masculino  

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.