Galerie plein écran JQuery

Question

J'utilise le plugin supergéisé http://buildinternet.com/project/supersized/ pour obtenir une galerie plein écran.

Cela fonctionne très bien, mais je dois le cacher et l'afficher uniquement à partir d'un bouton fancybox et d'un bouton esc. J'utilise fancybox 2 et je veux implémenter le plein écran aussi, donc j'ai utilisé super. La question est la suivante: comment puis-je cacher les super-volumes sans compromettre son comportement? La réponse n'est pas simple comme vous le pensez, car si vous essayez de définir 'display: none' sur div # supersized, et d'autres divs relatifs, lorsque vous l'affichez, l'ajustement automatique des images ne fonctionne pas Si vous définissez 'visibility: hidden', cela semble fonctionner, mais quand je veux voir la première image pour la première fois, la boîte qui devrait afficher l'image est complètement blanche.

Vous pouvez voir mon site de test par exemple: http://provaschiavello.altervista.org/Projects/STARFISH%20SQUARE%20|%20PIAZZA%20VITTORIO

Toutes les suggestions?

Answer 1

Voici la solution (ou la solution de contournement):

Définissez cette variable globale: first = true;

Crée ces deux fonctions utilitaires:

function fullScreen(n) { 
    // Init supersized only at first time 
    if (first) { 
     jQuery(function($){ 
      $.supersized({ 
       // All the supersized 'options': 'value' 
      }); 
     }); 
     first = false; 
    } 
    // Repeat this for each element of the page 
    // which needs to be hided while supersized is running 
    $('#myElem').fadeOut(); 

    // Show it 
    $('#supersized-container').fadeIn(); 
    $('#supersized').fadeIn(); 
    api.goTo(n+1); 
} 

function closeFull() { 
    $('#supersized-container').fadeOut(); 
    $('#supersized').fadeOut(); 

    // Same as above 
    $('#myElem').fadeIn(); 
} 

Et puis les utiliser pour basculer entre les supersized et votre page normale. NB: L'argument de fullScreen (n) est l'indice transmis à la galerie agrandie.

Profitez-en. :)