2013-05-17 28 views
7

Ho recentemente implementato il 'Magnific Popup' e il popup si presenta bene, tuttavia quando faccio clic su una casella di input l'intero popup scompare nuovamente alla pagina padre. Sugli esempi mostrati sul sito Web del plugin, l'intera finestra di dialogo è selezionabile fino a quando si fa clic all'esterno di quella casella.Popup magnifico - Popup scomparendo al momento del clic

Sto sperando che il suo solo qualcosa di estremamente semplice, che ho perso, ma è ancora facendo la testa.

Ho davvero apprezzato tutto l'aiuto che posso ottenere!

Grazie :)

+1

Sì, è hai perso qualcosa di estremamente semplice, per favore pubblica un po 'di codice! Nessuno può davvero rispondere alla tua domanda senza vedere ciò che hai provato. –

+0

Ciao @ KenY-N, il CMS è Websitebaker quindi è letteralmente solo un pezzo di PHP che si collega a una pagina WYSIWYG. Ho letto su https://github.com/dimsemenov/Magnific-Popup/pull/39 che è necessario "loop dei nodi" ma non so come farlo esattamente. – Frank

risposta

9

Se si sta utilizzando "Ajax" tipo di contenuto, è necessario fare in modo che hai un solo nodo radice.

http://dimsemenov.com/plugins/magnific-popup/documentation.html#ajax_type

esempio questo è corretto il contenuto del file ajax:

<div> 
    html content 
    <script src="something.js"></script> 
</div> 

errato:

<script src="something.js"></script> 
<div> 
    html content 
</div> 

errato:

<div> 
    html content 
</div> 
<div>Another content</div> 

anche assicurarsi t cappello closeOnContentClick è impostato su falsehttp://dimsemenov.com/plugins/magnific-popup/documentation.html#closeoncontentclick

Se, per qualsiasi motivo, non è possibile modificare il contenuto del file di ajax, si può analizzare il contenuto in parseAjax richiamata, come descritto here (in modo che il mfpResponse.data contiene un solo nodo radice).

+1

Grazie, è andata così! (in realtà, era un collegamento

1

Non riesco ancora a rispondere (replica troppo bassa ..) quindi aggiungendolo in questo modo: sembra che questo valga anche per il tipo: "in linea". Sicuro di avvolgere sempre il contenuto di un div ..

$.magnificPopup.open({ 
    items: { 
    src: '<div>'+ html +'</div>' 
    }, 
    type: 'inline', 
    closeOnContentClick: false 
}, 0); 
1

Ho avuto lo stesso errore. Si è rivelato un errore stupido da parte mia, ho avuto la stessa classe sul mio apriscatole e sul mio div inline.

<a href="#popup" class="dialog">Open</a> 
<div id="popup" class="dialog mfp-hide"></div> 

Naturalmente avevano bisogno di essere diverse classi in questo modo:

<a href="#popup" class="dialog">Open</a> 
<div id="popup" class="dialog-box mfp-hide"></div> 
+0

stesso qui! grazie molto! :) –

0

Aggiungere modal:true nel magnificPopup:

$('.your_class').magnificPopup({ 
    type: 'ajax', 
    modal:true 
});