Pregunta

Estoy tratando de implementar un FancyBox. http://fancybox.net/howto

Quiero llamar a esta función en un elemento. JS archivo completo. http://fancybox.net/js/fancybox/jquery.fancybox- 1.2.1.js

$.fn.fancybox = function(settings) {

He hecho esto:

$(document).ready(function() { 
    $("a#inline").fn.fancybox();  
});

Sin embargo, me siguen dando este error (a través de Firebug):

$("a#inline").fn is undefined
[Break on this error] $("a#inline").fn.fancybox();

¿Qué significa esto? básicamente estoy teniendo una instancia de problemas.

Por favor, ayuda.

Editar

El archivo HTML:

<!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>Technologies</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="fancy/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="fancy/jquery.fancybox-1.2.1.js"></script> 
<link rel="stylesheet" href="fancy/fancybox.css" type="text/css" media="screen" />
<script type="text/javascript">
$(document).ready(function() { 
    $("a#inline").fancybox();  
}); 
</script>
</head>
<body>
<?php
include_once ("header.php");
?>
<div id="channel_calc">
How many Channels do I need?
<span id="yellow"><a id="inline" href="#ddm">Channel Calculator</a></span>
</div>
¿Fue útil?

Solución

$('#inline').fancybox();

.Fn refiere al prototipo.

Otros consejos

Di a encontrar el error? Tenía el mismo problema. Solución era que yo había incluido dos veces un archivo JavaScript, y no me incluyeron archivo dos veces los jquery.js.

También estaba teniendo este problema y encontré que había incluido jquery.js dos veces. Extracción de la segunda referencia fijado el error que estaba recibiendo de la llamada FancyBox

.

$ ( "# una línea") fn.fancybox (); debe ser $ ( "# una línea") FancyBox (.);

Hay que asegurarse de cargar FancyBox DESPUÉS jQuery, de lo contrario se obtiene un "FancyBox no es una función" error y la otra Javascript se romperá así:

ROTO:

<script type="text/javascript" src="/js/fancybox/jquery.fancybox-1.3.4.js"></script>
<script type="text/javascript" src="/js/jquery-1.6.1.js"></script>

BUENO:

<script type="text/javascript" src="/js/jquery-1.6.1.js"></script>
<script type="text/javascript" src="/js/fancybox/jquery.fancybox-1.3.4.js"></script>

He copiado un fragmento de código HTML y JS dentro jsFiddle.

  • Cuando cambié a jQuery 1.3.2 , [véase el recuadro de la izquierda bajo el marco en el jsFiddle ejemplo] su código no funcionará.
  • Cuando actualizo a 1.4.4 o versiones posteriores, funcionó.

Solución

  • Intente actualizar su jQuery a 1.4.4 o versiones posteriores y prueba de nuevo.
  • También me di cuenta de que está incluyendo un exterior header.php , así que asegúrese de que no hay otras secuencias de comandos de jQuery ser incluidos en este archivo o sus códigos JS se romperá.

Vea este enlace para el ejemplo de trabajo de su propio código usando la versión jQuery 1.4.4 http://jsfiddle.net/Ca6N5/

Creo que se le olvidó también incluyen jQuery sí. FancyBox depende de jQuery.

<script type="text/javascript" src="path-to-file/jquery.js"></script>

Como dijo Ben, asegúrese de que jQuery no está siendo incluido dos veces por accidente.

$("a#inline").fn.fancybox();  
  1. utilizar más reciente de jQuery y FancyBox
  2. $ ( "# una línea") FancyBox (.); -> esto es correcto

  3. Aquí es ejemplos: http://softm.org.ua/google-map -jquery-plugins /
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top