Fancybox troubles

Je suis en train de mettre en œuvre une fancybox. http://fancybox.net/howto

Je veux appeler cette fonction sur un élément. Plein de fichier JS. http://fancybox.net/js/fancybox/jquery.fancybox-1.2.1.js

$.fn.fancybox = function(settings) {

J'ai fait ceci:

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

Cependant, je reçois ce message d'erreur (par le biais de firebug):

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

Qu'est-ce que cela signifie? Je suis fondamentalement d'avoir de l'instanciation de problèmes.

S'il vous plaît aider.

MODIFIER

Le fichier 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>
  • Ce n'est pas ce qui est faux (sauf si vous avez invalide balisage, qui il n'y a pas de raison de penser que vous faites), mais il n'y a aucun point dans la a partie de votre a#inline sélecteur. Le # opérateur dans les sélecteurs CSS, indique un ID et Id sont uniques au monde. Pas nécessaire de préciser que c'est l'élément avec l'ID 'inline' c'est également un point d'ancrage.
  • T. J - je ne suis pas un expert en JS/HTML, mais le gars qui a créé ce plugin utilisé dans l'exemple, j'ai donc copié.
InformationsquelleAutor Abs | 2009-09-20
  1. 3
    $('#inline').fancybox();

    .fn désigne le prototype.

    • J'obtiens ceci: $("#inline").fancybox est pas une fonction [Pause sur cette erreur] $("#inline").fancybox();
    • Vérifier l'onglet réseau de firebug et voir ce qui est absent.
    • J'ai la console et le script d'onglets ouverts. Si c'est ce que tu veux dire?
    • Faire de votre page web aussi minimaliste que possible, essayez d'imiter ce que j'ai. Poster une url publique si vous pouviez.
    • Je monte sur mon localhost et j'ai un très minimaliste de la page. J'ai collé HTML concernés.
    • Mise à jour de votre <script> src à l'URI absolu: fancybox.net/js/fancybox/jquery.fancybox-1.2.1.js Si cela fonctionne alors c'est un problème avec la façon dont vous l'avez enregistré. Comment est votre site d'installation en local? Virtualhost? Peut-être vous avez besoin de faire src="/fancy/foo.js"
    • Aussi s'il vous plaît vérifiez que vous avez réellement les fichiers à l'intérieur de la 'fantaisie' annuaire. Quelque part le long des lignes que vous venez de faire une simple erreur, être approfondie.
    • J'ai vérifié cela, j'ai même téléchargé les fichiers. Est-ce grave si je suis à l'aide de fichiers relatifs?
    • Avez-vous essayez absolument de les relier?
    • Oui, j'ai même copié l'URL que vous utilisez et j'obtiens toujours la même merde erreurs. Sérieusement ce que pourrait en être la cause. Je suis heureux d'écouter à distance les idées! Si j'avais une idée de ce qui se passait, je voudrais au moins avoir une chance.
    • Avant que quiconque, dit-il, j'ai été de compensation caches après chaque test.
    • OK PROBLÈME RÉSOLU - je devrais regardé dans mon fichier d'en-tête, j'ai été exigeant JQuery il y a trop!! Désolé tout le monde. 🙁
    • C'est ce que je voulais dire en le rendant plus minimaliste, seulement le strict nécessaire.. ce qui serait de 3 éléments de script et html.
    • Désolé, je sais. Merci 🙂

    InformationsquelleAutor meder omuraliev
  2. 2

    Di vous trouver l'erreur? Eu le même problème. La Solution est que j'ai inclus deux fois un fichier javascript, mais j'inclus la jquery.js fichier deux fois.

    InformationsquelleAutor jNik
  3. 2

    J'ai été aussi à avoir ce problème et a trouvé que j'avais compris jquery.js à deux reprises. Le retrait de la seconde référence de correction de l'erreur que j'ai été l'obtention de la fancybox appel

    InformationsquelleAutor Ben Trevino
  4. 1

    $("a#inline").fn.fancybox(); doit être $("a#inline").fancybox();

    • J'ai essayé aussi et j'ai une erreur qui dit que fancybox est pas une fonction?! J'ai utilisé de nombreux plugins JQuery avant et ils étaient simples. Je n'ai aucune idée de ce qui se passe ici. Probablement quelque chose de simple et stupide.
    • Vérifiez le chemin d'accès à votre script fancybox et assurez-vous qu'il est compris avant de faire un appel à la fancybox fonction.
    • Yep, j'ai vérifié cette trop. Je ne sais pas ce que je peux faire pour déboguer ce ou de les résoudre.
    • Je suis sûr que vos chemins sont mauvais. Faire un affichage de la source et de copier/coller les chemins dans votre navigateur. Assurez-vous également que jQuery est inclus avant le script fancybox.
    • J'ai fait aussi que le script est apparu amende. Aussi, je suis en train de regarder les scripts via firebug. Cela devient étrange!
    InformationsquelleAutor
  5. 1

    Vous avez à faire assurez-vous de charger fancybox APRÈS jquery, sinon vous obtiendrez un "fancybox est pas une fonction" d'erreur et que votre javascript va briser ainsi:

    CASSÉ:

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

    BON:

    <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>
    InformationsquelleAutor Chris Adams
  6. 1

    Je l'ai copié d'un fragment de code HTML et JS dans jsfiddle.

    • Quand j'ai rétrogradé à jquery 1.3.2, [voir encadré à gauche sous le cadre en JSFiddle exemple] votre code ne fonctionne pas.
    • Quand je l'ai mise à niveau vers 1.4.4 ou les versions ultérieures, il a travaillé.

    Solution

    • Essayez de mettre à niveau votre jquery pour 1.4.4 ou versions ultérieures et tester à nouveau.
    • Aussi, j'ai remarqué que vous êtes y compris externe header.php, alors assurez-vous il n'y a pas d'autres scripts jquery être inclus dans ce fichier ou votre js codes de casser.

    Voir ce lien pour l'exemple de votre propre code à l'aide de la version jquery 1.4.4: http://jsfiddle.net/Ca6N5/

    • Conformément à l'OPs " commentaire sur sa a accepté de répondre, son problème était qu'il devait y compris jQuery deux fois. Et il est inutile de répondre à une question qui a été résolu depuis près de trois ans.
    • Désolé, j'ai réalisé la date après avoir la solution posté. Btw, certaines solutions peuvent être une "mise à niveau" pour les réponses précédentes, puisque la plupart des solutions ont déjà disparu dans la nature. Mais merci pour le tuyau concernant la date.
    InformationsquelleAutor Dexter Huinda
  7. 0

    Je crois que vous avez oublié d'inclure jquery lui-même. Fancybox dépend de jquery.

    <script type="text/javascript" src="path-to-file/jquery.js"></script>
    • J'ai compris et je peux y accéder lfi mon navigateur.
    InformationsquelleAutor richard
  8. 0

    Comme dit Ben, assurez-vous que jQuery n'est pas inclus deux fois par accident.

    InformationsquelleAutor Andy
  9. 0
    $("a#inline").fn.fancybox();
    1. l'utilisation plus récente de jquery & fancybox

    2. $("a#inline").fancybox(); -> c'est correct

    3. Voici des exemples: http://softm.org.ua/google-map-jquery-plugins/
    InformationsquelleAutor publikz.com