Personnaliser le LOGIN_POPUP

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

Résolu Personnaliser le LOGIN_POPUP

Message par amazonia-piranha le Mar 20 Sep 2011 - 16:55

bonjour,
je souhaiterais personnaliser mon LOGIN_POPUP, afin de ne laisser que les boutons et une imagede fond
je sais qu'il faut créer une class pour pouvoir ensuite intervenir a l'aide du CSS, mais quel genre de balise doit-je mettre ?

Actuellement sa donne cela :
Spoiler:



Ce que je souhaite réalisé :
Spoiler:




si je me trompe pas j'ai repéré mon login_popup que voici :
Spoiler:
Code:

   <!-- BEGIN switch_login_popup -->
      var logInPopUpLeft, logInPopUpTop, logInPopUpWidth = {LOGIN_POPUP_WIDTH}, logInPopUpHeight = {LOGIN_POPUP_HEIGHT}, logInBackgroundResize = true, logInBackgroundClass = false;
   <!-- END switch_login_popup -->

   <!-- BEGIN switch_login_popup -->
   $(document).ready( function() {
      $(window).resize(function() {
         var windowWidth = document.documentElement.clientWidth;
          var popupWidth = $("#login_popup").width();
          var mypopup = $("#login_popup");

          $("#login_popup").css({
              "left": windowWidth/2 - popupWidth/2
           });
      });
   });
   <!-- END switch_login_popup -->

merci d'avance pour votre aide !


Dernière édition par amazonia-piranha le Jeu 22 Sep 2011 - 21:34, édité 1 fois

amazonia-piranha
***

Masculin
Messages : 195
Inscrit(e) le : 03/05/2011

http://www.amazonia-piranha.com/forum
amazonia-piranha a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser le LOGIN_POPUP

Message par tupac le Mer 21 Sep 2011 - 10:43

Bonjour

Si j'ai bien compris vous voulez que votre image déborde du cadre.
Essayer avec ce code.
Code:
#login_popup table.forumline td.row1 { background: url( votre image ici ) no-repeat;
position: absolute;
margin-top: -70px;
}
Jouer avec le ( margin-top: -70px; ) pour descendre ou monter votre image.

tupac
+ Hyperactif +

Masculin
Messages : 2331
Inscrit(e) le : 13/10/2010

tupac a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser le LOGIN_POPUP

Message par amazonia-piranha le Mer 21 Sep 2011 - 12:47

et en faite cher tupac, je veut rendre complètement invisible l'enssenble du popup pour ne laissé que mon image et les boutons de conexion, l'image que j'ai afficher en résultat finale est une image png, c'est a dire que le poisson le cadre le texte, tout est coller sur un png, ce n'est donc pas un cadre avec un css derriere avec du texte, c'est un tout en faite, une image, d'ou mon but de rendre invisible le popup de base, je veut juste cette image est les boutons de visible.


amazonia-piranha
***

Masculin
Messages : 195
Inscrit(e) le : 03/05/2011

http://www.amazonia-piranha.com/forum
amazonia-piranha a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser le LOGIN_POPUP

Message par tupac le Jeu 22 Sep 2011 - 9:17

Bonjour

J'ai saisi.
Donc dans votre template overall_header repérer la partie suivante elle correspond a la boite popup de connexion.
Code:
   <!-- BEGIN switch_login_popup -->
   <div id="login_popup">
      <table class="forumline" width="{LOGIN_POPUP_WIDTH}" height="{LOGIN_POPUP_HEIGHT}" border="0" cellspacing="1" cellpadding="0">
         <tr height="25">
            <td class="catLeft">
               <span class="genmed module-title">{SITENAME}</span>
            </td>
         </tr>
         <tr height="{LOGIN_POPUP_MSG_HEIGHT}">
            <td class="row1" align="left" valign="top">
               <div id="login_popup_buttons">
                  <form action="{S_LOGIN_ACTION}" method="get">
                     <input type="submit" class="mainoption" value="{L_LOGIN}" />
                     <input type="button" class="mainoption" value="{L_REGISTER}" onclick="parent.location='{U_REGISTER}';" />
                     <input id="login_popup_close" type="button" class="button" value="{L_DONT_DISPLAY_AGAIN}" />
                  </form>
               </div>
               <span class="genmed">{LOGIN_POPUP_MSG}</span>
            </td>
         </tr>
      </table>
   </div>
   <!-- END switch_login_popup -->
Il vous faut changer les class ( forumline ) et ( row1 ) par une autre class par exemple ( forumline_1 ) et ( row1_1 )

Ensuite repérer la partie suivante et supprimez-la elle correspond a l'en-tête de la popup.
Code:
<tr height="25">
   <td class="catLeft">
   <span class="genmed module-title">{SITENAME}</span>   
   </td>
</tr>
Une chose a savoir si vous souhaitez un jour placer un code (si-dessous) en rapport avec votre popup dans votre feuille de style il vous faudra aussi changer les class (forumline) et (row1) par celle-ci (forumline_1) et (row1_1)
Code:
#login_popup table.forumline td.row1 { background: url( votre image ici ) no-repeat;
    background: url(http://hariboow.free.fr/upload/images/201102wtw.png)
        }

tupac
+ Hyperactif +

Masculin
Messages : 2331
Inscrit(e) le : 13/10/2010

tupac a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Personnaliser le LOGIN_POPUP

Message par amazonia-piranha le Jeu 22 Sep 2011 - 21:34

Merci beaucoup TUPAC.
grace a ton explication j'ai pu réalisé mes modifications.

amazonia-piranha
***

Masculin
Messages : 195
Inscrit(e) le : 03/05/2011

http://www.amazonia-piranha.com/forum
amazonia-piranha 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