Problema con galería en jQuery
4 seguidores
Hola
Esto quiza es muy simple pero estoy empezando con jquery y queria usar esta galleria para un proyecto:
http://www.mudaimemo.com/p/gallery/
Estava intentando seguir las instrucciones pero no se como ni donde poner el javascript.
$('#id_of_gallery').gallery({
interval: 5500,
height: '400px',
width: '500px'
});
Si alguien me pudiese ayudar...
Perdonad pero como veis la programacion no es lo mio ;)
Muchas gracias
marcos_mpc
Nada, hombre, para esto están estos foros (entre otras cosas).
Con jQuery y otras librerías por el estilo siempre tienes que cargar la librería si quieres que luego te funcionen los plugins o los scripts que hagas tú por tu cuenta.
¡Suerte con esa web!
nostromo
Muchissimas gracias Marcos
Ya funciona!!
O sea k la primera etiqueta es la misma para qualquier jquery k utilices y la segunda es para el plugin k estas utilizando no? ...vale vale
A ver si poco a poco aprendo un poco de esto.
Te lo agradezco monton
Me has sacado de un apuro....
marcos_mpc
Creo que has enlazado dos veces el plugin y además en la segunda está mal cerrada la etiqueta, prueba esto:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js' type="text/javascript"></script><script src='http://jquery-gallery-plugin.googlecode.com/svn/trunk/0.3/jquery.gallery.0.3.min.js' type="text/javascript"></script>
nostromo
Gracias Marcos
He linkeado las dos librerias Pero aun asi parece que no funciona parece como si no la carga, el javascript esta bien??
No se k estoy haciendo mal...
He modificado el head:
Head
<link href="css/jquery.gallery.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="http://jquery-gallery-plugin.googlecode.com/svn/trunk/0.3/jquery.gallery.0.3.js"></script>
<script type="text/javascript" src="http://jquery-gallery-plugin.googlecode.com/svn/trunk/0.3/jquery.gallery.0.3.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#gallery').gallery({
interval: 5500,
height: '480px',
width: '336px'
});
});
</script>
marcos_mpc
Buenas, nostromo.
La jquery-gallery es un plugin de jquery, así que imagino que para que funcione la página tiene que cargar el plugin y la librería y por lo que veo en tu código has enlazado el plugin aquí:
<script type="text/javascript" src="js/jquery.gallery.0.3.js"></script>Pero no veo que tengas una etiqueta script para cargar la librería jQuery que te puedes descargar en la página de jquery o enlazando directamente a la página la una página de ggogle que tiene un código reducido con una línea como esta:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js' type="text/javascript"></script>nostromo
Perdona Wences la siguiente vez lo pongo
Usuario desconocido
nostromo, cuando pongas código te recomendamos que uses la etiqueta de code (el último icono a la derecha). Gracias.
nostromo
Hey
Gracias chicos no se k estoy haciendo mal...
Os pongo un link:
http://www.nostromostudio.com/casafigus/whattodo.html
head
<link href="css/jquery.gallery.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery.gallery.0.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#gallery').gallery({
interval: 5500,
height: '480px',
width: '336px'
});
});
</script>
No se si es un poco confuso
Mil gracias
Jordi
body
<div id="gallery" class="gallery"><ul class="galleryBar">
<li><a href="gallery/gardens/picture1.jpg" title="demo #1."><img src="gallery/gardens/thumbnail1.jpg" title="image1" /></a></li>
<li><a href="gallery/gardens/picture2.jpg" title="demo #2."><img src="gallery/gardens/thumbnail2.jpg" title="image2" /></a></li>
<li><a href="gallery/gardens/picture3.jpg" title="demo #3."><img src="gallery/gardens/thumbnail3.jpg" title="image3" /></a></li>
<li><a href="gallery/gardens/picture4.jpg" title="demo #1."><img src="gallery/gardens/thumbnail4.jpg" title="image4" /></a></li>
<li><a href="gallery/gardens/picture5.jpg" title="demo #2."><img src="gallery/gardens/thumbnail5.jpg" title="image5" /></a></li>
<li><a href="gallery/gardens/picture6.jpg" title="demo #3."><img src="gallery/gardens/thumbnail6.jpg" title="image6" /></a></li>
<li><a href="gallery/gardens/picture7.jpg" title="demo #1."><img src="gallery/gardens/thumbnail7.jpg" title="image7" /></a></li>
<li><a href="gallery/gardens/picture8.jpg" title="demo #2."><img src="gallery/gardens/thumbnail8.jpg" title="image8" /></a></li>
<li><a href="gallery/gardens/picture9.jpg" title="demo #3."><img src="gallery/gardens/thumbnail9.jpg" title="image9" /></a></li>
<li><a href="gallery/gardens/picture10.jpg" title="demo #3."><img src="gallery/gardens/thumbnail10.jpg" title="image10" /></a></li>
</ul>
</div>
<div id="gallery" class="gallery">
<ul>
<li><a href="gallery/gardens/picture1.jpg" rel="id_of_description"><img src="gallery/gardens/thumbnail1.jpg" title="image1" /></a></li>
<li><a href="gallery/gardens/picture2.jpg" rel="id_of_description"><img src="gallery/gardens/thumbnail2.jpg" title="image2" /></a></li>
<li><a href="gallery/gardens/picture3.jpg" rel="id_of_description"><img src="gallery/gardens/thumbnail3.jpg" title="image3" /></a></li>
<li><a href="gallery/gardens/picture4.jpg" rel="id_of_description"><img src="gallery/gardens/thumbnail4.jpg" title="image4" /></a></li>
<li><a href="gallery/gardens/picture5.jpg" rel="id_of_description"><img src="gallery/gardens/thumbnail5.jpg" title="image5" /></a></li>
<li><a href="gallery/gardens/picture6.jpg" rel="id_of_description"><img src="gallery/gardens/thumbnail6.jpg" title="image6" /></a></li>
<li><a href="gallery/gardens/picture7.jpg" rel="id_of_description"><img src="gallery/gardens/thumbnail7.jpg" title="image7" /></a></li>
<li><a href="gallery/gardens/picture8.jpg" rel="id_of_description"><img src="gallery/gardens/thumbnail8.jpg" title="image8" /></a></li>
<li><a href="gallery/gardens/picture9.jpg" rel="id_of_description"><img src="gallery/gardens/thumbnail9.jpg" title="image9" /></a></li>
<li><a href="gallery/gardens/picture10.jpg" rel="id_of_description"><img src="gallery/gardens/thumbnail10.jpg" title="image10" /></a></li>
</ul>
</div>
<div id="id_of_description" style="display:none;">
<p>This is a description of <i>picture.jpg</i>.</p>
</div></div>
cloudstudio
Pega tu codigo y vemos que has hecho, esa galeria no tiene complicacion
nostromo
Pues no funciona seguro k es asi?
cottonfields
Pues tal y como lo tienes, en el head del html.
Después acuérdate de ponerle el mismo id (#id_of_gallery) a la div donde coloques la lista de imgs.
Suerte!