Problemas Plugin con datos JSON
Publicado por Roberto (1 intervención) el 12/03/2013 12:39:11
He probado sin exagerar 20 plugin para hacer un slider y con todos tengo el mismo problema
Con datos estáticos funciona el slider, pero necesito recargar la pagina para que se aplique el estilo del slider. Y cuando la lista la hago dinámicamente con los datos que obtengo de una base de datos mediante JSON por mas que pulso F5 para actualizar no se aplica el estilo
Por lo que la dudas son dos.
¿Como consigo aplicar el estilo a la salida devuelta por el javascript? ¿Como consigo evitar tener que cargar la pagina y que aplique el javascript con la lista de imagenes.?
Por ejemplo pongo el código de la pagina donde estoy empleando el plugin prettyPhoto., que en principio es muy sencillo para hacer una galería de imagenes, no obstante repito que en todos los que he probado me pasa lo mismo.
Les agradeceria que me echaran una mano para poder acabar esta pagina por que estoy atascado en este punto.
Con datos estáticos funciona el slider, pero necesito recargar la pagina para que se aplique el estilo del slider. Y cuando la lista la hago dinámicamente con los datos que obtengo de una base de datos mediante JSON por mas que pulso F5 para actualizar no se aplica el estilo
Por lo que la dudas son dos.
¿Como consigo aplicar el estilo a la salida devuelta por el javascript? ¿Como consigo evitar tener que cargar la pagina y que aplique el javascript con la lista de imagenes.?
Por ejemplo pongo el código de la pagina donde estoy empleando el plugin prettyPhoto., que en principio es muy sencillo para hacer una galería de imagenes, no obstante repito que en todos los que he probado me pasa lo mismo.
Les agradeceria que me echaran una mano para poder acabar esta pagina por que estoy atascado en este punto.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title></title>
<link rel="stylesheet" href="css/jquery.mobile.structure-1.1.1.min.css" />
<link rel="stylesheet" href="themes/theme-cv.min.css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>
<link rel="stylesheet" href="css/prettyPhoto.css" type="text/css" media="screen" title="prettyPhoto main stylesheet" />
<script src="js/jquery.prettyPhoto.js" type="text/javascript"></script>
<style>
.galeriaDeImagenes li{
list-style:none;
float:left;margin:0 2px 0 2px;}</style>
<script src="js/jquery.jsonp.js" type="text/javascript"></script>
</head>
<body>
<h2></h2>
<div data-role="page" data-theme="e">
<div data-role="header" data-position="fixed">
<h1>Portafolio</h1>
</div><!-- /header -->
<div data-role="content" data-theme="e">
</div><!-- /content -->
<div id="main">
<div id="slider">
<!-- <ul class="gallery clearfix"> --><h4>Galeria de imagenes</h4>
<!-- <ul class="gallery galeriaDeImagenes">
<!-- <script src="js/portfolio.js" type="text/javascript"></script> --> </ul> --><ul class="gallery galeriaDeImagenes">
<li><a href="portafolio/captura_1.png" class="PRETTYPIXELIZAR" rel="pixelizar[galeria1]" title="El titulo de la imagen se puede usar para mostrar textos en la imagen."><img src="portafolio/captura_1.png" width="60" height="60" alt="Perla" /></a></li>
<li><a href="portafolio/captura_2.png" class="PRETTYPIXELIZAR" rel="pixelizar[galeria1]"><img src="portafolio/captura_2.png" width="60" height="60" alt="Nieve 2" /></a></li>
<li><a href="portafolio/captura_3.png" class="PRETTYPIXELIZAR" rel="pixelizar[galeria1]"><img src="portafolio/captura_3.png" width="60" height="60" alt="Nieve 3" /></a></li>
<li><a href="portafolio/captura_4.png" class="PRETTYPIXELIZAR" rel="pixelizar[galeria1]" title="Nieve en la Muntanya"><img src="portafolio/captura_4.png" width="60" height="60" alt="Nieve 4" /></a></li>
</ul>
</div> <!-- Slider -->
<script type="text/javascript">
$(document).ready(function(){
$(".gallery a[class='PRETTYPIXELIZAR']").prettyPhoto({theme:'facebook'});
});
</script>
</div>
</div><!-- /page -->
</body>
</html>
Valora esta pregunta
0