2014-10-07 14 views
5

Quindi sto riscontrando questo problema con FancyBox in cui quando si scorre il corpo della pagina (pagina principale), la casella sposta la posizione a sinistra e in alto a caso.Fancybox "danze" intorno a

attaccato una GIF per dimostrare il problema:

img

sto usando Fancybox v2 per quanto ne so.

Il sito Web è here (nella scheda "allenamento quotidiano").

Questo è il codice che uso per chiamare il fancybox:

$(".signup").fancybox({ 
    maxWidth: 800, 
    maxHeight: 600, 
    fitToView: false, 
    width: '70%', 
    height: '70%', 
    autoSize: false, 
    closeClick: false, 
    openEffect: 'none', 
    closeEffect: 'none' 
}); 

Ho controllato le loro API, ma non riuscivo a capire che cosa rende la posizione di "danza".

===============

EDIT

così sono riuscito a isolare il problema. quando aggiungo "openEffect: 'none'" la cosa si scatena. senza di esso la scatola rimane statica e si attacca al lato in alto a sinistra dello schermo

qualche altra idea?

+0

sembra che si sta utilizzando 'finestra sulla funzionalità scroll'? –

+0

@VitorinoFernandes non nel mio script privato, ma ho: bootstrap.js, hammer.js, jQ (più i file per: easing, mousewheel, animate e superslides) e owlCarousel ... – Aviad

risposta

0

se non è necessario scorrere il sito Web, impostare closeClick su true o rimuoverlo, la finestra verrà visualizzata come modale e non sarà possibile scorrere la pagina principale mentre è attiva la modal.

var busy = false; 
// the html class is "o" 
$(".o").fancybox({ 
    //modal: true 
    beforeClose: function() { 
     if (busy) { 
      return false; 
     } 
    } 
}); 

Esempio qui: http://jsfiddle.net/MLjAT/

+0

..e anche considerare di attenuare lo sfondo . –

+0

non capisco "oscuramento", cos'è questo? – Supamiu

+0

indica overlay – himanshu

0

Per quanto posso vedere, la casella viene spostato a causa delle proprietà transition e -webkit-transition CSS che vengono aggiunti da un codice JavaScript. Dovresti controllare da dove proviene. Prova ad abbattere ogni passo. C'è anche la possibilità che il problema sia dovuto a un qualche tipo di conflitto nel codice, quindi controlla anche quello.

+0

Thx warwick - Verrò controllato per quello – Aviad

0

Prova aggiungere questo al vostro DOCTYPE

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 

mi ha aiutato in passato

+0

Inverno - non lo fa lavorare o .. – Aviad