Problème bloc de connexion et javascript

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Problème bloc de connexion et javascript

Message par Melow Mar 9 Fév 2016 - 16:36

Détails techniques

Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://test-aendryl.forumactif.org/

Description du problème

Bonjour à vous tous !

Alors voilà, je suis en plein travail d'un nouveau design pour mon forum et j'ai, entre autre, utilisé la solution de Ange_tuteur sur ce > Topic <.
Pas de souci, ça fonctionne du feu de Dieu.

Malheureusement, je viens de modifier ma barre de navigation pour qu'elle vienne se coller au bas de mon forum. Pareil, no problemo pour ça. Seul et unique souci... c'est que du coup, mon bloc de connexion n'apparaît plus.

Alors, je suis allée fouiner dans le javascript et je suppose que le souci se trouve dans un bottom/top qui devrait être modifié mais... je suis bien trop novice dans le javascript pour oser tripoter ce long code un peu chinois.

Et tant que j'y suis, est-il possible de modifier la forme et les couleurs de ce bloc de connexion ? Je trouve l'idée d'un bloc vraiment géniale. Pourriez-vous m'aider à le remettre à sa place mais également à le personnaliser un petit peu ? Quelques explications me suffiront, je pense réussir à me dépatouiller car j'imagine que ça fonctionne un peu comme le CSS pour la personnalisation...

En vous remerciant d'avance ♥
Melow


Dernière édition par Melow le Mar 16 Fév 2016 - 18:58, édité 1 fois
Melow

Melow
**

Féminin
Messages : 62
Inscrit(e) le : 01/09/2010

http://aendryl.forumactif.org/
Melow a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème bloc de connexion et javascript

Message par Melow Mer 10 Fév 2016 - 17:25

UP siouplé Very Happy
Melow

Melow
**

Féminin
Messages : 62
Inscrit(e) le : 01/09/2010

http://aendryl.forumactif.org/
Melow a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème bloc de connexion et javascript

Message par Melow Lun 15 Fév 2016 - 11:21

UP SVP ! Smile
Melow

Melow
**

Féminin
Messages : 62
Inscrit(e) le : 01/09/2010

http://aendryl.forumactif.org/
Melow a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème bloc de connexion et javascript

Message par Melow Mar 16 Fév 2016 - 15:41

Troisième UP... !
Melow

Melow
**

Féminin
Messages : 62
Inscrit(e) le : 01/09/2010

http://aendryl.forumactif.org/
Melow a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème bloc de connexion et javascript

Message par Melow Mar 16 Fév 2016 - 18:42

Rebonjour,

Je reviens avec des nouvelles... Après trifouillage de mon code javascript, j'ai trouvé comment le modifier au niveau de l'apparence. J'me débrouillerai donc pour ça.

Je suis néanmoins toujours coincée par cette histoire de bloc de connexion. J'imagine que ça doit se jouer sur le offset ou un truc dans ce genre là... mais j'n'y comprends tellement rien...

Code:
(function() {
  var lang = {
    title : 'Veuillez entrer votre nom d\'utilisateur et votre mot de passe pour vous connecter.',
    username : 'Nom d\'utilisateur : ',
    password : 'Mot de passe : ',
    automatic : 'Connexion automatique : ',
    login : 'Bienvenue sur les Terres d\'Aëndryl',
    register : 'S\'enregistrer',
    forgot : 'Récupérer mon mot de passe',
 
    redirect : window.location.href // page the user is redirected to upon login
  };
 
  // quick login theme
  document.write('<style type="text/css">#fa_quick_login{color:#333;font-size:13px;font-family:Arial,Verdana,Sans-serif;background:#FFF;border:1px solid #CCC;border-radius:3px;box-shadow:0 6px 12px rgba(0,0,0,.175);margin-top:20px;position:fixed;z-index:40000;width:400px}#fa_quick_login:before{content:url("http://nsa38.casimages.com/img/2016/02/16/16021604230465165.png");position:absolute;right:15px;bottom:-10px}#fa_right a.rightHeaderLink[href$="/login"]{padding:0 6px}#fa_right a.rightHeaderLink.fa_login_actif{color:#333!important;background-color:#FFF!important}#fa_quick_login a.gensmall{color:#069}#fa_quick_login a.gensmall:hover{color:#333}#fa_quick_login input{color:#333;background:#FFF;border:1px solid #CCC;border-radius:3px;padding:3px;margin:2px;cursor:text}#fa_quick_login input:hover{border-color:#39C}#fa_quick_login input:focus{border-color:#333;outline:0}#fa_quick_login input.mainoption{color:#39C;border:1px solid #39C;background:0 0;font-weight:700;display:block;width:100%;padding:6px 3px;margin-top:10px;cursor:pointer;transition:900ms}#fa_quick_login input.mainoption:hover{color:#FFF;background:#39C}#fa_quick_login input.mainoption:focus{color:#FFF;background:#8b5;border-color:#8B5}#fa_quick_login table.forumline,#fa_quick_login td,#fa_quick_login th,#fa_quick_login tr{border:none!important;background:0 0!important;border-radius:0!important;white-space:normal}#fa_quick_login .thHead{color:#333;font-size:13px;font-family:"Trebuchet MS",Arial,Verdana,Sans-serif}#fa_quick_login td{font-size:13px;padding:3px}</style>');
 
  $(function() {
    if (!_userdata.session_logged_in) {
      var container = document.createElement('DIV');
      container.id = 'fa_quick_login';
      container.style.display = 'none';
      container.innerHTML = '<form action="/login" method="post" name="form_login"><table class="forumline" width="100%" border="0" cellspacing="0" cellpadding="4" align="center"><tbody><tr><th colspan="3" class="thHead" nowrap="nowrap" height="25">' + lang.title + '</th></tr><tr><td width="100%" align="center" class="row1"><table cellpadding="0" cellspacing="0" border="0"><tbody><tr><td class="row1 align_gauche"><table width="100%" border="0" cellspacing="1" cellpadding="0"><tbody><tr><td class="align_droite" width="50%"><span class="gen">' + lang.username + '</span></td><td width="50%"><input type="text" name="username" value="" size="25" maxlength="40"></td></tr><tr><td class="align_droite"><span class="gen">' + lang.password + '</span></td><td><input type="password" name="password" size="25" maxlength="32"></td></tr><tr align="center"><td colspan="2"><span class="gen">' + lang.automatic + '<input type="checkbox" name="autologin" checked="checked"></span></td></tr><tr align="center"><td colspan="2"><input type="hidden" name="redirect" value="' + lang.redirect + '"><input type="hidden" name="query" value=""><input type="hidden" name="tt" value="1"><input class="mainoption" type="submit" name="login" value="' + lang.login + '"></td></tr><tr align="center"><td colspan="2"><br><span class="gensmall"><a class="gensmall" href="/register">' + lang.register + '</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a class="gensmall" href="/profile?mode=sendpassword">' + lang.forgot + '</a></span></td></tr></tbody></table></td></tr></tbody></table></td></tr></tbody></table></form>';
      document.body.appendChild(container);
 
      $(function() {
        var login = $('a.mainmenu[href="/login"]')[0];
 
        if (login) {
          login.onclick = function() {
            var login = document.getElementById('fa_quick_login'), offset = this.getBoundingClientRect(), loffset;
 
            if (login) {
              if (/none/.test(login.style.display)) {
                login.style.display = '';
            
                loffset = login.getBoundingClientRect();
                login.style.top= offset.top+ 30 + 'px';
                login.style.left = offset.left - ((loffset.right - loffset.left) - (offset.right - offset.left)) + 'px';
            
                login.getElementsByTagName('FORM')[0].username.focus();
                this.className += ' fa_login_actif';
              } else {
                login.style.display = 'none';
                this.className = this.className.replace(/fa_login_actif/, '');
              }
            }
        
            return false;
          };
        }
      });
    }
  });
}());

Merci d'avance. J'a joué un peu avec les offset mais je n'ose pas être trop téméraire.


EDIT : Sujet résolu.
Melow

Melow
**

Féminin
Messages : 62
Inscrit(e) le : 01/09/2010

http://aendryl.forumactif.org/
Melow a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum