Gracias por la respuesta redigaffi
He probado haciendo el cambio pero el resultado es el mismo.
El cambio que hice fue sustituir la linea del load por:
Código :
$.get('<?php echo SITE_URL ?>inc/vistas.php', { color_id: options.id_color, producto: options.producto } , function(data) {
$('#product_view').html(data);
});
Pero funciona exactamente igual, obtengo las vistas del color seleccionado pero al cambiar de vista no se actualiza la imagen del zoom.
Yo en mi archivo vistas.php lo que hago tras la consulta es generar por cada vista este codigo:
Código :
<div class="product_view_img">
<a href='javascript:void(0);' rel="{gallery: 'gallery1', smallimage: '<?php echo SITE_URL ?>images/products/normal/<?php echo $img_principal ?>',largeimage: '<?php echo SITE_URL ?>images/products/large/<?php echo $img_principal ?>'}">
<img src="<?php echo SITE_URL ?>images/products/medium/<?php echo $img_principal ?>" alt="" border="0" style="border-color:#F00" />
</a>
</div>
Como veran por medio del atributo REL se envian las imagenes de deben cambiarse para el zoom (smallimage y largeimage) que estan asociadas a un <A> donde se encuentra la imagen del producto:
Código :
<div id="product">
<h1 class="title"><?php echo utf8_encode($listado_producto["3"]) ?></h1>
<span class="ref">Ref <?php echo utf8_encode($listado_producto["2"]) ?></span>
<a href="<?php echo SITE_URL ?>images/products/large/<?php echo $img_principal ?>" [b]class="jqzoom" rel='gallery1' [/b] title="<?php echo utf8_encode($listado_producto["3"]) ?>" >
<div class="content_img">
<img src="<?php echo SITE_URL ?>images/products/normal/<?php echo $img_principal ?>" alt="" border="0" class="image_prod_principal" />
</div>
</a>
</div>
Asi funciona el plugin, y asi funciona de forma correcta al cargar la pantalla del producto, el problema viene cuando hago el cambio de vistas al seleccionar otro color, ahi ya no responde el cambio de imagenes al hacer clic en las vistas.
He tratado de rellamar el plugins dentro de vistas.php pero nada:
Código :
<!-- Zoom -->
<script src="<?php echo SITE_URL ?>js/jquery.jqzoom-core.js" type="text/javascript"></script>
<link rel="stylesheet" href="<?php echo SITE_URL ?>css/jquery.jqzoom.css" type="text/css">
<script type="text/javascript">
$(document).ready(function() {
$('.jqzoom').jqzoom({
zoomType: 'innerzoom',
preloadImages: false,
alwaysOn:false
});
});
</script>
Solo funciona un js que he puesto para que cambie el color del borde en la imagen seleccionada:
Código :
<script type="text/javascript">
jQuery('.product_view_img img').click (function () {
$('.product_view_img img').css("border","solid #D6D6D6 1px");
$(this).css("border","solid red 1px");
});
</script>
Alguna sugerencia!!
