Pregunta

estoy tratando de implementar Jquery zoom en mi Joomla impulsado sitio web en el catálogo de imágenes.No puedo conseguir que esto salga bien, así que ¿alguien puede ayudarme a resolver este problema?

He añadido estas secuencias de comandos en la cabeza:

<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>

aquí está el error que te da:

Uncaught TypeError: Object #<HTMLDocument> has no method 'ready'
(anonymous function)

aquí está el enlace a un ejemplo de mi sitio

aquí está mi 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>
¿Fue útil?

Solución

Vi su página y encontré que está cargando el archivo jquery después de los archivos dependientes.Hay muchos errores en la consola.El primero es jQuery no definido.Mueva su archivo jquery antes de todos los demás archivos de script.

Después de mover jquery en la parte superior, su sitio se ve bien.Adjunto una instantánea como lo solicitó. ingrese la descripción de la imagen aquí

Otros consejos

En el ejemplo de la página, que está importando ks2.js antes de jquery.js.

Este debe ser el primer elemento después de su <head> etiqueta:

<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js" type="text/javascript"></script>
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top