Bonjour à tous
Je poste ici car je suis à la recherche d'un tutoriel javascript afin de réaliser un contenu ouvrant lorsque l'on clique sur un lien.
Du même style que l'inscription/connexion de deezer:
http://www.deezer.com/fr/
Je suis une quiche en javascript ^^
Merci d'avance :)
tu peut regarder le tuto sur grafikart : http://www.grafikart.fr/tutoriels/pop-in-jquery-72 mais au lieu de mettre des images, tu place ton code (formulaire, textes...)
Youhou merci beaucoup!
Alors voilà, j'ai réalisé le script, ça m'as pris assez de temps étant donné mon niveau mais c'est vraiment au lance pierre, et là j'ai un gros problème:
$(document).ready(function(){
$('body').append('<div id="voile_black"></div><div id="content_connect"><div id="boutonclose"></div><h2><img src="./Images/Texte/inscription.png" alt="" /></h2><div id="cadre_texte">Vous disposez déjà d\'un compte sur Tuto-Seo? Connectez vous ici.</div><form action="" id="form"><label for="pseudo">Pseudo</label><input type="text" /><br /><label for="pseudo">Adresse mail</label><input type="text" /><br /><label for="pseudo">Mot de passe</label><input type="password" /><br /><label for="pseudo">Confirmation</label><input type="password" /><br /><input type="submit" value="s\'inscrire" class="submit"/></form></div>');
$('#content_connect').css('opacity',0).fadeTo(250,1);
$('#voile_black').css('opacity',0).fadeTo(2000,0.7);
$('#boutonclose').click(function(){
$('#voile_black').fadeOut(500,function(){
$('#voile_black').remove();
})
$('#content_connect').fadeOut(500,function(){
$('#content_connect').remove();
});
});
});
Donc ce script MARCHE :), en gros il affiche un popin au chargement de la page, et lorsque l'on clique sur la croix il disparait.
Seulement j'aimerais qu'il s'affiche non pas au chargement de la page, mais lors du clic du lien avec la classe popin. Je bug depuis une heure U_U j'essaye des trucs mais ça marche pas... Aidez moi :'( svp
il manque une fonction que te permet d'ouvrir ton popup lors d'un clic, ici avec ton code quand tu ouvre ta page, tu exécute directement $('body').append(...) regarde bien le tuto, il y a une fonction open je crois