Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá a todos.
Estou com dificuldades para fazer rodar um efeito jquery que dá zoom nas imagens.
No meu index, eu tenho um require de um arquivo que chama uma página onde tenho uma foto para fazer o zoom.
Quando eu acesso o arquivo diretamente do navegador, sem passar pelo index, o efeito de zoom funciona perfeito.
O problema é que se entro no index e aí click no link para abrir a página para ver o zoom, ele não funciona.
Como eu poderia arrumar isso aí ?
Segue abaixo meu código do meu index
<?php
session_start();
include_once('util/conecta.php');
include_once('carrinho/carrinho_manutencao.php');
$oquefazer = new carrinho_manutencao();
?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="carrinho/estilo.css" type="text/css" rel="stylesheet" />
<link href='http://fonts.googleapis.com/css?family=Cuprum' rel='stylesheet' type='text/css' />
<script type="text/javascript" src="jqplugin/menubolado/jquery-1.8.0.min.js"></script>
<script type="text/javascript">
$(document).ready(function() $('#menu ul li').prepend('<span></span>');
$('#menu ul li').each(function()
{
var texto = $(this).find('a').text();
$(this).find('span').text(texto);
});
$('#menu ul li').hover(function()
{
$(this).find('span').stop().animate({
marginTop:"-40px"
},600);
}, function(){
$(this).find('span').stop().animate({
marginTop:"0px"
},300);
});
});
</script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="jqplugin/carousel/js/infinitecarousel/jquery.infinitecarousel2.js"></script>
<script type="text/javascript">
$(function(){
$('#carousel').infiniteCarousel();
});
</script>
</head>
<body>
<div id="blocogeral">
<div id="topo">
</div>
<div id="menu"> <!--começo div menu-->
<ul>
<li><a href="#"> Home </a> </li>
<li><a href="#"> A Empresa </a> </li>
<li><a href="#"> Expediente </a> </li>
<li><a href="#"> Cadastro </a> </li>
<li><a href="#"> Contato </a> </li>
<li><a href="#"> Cadastro </a> </li>
</ul>
</div><!--fim div menu-->
<div id="wrapcar">
<div id="carousel">
<ul>
<li>
<img width="960" src="imagens/1.jpg" height="300px"/>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis fringilla aliquam ligula sagittis pellentesque. Sed pretium volutpat cursus. </p>
</li>
<li>
<img width="960" height="300" src="imagens/2.jpg" />
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis fringilla aliquam ligula sagittis pellentesque. Sed pretium volutpat cursus. </p>
</li>
<li>
<img width="960" height="300" src="imagens/3.jpg"/>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis fringilla aliquam ligula sagittis pellentesque. Sed pretium volutpat cursus. </p>
</li>
<li>
<img width="960" height="300" src="imagens/4.jpg"/>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis fringilla aliquam ligula sagittis pellentesque. Sed pretium volutpat cursus. </p>
</li>
<li>
<img width="960" height="300" src="imagens/5.jpg" />
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis fringilla aliquam ligula sagittis pellentesque. Sed pretium volutpat cursus. </p>
</li>
<li>
<img width="960" height="300" src="imagens/6.jpg" />
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis fringilla aliquam ligula sagittis pellentesque. Sed pretium volutpat cursus. </p>
</li>
</ul>
</div>
<div class="linha">
<div class="coluna0"></div>
<div class="coluna1"> Produtos do Carrinho</div>
<div class="coluna2"> <img src="imagens/prodcart.png" align="right"/></div>
<div class="coluna3"> <form action="" method="get"><input type="text" size="40" maxlength="40" />
</form> </div>
<div class="coluna4"> <img src="imagens/procurar.png" align="right" /></div>
</div>
</div>
<div id="clear"></div>
<div id="tamanho5px"> </div>
<div id="coluna-esquerda">
<?php
require('carrinho/listar_categoria.php');
?>
</div>
<div id="centro">
<?php
require('carrinho/carrinho_acao.php');
?>
</div>
<div id="clear"></div>
<div id="rodape"></div>
</div>
</body>
</html>E aqui é o código da página que abre a foto com o zoom
<script src="../jqplugin/jqzoom_ev-2.3/js/jquery-1.6.js" type="text/javascript"></script>
<script src="../jqplugin/jqzoom_ev-2.3/js/jquery.jqzoom-core.js" type="text/javascript"></script>
<LINK rel=stylesheet type=text/css href="../jqplugin/jqzoom_ev-2.3/css/jquery.jqzoom.css">
<A class=MYCLASS title=MYTITLE href="jqplugin/jqzoom_ev-2.3/demos/imgProd/triumph_big1.jpg">
<IMG title="IMAGE TITLE" src="jqplugin/jqzoom_ev-2.3/demos/imgProd/triumph_small1.jpg">
</A>
<script type="text/javascript">
$(document).ready(function(){
$('.MYCLASS').jqzoom();
});
</script>Obrigado pela atenção.
Carregando comentários...