O zoom Jquery não funciona [fechado]
-
13-12-2019 - |
Pergunta
estou tentando implementar Jquery ampliação no meu site baseado em Joomla nas imagens do catálogo.Não consigo fazer isso funcionar, então alguém pode me ajudar a resolver esse problema?
Eu adicionei estes scripts no head:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js" type="text/javascript"></script>
<script src="http://www.myurl.mk/templates/beez_20/javascript/jquery.zoom.js"></script>
aqui está o erro que dá:
Uncaught TypeError: Object #<HTMLDocument> has no method 'ready'
(anonymous function)
aqui está o link para um exemplo do meu site
aqui está o meu código:
<script>
$(document).ready(function(){
$('#ex1').zoom({url: '<?php echo $this->item->imageXLarge; ?>'});
});
</script>
<div class="itemImageBlock" style="float:none;">
<span class="itemImage" id="ex1">
<img src="<?php echo $this->item->image; ?>" alt="<?php if(!empty($this->item->image_caption)) echo K2HelperUtilities::cleanHtml($this->item->image_caption); else echo K2HelperUtilities::cleanHtml($this->item->title); ?>" style="width:<?php echo $this->item->imageWidth; ?>px; height:auto;" />
</span>
Solução
Eu vi sua página e descobri que você está carregando o arquivo jQuery após os arquivos dependentes.Há muitos erros no console.o primeiro é jQuery não definido.Mova seu arquivo jQuery antes de todos os outros arquivos de script.
Depois de mover o jQuery para cima, seu site parece bom.Anexei um instantâneo conforme você solicitou.
Outras dicas
Na sua página de exemplo, você está importando ks2.js antes de jquery.js.
Este deve ser o primeiro item após o seu <head>
marcação:
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js" type="text/javascript"></script>