Apertura Popup Javascript

Tech Zone
1
Ciao giovani, ho un problemino su un sito che "gestisco" (parolone).
il sito è: http://www.codicesegreto.net/

in pratica, nel modulo a sx "Ci trovi su" cliccando sull'icona di whatsapp vorrei che si aprisse un popup invece che una nuova finestra.

Il codice che ho messo nell'index.php è:






ma non funge

Come posso risolvere? Purtroppo pare che non ci sia modo di intervenire direttamente nel modulo...
2
domanda scema, perchè aprire una nuova finestra con un immagine?
per es potresti mettere un modal box con la stessa immagine.. più pulito no?!
3
stai parlando con un niubbo che lo fa per volontariato, manco so cosa è un modal box
ora mi informo e vedo.
4
se non fosse per il jquery, anni 90' ()



vai di modal, nel caso fancybox, e similari, ma credo te la cavi con poco senza importare mille librerie.
5
Ho visto un po', ma non credo di essere in grado
6
tipo

http://jsfiddle.net/AUyTH/222/

7
Ogni volta che pensi a un pop-up chiediti "per visualizzare cosa esattamente?"

Evita i pop-up come i transessuali in tangenziale.
È un pattern obsoleto e contro ogni base di UX che si rispetti, senza aggiungere che 50% della tua utenza (se non più) avrà un adblock/noscript/ublock attivato che segherá tutti i tuoi pop-up a prescindere.

Devi aprire una finestra esterna al tuo dominio? Allora un target _blank e lasciare che l'user navighi da solo sulla nuova finestra.
È della roba che sta sul tuo sito però che non ha senso di metterla in una pagina a parte? Esistono i modal, che oltre ad essere a prova di scemo non disturbano l'user con finestre aggiuntive.

Crea un div con position fixed e centrato nel viewport e display none, visto che usi jquery puoi usare semplicemente .fadeIn() o .show() sull'onclick. Inoltre puoi bindare un click sul modal per farlo chiudere una volta aperto.

Vedi jsfiddle di goemon se vuoi implementare un modal di bootstrap, oppure puoi implementarne uno tuo da zero come descritto sopra per non appesantire le pagine con una intera libreria se devi usarne il 10% delle funzionalità cui offre.
8
Proverò a destreggiarmi con quello che mi avete indicato Grazie!
9
era sbagliato il selettore dell'elemento, quello corretto è:

$(".dmt-social-links li.whatsapp a")


Ma senza tanti sbatti se gli fai aprire direttamente whatsapp al click?
https://www.themarketingtechnologist.co/open-a-whatsapp-conversation-directly-from-your-ad/
10


Ehm... non funge



questo in una futura versione mobile del sito fatta meglio
11



$(".dmt-social-links li.whatsapp a") .on( 'click', function() {
var url2open = $(this).attr("href");
var stile = "top=200, left=500, width=400, height=500, status=no, menubar=no, toolbar=no scrollbars=no";
window.open( url2open, 'name', stile);
return false;
} );


Non ci va lo spazio fra ...a).on(...
12


eh, avevo provato anche così... ma pure senza spazio non funge uguale
13
se utilizzi pure altri frameworks oltre jquery, il document ready devi scriverlo cosi..


jQuery( document ).ready(function( $ ) {
14
posta un jsfiddle della pagina Buzz
15
Prova questo:


(function($){
$(document).on('click', '.dmt-social-links li.whatsapp a', function(event) {
event.preventDefault();

// Codice

return false;
});

})(jQuery)


Dovrebbe funzionare anche senza il document ready
Comunque ti suggerirei di aggiungere un ID all'elemento da cliccare, tipo "js-whatsapp-modal" e targettarlo con $(document).on('click', '#js-whatsapp-modal', function...