L'ajout de boutons de Partage Sociaux pour Fancybox qui utilise le bouton helper

Je suis en train d'essayer d'intégrer les boutons de partage sur mon fancybox image de popups. Il y a un JsFiddle qui Fancybox a créé pour démontrer comment ce serait fait...mais je suis en utilisant le "helper" > jquery.fancybox-buttons.js (voir ici). Comment puis-je combiner ces deux solutions personnalisées de sorte que lorsque la fancybox image apparait, elle a les boutons de partage social-dessous (tout comme dans le JSFiddle & a le bouton aides?

Voici un exemple de ma page HTML pour la Galerie Fancybox:

<div id="painting" class="content-pages">

<p>
    <a class="fancybox-buttons" href="painting/2011_b.jpg" data-fancybox-group="paintings" title="Sed vel sapien vel sem uno"><img src="painting/2011_s.jpg" alt="" /></a>

    <a class="fancybox-buttons" href="painting/beginnings-3_b.jpg" data-fancybox-group="paintings" title="Tegan Whitesel - Beginnings III"><img src="painting/beginnings-3_s.jpg" alt="" /></a>

    <a class="fancybox-buttons" href="painting/t-beginnings-i_b.jpg" data-fancybox-group="paintings" title="Tegan Whitesel - Beginnings I "><img src="painting/t-beginnings-i_s.jpg" alt="" /></a>

    <a class="fancybox-buttons" href="painting/t-beginnings-ii_b.jpg" data-fancybox-group="paintings" title="Tegan Whitesel - Beginnings II"><img src="painting/t-beginnings-ii_s.jpg" alt="" /></a>
</p>
</div>
InformationsquelleAutor Forb3s | 2013-02-05
  1. 2

    Première, vous devez charger le js et le css du bouton, les fichiers d'aide (situé sur les auxiliaires sous-répertoire de téléchargement.)

    Deuxième, ajouter les boutons helper option pour le script personnalisé. Vous souhaiterez peut-être désactiver par défaut close et arrows boutons si vous utilisez les touches à l'aide seulement.

    Donc le code que vous avez à ajouter doivent être : 

    //other options
helpers: {
    title: {
        type: 'inside'
    }, //<-- add a comma to separate the following option
    buttons: {} //<-- add this for buttons
},
closeBtn: false, //disable default close
arrows: false    //disable default arrows

    Voir la même modifié JSFIDDLE.

    • Tout d'abord, je vous remercie beaucoup pour votre aide. Je suis le chargement de la JS & CSS pour le bouton, les fichiers d'aide...et je suis y compris des JS & CSS fichiers pour les boutons sociaux (très similaire à votre JSFiddle exemple), mais pour une raison quelconque stil, pas de chance. Pourrait-il avoir à faire avec les noms de classe que j'utilise? Je pense qu'ils sont un peu différent de ce que le défaut fancybox fichiers dicter. Ma classe pour chaque image est fancybox-button & je suis aussi à l'aide de data-fancybox-group="paintings" pour séparer la galerie de type...voici un lien vers la page que je suis en train de travailler sur: teganwhitesel.com/#painting -
    • Je vois les boutons, mais je ne vois pas les médias sociaux de code à l'intérieur de la title comme dans le jsfiddle
    • Entendez-vous la JS & CSS fichiers chargés dans le <header> tag? Le fichier avec le code de la JS fiddle est intitulé fancybox/fancybox-social-buttons.js
    • Eh bien, le fancybox-social-buttons.js fichier a la social media code en effet, mais que le code doit être à l'intérieur de la .ready() méthode. Ensuite, vous avez le fichier fancybox-jquery-plugin.js avec ce code $('.fancybox').fancybox(); qui remplace la précédente fancybox paramètres. Ne pas trop compliquer les choses et de définir uniquement les scripts dont vous avez besoin.
    • ok... #1. alors, comment dois-je placer les médias sociaux code (qui est dans le fancybox-social-buttons.js fichier) à l'intérieur de la .ready() méthode? #2 j'ai également supprimé toute trace de l'fancybox-jquery-plugin.js depuis, il semblait que c'était plus-de compliquer les choses? Etait-ce la bonne chose à faire?
    InformationsquelleAutor JFK