Pop Up Box qui fait tout bug

2 participants

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

Résolu Pop Up Box qui fait tout bug

Message par Rnd. Mer 31 Jan 2024 - 14:42

Détails techniques


Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Google Chrome
Capture d'écran du problème :
Voir l'image:

Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : 31/01/2024
Lien du forum : (lien masqué, vous devez poster pour le voir)

Description du problème

Bonjour ou Bonsoir !
Merci d'avance à la personne qui saura me venir en aide Like a Star @ heaven
Il faudra poster pour voir le forum en question  Arrow

En ce début d'après midi, je me suis auto fait un petit arrêt cardiaque.

Dans la continuité de la prochaine mise à jour que je souhaite faire sur mon forum, j'ai créer une "seconde" page d'accueil, que j'appelle dans mon cas plutôt panneau d'affichage. Bref, sur cette dernière, j'ai voulu faire ma grande codeuse (non c'est faux, puisque j'ai tout cassé) et créer sur les images du staff un Pop Up Box Arrow On clique dessus et hop, une petite page s'ouvre et ça fait tout beau, tout joli ! Bref !

Jusqu'à quelques jours, je ne savais pas qu'il y avait un quelconque problème... SAUF QUE.
En arrivant tout à l'heure sur Google qui m'a fait une superbe mise à jour j'ai pu constater que mes comptes avaient été déconnectés. De ce fait, en arrivant sur mon forum test, surprise d'un gros BUG. Je ne peux plus voir le switcheroo, j'ai beau appuyé sur "connexion" en haut de mon forum, rien ne s'affiche, je ne peux pas scroll lorsque j'appuie sur les images des admins. La catastrophe. Je panique mais heureusement mon PC portable lui était encore connecté, alors j'ai vite changé le code pour pouvoir me reconnecter sur mon ordinateur principal.

https://www.zupimages.net/up/24/05/4flr.png <- Image du BUG
https://www.zupimages.net/up/24/05/901e.png <- Image de ce qui devrait être réellement
En toute logique, lorsque on est déconnecté d'un forum, la connexion doit être possible malgré tout : https://www.zupimages.net/up/24/05/3xla.png
Même cela ne s'affiche plus.

Donc là je suis sans mots. Je ne comprends pas, j'ai suivi des tutoriels pour parvenir à créer ce pop up box. J'ai du mal à saisir pourquoi il bug lorsqu'on est déconnecté et qu'au contraire il fonctionne lorsqu'on est connectés...

Je laisse le template overall_header ((le css est à la fin)) :
Spoiler:

Je vous remercie par avance I love you et vous souhaite une bonne et agréable journée !

EDIT :: Je me permets un petit edit, j'ai en effet regardé en ouvrant mes catégories à tous et à ce moment il n'y a plus le moindre bug. Seulement lorsque toutes les catégories sont bloquées à l'accès des invités le forum bug lorsqu'on est pas connectés. Embarassed
Rnd.

Rnd.
Nouveau membre

Autre / Ne pas divulguer
Messages : 22
Inscrit(e) le : 07/09/2022

https://busanmemory.forumactif.com/
Rnd. a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Pop Up Box qui fait tout bug

Message par Toryudo Mer 31 Jan 2024 - 20:11

Bonjour !

Alors, je vous fait la liste de choses que j'ai corrigées dans le Template :
  • ne garder que deux "preconnect" au tout début pour les chargements des polices de caractères, les autres ne sont pas utiles
  • déplacer le HTML et le script du dark mode après le </head> et après le <body> : vous ne pouvez pas mettre de <div> à l'intérieur du <head>, les navigateurs n'aiment pas ça et pourraient mal les afficher
  • déplacer tout le <style> que vous aviez mis tout en bas juste après le dark mode (même si j'aurais pu le mettre ailleurs) : une balise <style> doit se trouver à l'intérieur du <head> ou du <body>, mais pas après le </html> (et vous aviez oublié un caractère pour au niveau du </style>)
  • vous avez des <tagadmin> que vous refermez avec des </tag> : pas possible, il faut refermer avec des </tagadmin>
  • il y a un code </div></div><br> en trop dans le <td class="bodyline">, il faut le retirer

Tout peut potentiellement faire bugger toutes les pages : quand il y a des erreurs comme celles-là, un bon affichage est un peu... au petit bonheur la chance.
Et voilà le Template corrigé, je n'ai pas testé, il pourrait rester des problèmes, mais ce sera pas mal pour commencer :
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="{S_CONTENT_DIRECTION}" id="min-width" lang="{L_LANG_HTML}"
    xml:lang="{L_LANG_HTML}" {NAMESPACE_FB_LIKE} {NAMESPACE_FB} {NAMESPACE_BBCODE}>
<head>
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Great+Vibes&display=swap" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css2?family=Pridi:wght@300&display=swap" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css2?family=Nanum+Gothic&display=swap" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css2?family=Ingrid+Darling&family=Nanum+Gothic&display=swap" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css2?family=Ingrid+Darling&family=Nanum+Gothic&family=Playfair+Display+SC&display=swap" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css2?family=Arimo&display=swap" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css2?family=Poiret+One&display=swap" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css2?family=Dancing+Script&display=swap" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css2?family=Antonio:wght@100&display=swap" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css2?family=Updock&display=swap" rel="stylesheet">

  <title>{SITENAME_TITLE}{PAGE_TITLE}</title>
  <meta http-equiv="content-type" content="text/html; charset={S_CONTENT_ENCODING}"/>
  <meta http-equiv="content-script-type" content="text/javascript"/>
  <meta http-equiv="content-style-type" content="text/css"/>
  <!-- BEGIN switch_compat_meta -->
  <meta http-equiv="X-UA-Compatible" content="IE={switch_compat_meta.VERSION}"/>
  <!-- END switch_compat_meta -->
  <!-- BEGIN switch_canonical_url -->
  <link rel="canonical" href="{switch_canonical_url.CANONICAL_URL}"/>
  <!-- END switch_canonical_url -->
  {META_FAVICO}
  {META}
  {META_FB_LIKE}
  <meta name="title" content="{SITENAME_TITLE}{PAGE_TITLE}"/>
  {T_HEAD_STYLESHEET}
  {CSS}
  <link rel="search" type="application/opensearchdescription+xml" href="/improvedsearch.xml" title="{SITENAME}"/>
  <link rel="search" type="application/opensearchdescription+xml" href="{URL_BOARD_DIRECTORY}/search/improvedsearch.xml" title="{SEARCH_FORUMS}"/>
  <script src="{JQUERY_PATH}" type="text/javascript"></script>
  <!-- BEGIN switch_recent_jquery -->
  <script src="{JS_DIR}jquery1.9/jquery-migrate-1.4.1.js" type="text/javascript"></script>
  <script src="{JQUERY_DIR}browser/v1.0/jquery.browser.min.js" type="text/javascript"></script>
  <script src="{JQUERY_DIR}support/jquery.support.js" type="text/javascript"></script>
  <!-- END switch_recent_jquery -->
  <script src="{JS_DIR}{L_LANG}.js" type="text/javascript"></script>
  {RICH_SNIPPET_GOOGLE}

  <!-- BEGIN switch_fb_login -->
  <script src="https://connect.facebook.net/{switch_fb_login.FB_LOCAL}/all.js" type="text/javascript"></script>
  <script src="{switch_fb_login.JS_FB_LOGIN}" type="text/javascript"></script>
  <!-- END switch_fb_login -->

  <!-- BEGIN switch_ticker -->
  <link type="text/css" rel="stylesheet" href="{JQUERY_DIR}ticker/ticker.css"/>
  <script src="{JQUERY_DIR}/ticker/ticker.js" type="text/javascript"></script>
  <!-- END switch_ticker -->
  <script src="https://kit.fontawesome.com/f15612b287.js" crossorigin="anonymous"></script>
  <!-- BEGIN switch_ticker_new -->
  <script src="{JQUERY_DIR}jcarousel/jquery.jcarousel.js" type="text/javascript"></script>
  <script type="text/javascript">//<![CDATA[
      /* Definir le sens de direction en fonction du panneau admin */
      var tickerDirParam = "{switch_ticker.DIRECTION}";
      var slid_vert = false;
      var auto_dir = 'next';
      var h_perso = parseInt({switch_ticker.HEIGHT});

      switch (tickerDirParam) {
        case 'top' :
            slid_vert = true;
            break;
        case 'left':
            break;
        case 'bottom':
            slid_vert = true;
            auto_dir = 'prev';
            break;
        case 'right':
            auto_dir = 'prev';
            break;
        default:
            slid_vert = true;
      }

      $(document).ready(function () {
        var w_cont = $('#fa_ticker_container').width();

        if (w_cont > 0) {
            $('#fa_ticker_container').width(w_cont);

            /* Affichage de la liste */
            $('#fa_ticker_content').css('display', 'block');

            /* Calcul des dimensions du conteneur et des elements */
            var width_max = $('ul#fa_ticker_content').width();
            var width_item = Math.floor(width_max / {switch_ticker.SIZE});
            var height_max = h_perso;

            /* Calcul de la hauteur maximale du conteneur en fonction des elements et de la hauteur personnalisee dans l'admin */
            $('ul#fa_ticker_content li').each(function () {
              if ($(this).height() > height_max) {
                  height_max = $(this).height();
              }
            });

            /* Redimensionnement des elements et des images trop larges */
            $('ul#fa_ticker_content li').width(width_item).height(height_max).find('img').each(function () {
              if ($(this).width() > width_item) {
                  var ratio = $(this).width() / width_item;
                  var new_height = Math.round($(this).height() / ratio);
                  $(this).height(new_height).width(width_item);
              }
            });

            /* Redimensionnement et centrage du conteneur en mode vertical */
            if (slid_vert) {
              $('ul#fa_ticker_content').width(width_item).height(height_max).css('marginLeft', 'auto').css('marginRight', 'auto');
            }

            /* Initialisation du caroussel */
            $('#fa_ticker_content').jcarousel({
              vertical: slid_vert,
              wrap: 'circular',
              auto: {switch_ticker.STOP_TIME},
              auto_direction: auto_dir,
              scroll: 1,
              size: {switch_ticker.SIZE},
              height_max: height_max,
              animation: {switch_ticker.SPEED}
            });
        } else {
            $('ul#fa_ticker_content li:not(:first)').css('display', 'none');
            $('ul#fa_ticker_content li:first').css('list-style', 'none').css('text-align', 'center');
        }
      });
      //]]>
  </script>
  <!-- END switch_ticker_new -->

  <script type="text/javascript">//<![CDATA[
      $(document).ready(function () {
        <!-- BEGIN switch_enable_pm_popup -->
        pm = window.open('{U_PRIVATEMSGS_POPUP}', '_faprivmsg', 'HEIGHT=225,resizable=yes,WIDTH=400');
        if (pm != null) {
            pm.focus();
        }
        <!-- END switch_enable_pm_popup -->
        <!-- BEGIN switch_report_popup -->
        report = window.open('{switch_report_popup.U_REPORT_POPUP}', '_phpbbreport', 'HEIGHT={switch_report_popup.S_HEIGHT},resizable=yes,scrollbars=no,WIDTH={switch_report_popup.S_WIDTH}');
        if (report != null) {
            report.focus();
        }
        <!-- END switch_report_popup -->
        <!-- BEGIN switch_ticker -->
        $(document).ready(function () {
            Ticker.start({
              height: {switch_ticker.HEIGHT},
              spacing: {switch_ticker.SPACING},
              speed: {switch_ticker.SPEED},
              direction: '{switch_ticker.DIRECTION}',
              pause: {switch_ticker.STOP_TIME}
            });
        });
        <!-- END switch_ticker -->
      });

      <!-- 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 -->
      //]]>
  </script>
  {GREETING_POPUP}
  <!-- BEGIN switch_ticker_new -->
  <style>
      .jcarousel-skin-tango .jcarousel-item {
        text-align: center;
        width: 10px;
      }

      .jcarousel-skin-tango .jcarousel-item-horizontal {
        margin-right: {switch_ticker.SPACING}px;
      }

      .jcarousel-skin-tango .jcarousel-item-vertical {
        margin-bottom: {switch_ticker.SPACING}px;
      }
  </style>
  <!-- END switch_ticker_new -->
  {HOSTING_JS}

  <!-- BEGIN google_analytics_code -->
  <script async src="https://www.googletagmanager.com/gtag/js?id={G_ANALYTICS_ID}"></script>
  <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());
      gtag('config', '{G_ANALYTICS_ID}', {'anonymize_ip': true, 'store_gac': false, 'cookie_expires': 13 * 30 * 24 * 60 * 60});
      <!-- BEGIN google_analytics_code_bis -->
      gtag('config', '{G_ANALYTICS_ID_BIS}', {'anonymize_ip': true, 'store_gac': false, 'cookie_expires': 13 * 30 * 24 * 60 * 60});
      <!-- END google_analytics_code_bis -->
  </script>
  <!-- END google_analytics_code -->
</head>

<body background="{T_BODY_BACKGROUND}" bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}"
    vlink="{T_BODY_VLINK}">

<!-- html dark mode -->
<div class="theme-switch-wrapper">
    <label class="theme-switch" for="checkbox">
        <input type="checkbox" id="checkbox" />
        <div class="slider round"></div>
    </label>
</div>
<!--fin html dark mode -->

<!-- début script dark mode -->
<script>
    const toggleSwitch = document.querySelector('.theme-switch input[type="checkbox"]');
    const currentTheme = localStorage.getItem('theme');

    if (currentTheme) {
        document.documentElement.setAttribute('data-theme', currentTheme);

        if (currentTheme === 'dark') {
            toggleSwitch.checked = true;
        }
    }

    function switchTheme(e) {
        if (e.target.checked) {
            document.documentElement.setAttribute('data-theme', 'dark');
            localStorage.setItem('theme', 'dark');
        }
        else {
            document.documentElement.setAttribute('data-theme', 'light');
            localStorage.setItem('theme', 'light');
        }
    }

    toggleSwitch.addEventListener('change', switchTheme, false);
</script>
<!-- fin dark mode -->

<style>
.panaff {
    width: 870px;
    height: 150px;
    position: static;
    display: flex;
    overflow: hidden;
    padding: 2px;
    margin-left: auto;
    margin-right: auto;
    background-color: var(--colbackgris);
    border-radius: 20px;
    margin-top: 60px;
    margin-bottom: 20px;
}

.panaffmaj {
    text-align: justify;
    height: 138px;
    width: 114px;
    background-color: transparent;
    overflow: auto;
    position: relative;
    display: inline-block;
    border-right: 1px solid var(--blanc);
    margin-left: 5px;
    margin-right: 5px;
    padding: 5px;
}

.panaffmaj span{
    margin-top: 14px;
    background: var(--linearv8);
    font-family: var(--fontit);
    font-size: 42px;
    letter-spacing: 5px;
    text-transform: capitalize;
    font-weight: 300;
    margin-right: 20px;
    margin-bottom: -20px!important;
    text-align: center;
    background-image: var(--linearv6);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent!important;
    display: inline-block;
    margin-left: 20px;
}

.panavertissement {
    display: block;
    text-align: justify;
    padding: 1px;
    margin: 5px 0;
    height: 130px;
    line-height: 16px;
    width: 310px;
    margin-left: 5px;
    margin-right: 5px;
    background-color: var(--blanc);
    overflow: auto;
    border-radius: 20px;
    padding: 5px;
}

.panavertissement span{font-size: 12px;
    line-height: 16px;
    text-align: justify;
    font-family: var(--fontbasique);
    color: var(--ecriture);
}

.links img {
    width: 70px;
    height: 140px;
    margin-top: 4px;
    object-fit: cover;
    margin-right: 8px;
    border-radius: 20px;
    outline: 1px solid var(--blanc);
    padding: 3px;
    margin-left: 7px;
}

.pop-up:target {position:static; left:0;}
.popBox {
    background:var(--blanc);
    position:absolute;
    margin:auto;
    width:600px;
    height:300px;
    top: 0px;
    left: 0;
    bottom: 0;
    right: 0;
    z-index:10;
    opacity:0;
    -webkit-transition: opacity 0.6s ease-in-out;
    -ms-transition: opacity 0.6s ease-in-out;
    transition: opacity 0.6s ease-in-out;
}
:target .popBox {position:fixed; opacity:1;}

/* Light box properties */
.lightbox {display:none; text-indent:-999em; background:var(--blanc); opacity:0.6; width:100%; height:100%; position:fixed; top:0; left:0; bottom:0; right:0; z-index:5;}
    :target .lightbox {display:block;}

    .close:link,
    .close:visited {
      position:absolute;
      top:0.5em; right:-0.5em;
      display:block;
      width:2em; height:2em;
      padding:4px 5px 5px 4px;
      text-decoration:none;
      color:var(--noir);
    }

/* -----  POP UP ----- */
.BMInfos_Pop {
    width: 600px;
    padding: 5px;
    height: 300px;
    border-radius:20px!important;
    background-color: var(--blanc);
    display: flex;
    flex-direction: row;}

.BMBlock_img{
    width: 240px;
    height: 300px;
    margin-top: 5px;
    object-fit: cover;
    background: var(--blanc);
    margin-right: 8px;
    margin-top: 2px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    border-radius:20px;
}

.BMInfos_Pop img {
    width: 60px;
    height: 60px;
    object-fit: cover;
    float: left;
    opacity: 0.8;
}

.BMInfo_BlockPop{
    width: 200px;
    background: var(--blanc);
    height: 300px;
}
.BMInfo_BlockPop h1{
    font-size: 30px;
    font-family: var(--fontit);
    letter-spacing: 2px;
    font-weight: 300;
    text-align: center;
    padding: 8px;
    background-image: var(--linearv6);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent!important;
    margin-top: 2px;
}
.BMInfo_BlockPop h2{
    padding: 4px;
    background: linear-gradient(45deg,var(--grad1), var(--grad2),var(--grad4));
    font-size: 8px;
    color: var(--ecriture); font-family: var(--fontaes3);
    text-transform: uppercase;
    width: 130px;
    letter-spacing: 1px;
    text-align: center;
    background: var(--linearv7);
    height: 10px;
    border-radius: 20px;
    margin-left: 6px;
}

tagadmin {
    display: inline-block;
    font-size: 20px;
    line-height: 7px;
    text-transform: uppercase;
    letter-spacing: 2px;
    padding: 3px 5px;
    font-weight: bold;
    font-family: var(--fonptitit);
    margin-left: 6px;
    margin-top: 10px;
}

.BMInfos_PresPop {
    width: 280px;
    background: var(--blanc);
    height: 280px;
    text-align: justify;
    overflow: auto;
    padding: 10px;
    margin: 0px 10px;
}

.BMInfos_PresPop span{
    font-size: 14px;
    font-family: var(--fontbasique);
    color:var(--ecriture);
}

.panmiddlecont {
    width: 185px;
    height: 146px;
    margin-left: 20px;
}

.panmiddleur{border: 1px solid var(--blanc);
    color: var(--blanc)!important;
    display: inline-block;
    margin: 2px;
    padding: 2px;
    width: 80px;
    text-align: center;
    margin-top:10px;
    border-radius:20px;
}

span.panmiddleur {
    background: var(--linearv1)!important;
}

.panmiddleur a{
    color: var(--blanc)!important;
    font-family: var(--fonptitit);
    font-size: 8px;
    letter-spacing: 2px;
    text-transform: uppercase;
    transition: all .5s ease;
}
</style>

<div id="navigation"><div id="navig">{GENERATED_NAV_BAR}</div></div>

<!-- BEGIN hitskin_preview -->
<div id="hitskin_preview" style="display: block;">
  <h1><img src="https://2img.net/i/fa/hitskin/hitskin_logo.png" alt=""/> <em>Hit</em>skin.com</h1>
  <div class="content">
      <p>
        {hitskin_preview.L_THEME_SITE_PREVIEW}
        <br/>
        <span>{hitskin_preview.U_INSTALL_THEME}<a href="https://{hitskin_preview.U_RETURN_THEME}">{hitskin_preview.L_RETURN_THEME}</a></span>
      </p>
  </div>
</div>
<!-- END hitskin_preview -->

<!-- BEGIN inactive_users_modal -->
<div id="inactive_popup" style="z-index: 10000 !important;">
  <table class="forumline" style="padding: 0px; width: 480px;" border="0" cellspacing="1"
        cellpadding="0">
      <tr height="25">
        <td class="catLeft">
            <span class="genmed module-title">{inactive_users_modal.L_MODAL_TITLE}</span>
        </td>
      </tr>
      <tr height="{LOGIN_POPUP_MSG_HEIGHT}">
        <td class="row1" align="left" valign="top">
            <span class="genmed">{inactive_users_modal.L_MODAL_BODY}</span>
            <div id="inactive_popup_buttons">
              <input type="button" id="inactive_popup_url" class="mainoption"  value="{inactive_users_modal.L_MODAL_BUTTON}" />
              <input type="button" id="inactive_popup_close" class="button" value="{inactive_users_modal.L_CLOSE}" />
            </div>
        </td>
      </tr>
  </table>
</div>
<script type="text/javascript">
  $('#inactive_popup #inactive_popup_close').on('mouseup', function () {
      document.cookie = "modal_require_activation_closed=1; max-age=86400*15; path=/;";
      $('#inactive_popup').hide(50);
  });
  $('#inactive_popup #inactive_popup_url').on('mouseup', function () {
      document.cookie = "modal_require_activation_closed=1; max-age=86400*15; path=/;";
      location.href = '{inactive_users_modal.U_MODAL}'
  })
</script>
<!-- END inactive_users_modal -->

<!-- BEGIN switch_login_popup -->
<div id="login_popup" style="z-index: 10000 !important;">
  <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>
      <!-- BEGIN switch_quick_login -->
      <tr>
        <td class="row1" align="left" valign="top">
            <div class="social_btn">
              <!-- BEGIN fb_quick_connect -->
              <div class="fb-login-button"></div>
              <!-- END fb_quick_connect -->
              &nbsp;
              <!-- BEGIN topicit_quick_connect -->
              <div class="ti-connect"></div>
              <!-- END topicit_quick_connect -->
            </div>
        </td>
      </tr>
      <!-- END switch_quick_login -->
  </table>
</div>
<!-- END switch_login_popup -->

<!-- BEGIN switch_like_popup -->
<div id="like_popup" style="z-index: 10000 !important;">
  <table class="forumline" width="{LIKE_POPUP_WIDTH}" height="{LIKE_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="{LIKE_POPUP_MSG_HEIGHT}">
        <td class="row1" align="left" valign="top">
            <div id="like_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="like_popup_close" type="button" class="button" value="{L_LIKE_CLOSE}"/>
              </form>
            </div>
            <span class="genmed">{LIKE_POPUP_MSG}</span>
        </td>
      </tr>
  </table>
</div>
<!-- END switch_like_popup -->

<a name="top"></a>
{JAVASCRIPT}
<div class="headerbm">
    <table width="100%" cellspacing="0" cellpadding="0" border="0">
        <tr>
            <!-- BEGIN switch_logo_left -->
            <td>
                <a href="{U_INDEX}"><img loading="lazy" src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1"/></a>
            </td>
            <!-- END switch_logo_left -->
            <td align="center" width="100%" valign="middle">
              <!-- BEGIN switch_logo_center -->
              <a href="{U_INDEX}"><img loading="lazy" src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1"/></a>
              <br/>
              <!-- END switch_logo_center -->
              <div class="maintitle">{MAIN_SITENAME}</div>
              <br/>
              <span class="gen">{SITE_DESCRIPTION}<br/>&nbsp; </span>
            </td>
            <!-- BEGIN switch_logo_right -->
            <td><a href="{U_INDEX}"><img loading="lazy" src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1"/></a></td>
            <!-- END switch_logo_right -->
        </tr>
    </table>
</div>

<div class="panaff">
    <div class="panaffmaj">
        <span>MAJ</span>
        <br/>
        <span>N°6</span>
    </div>

    <div class="panavertissement">
        <span><bt6>Busan Memory</bt6> est un forum chill, <linear1>bon enfant</linear1>, sans la moindre prise de tête. On est ici avant tout pour passer un <u>bon</u> moment <u4>tous ensemble</u4> dans la <mc2>bonne humeur</mc2>, <mc6>la joie</mc6>, la <mc7>bienveillance</mc7>. Cette petite chose que nous avons créé est là pour que nous puissions avoir le plaisir de partager <u1>notre passion commune pour l'écriture</u1>. <linear4>BM</linear4> c'est aussi un forum <i3>sans aucune contrainte</i3> de rp pour éviter toute forme de pression. C'est un forum à <u3>avatar réel</u3> (toutes origines acceptées) et qui sollicite tout de suite une identité sous la forme <b1>Nom Prénom</b1>. Ici tout ce que l'on souhaite c'est que les personnes présentes soient <mc1>heureux.ses</mc1> au sein de Busan Memory.  N'oubliez pas; <u>fun</u> et <u>beaucoup d'amour</u>.</span>
    </div>

    <div class="links">
        <a href="#pop1"><img src="https://64.media.tumblr.com/136de0edf949f1076f64989dc716c236/302f8e0ae1f66aa5-d5/s250x400/1d986c3d11097a45f3640fa3ec356fa1a2717a33.gif"/></a>
        <a href="#pop2"><img src="https://64.media.tumblr.com/6adcac7bd8921f94ef31a1746308da29/b67ebd9046d3ecb3-3c/s400x600/1bf067b4e84430b1a88a6d4c36cf766ea18cada2.gif"/></a>

        <div id="pop1" class="pop-up">
            <div class="popBox">
                <div class="BMInfos_Pop">
                    <div class="BMBlock_img">
                        <img src="https://64.media.tumblr.com/076a31e6007d854deec17c6bb1fcb3b8/c06ffe5b5c8ea380-c1/s250x400/7cda6cd36c6adc00fe561ffae40b4139506d925c.gif" class="BMInfos_Pop">
                        <img src="https://www.zupimages.net/up/23/31/a42z.gif" class="BMInfos_Pop">
                        <br/>
                        <img src="https://64.media.tumblr.com/ba2e4e75e0cb3a59e69875109f6f2c86/b49158d52ca28667-95/s250x400/90ac412a5aa1d311bc4e3a9655b8bdafab9741f5.gif" class="BMInfos_Pop">
                        <img src="https://64.media.tumblr.com/595f6d68ec9f73c34b91be9fa41d39b0/8efb329682a09d36-17/s400x600/39292241dec9624106f888a3bf6c86a35119c3fa.gif" class="BMInfos_Pop">
                        <br/>
                        <img src="https://64.media.tumblr.com/4b379a72bf6a5f6d3437941aec9113d9/1da42795362c86cb-fe/s400x600/a4e8cd07b7f43cbf0935e8e24eba449e4b8eeb48.gif" class="BMInfos_Pop">
                        <img src="https://64.media.tumblr.com/dd5472959fcbaddcba2893e523c494d8/tumblr_pks2qbYjdP1xp8hp7o2_250.gif" class="BMInfos_Pop">
                        <br/>
                        <img src="https://64.media.tumblr.com/fb03617ab87dd02d2b15ab365f33c89d/f0269ede50d576ca-c2/s400x600/bf395dbd34dad37e7e48a01dbe1f91970f73d7f5.gif" class="BMInfos_Pop">
                        <img src="https://64.media.tumblr.com/df3b1cd8d93dedbc6364695f2bed32c8/b0f1c849f5545f04-ed/s400x600/c5e714f787d6a17204d305013a5875d4519f4e3e.gif" class="BMInfos_Pop">
                    </div>

                    <div class="BMInfo_BlockPop">
                        <h1>Esprit Sombre</h1>
                        <h2>Fondatrice</h2>
                        <img src="https://www.zupimages.net/up/24/04/2pnl.png" style="margin-top: 4px;margin-bottom: 10px;height: 80px;width: 80px;object-fit: cover;text-align: center;margin-left: 40px;">
                        <tagadmin><a href="https://busanmemory.forumactif.com/privmsg?mode=post&amp;u=6" target="_blank">mp</a></tagadmin>
                        <tagadmin><a href="https://busanmemory.forumactif.com/u6" target="_blank">profil</a></tagadmin>
                    </div>

                    <div class="BMInfos_PresPop">
                        <span>
                          <i4>Esprit Sombre</i4> pour vous service, mais si on devient intime t'auras le droit de m'call <mc1>Tati</mc1>. <b1>Fondatrice</b1> de BM et aussi horrible <bt8>grosse rageuse</bt8> de ce petit lieu (c'est mon côté joueuse de League of Legends qui ressort), on m'identifie très souvent à Stitch et ses humeurs abracadabrantes.
                          Piteuse <linear2>codeuse et graphiste</linear2>, fans absolue <mc7>d'AES</mc7>, j'alimente ma vie d'une forte surconsommation de <b0>caféine</b0> et d'un <mc2>franglish calamiteux</mc2>.
                          Brute de décoffrage, <u1>sans aucun filtre</u1>, je prône <i6>l'honnêteté</i6> et ferme la porte aux <u4>fausses apparences</u4> ou aux trous du cul qui ne connaissent pas le mot <i5>respect</i5>.
                          Passionnée par le RP depuis <u>de longues années</u> je ne me suis intéressée à la Corée du sud que <mc5>'récemment'</mc5>, d'ailleurs je ne suis que très peu les actualités...
                          Mais hey, les connaissances ne font pas tout,  inrp tu verras à quel point j'suis une sacrée <linear3>tarée</linear3> avec <bt8>beaucoup</bt8> de fun.
                          Obviously à côté j'ai de <b7>nombreux passe temps</b7>, mais my life est consacrée au <u5>théâtre</u5>;; comédienne dans mes veines. Étudiante ++ salarié, insomniaque à plein temps vous pourrez me trouver connectée à des heures <b3>improbables</b3>.
                          Pour tout problème de <bt6>codage ou de graphisme</bt6> (<i>genre une couleur qui vous éclate les yeux</i>), vous pouvez me contacter par <linear1>MP ou sur discord</linear1>, c'est avec plaisir que je vous répondrais dans les plus bref délais !
                          Évidemment je reste ouverte à <u>toutes discussions</u> donc n'hésitez pas ! J'espère que vous passerez de très bon moments sur <b5>Busan Memory</b5>, que vous en ferez votre petit <strong>cocon</strong> et qu'il n'y aura ici que de bons <u>souvenirs</u> à emporter ...
                        </span>
                    </div>
                </div>

                <a href="#links" class="close"><span class="th th-cross-1"></span></a>
            </div>

            <!-- This link is the light box -->
            <a href="#links" class="lightbox">Back to links</a>
        </div>

        <div id="pop2" class="pop-up">
            <div class="popBox">
                <div class="BMInfos_Pop">
                    <div class="BMBlock_img">
                        <img src="https://64.media.tumblr.com/5feab8149cf045933a6033ae5db2f993/tumblr_p538g44t7a1rug3rlo3_250.gif" class="BMInfos_Pop">
                        <img src="https://64.media.tumblr.com/c8c1a606911d36f7a19d2528f15592c3/6b1d464acda15827-16/s540x810/8e88d7f25d8a99e5726231b3a6f8cc3583ac217f.gif" class="BMInfos_Pop">
                        <br/>
                        <img src="https://64.media.tumblr.com/0cddfc4a14926cf719f1c81b8790c36f/44fdb7871a993516-72/s400x600/a4fc17389a0df3ecb0e959760638192292da7bf9.gif" class="BMInfos_Pop">
                        <img src="https://64.media.tumblr.com/ed7051cf26a1178edc8e91f27cf8cd47/tumblr_pq3vlxkWi81uu2l2ko3_r1_250.gif" class="BMInfos_Pop">
                        <br/>
                        <img src="https://64.media.tumblr.com/5a963f31c88ecf624b4deae35ec990e7/tumblr_ottxkhrj3D1ww80x6o2_400.gif" class="BMInfos_Pop">
                        <img src="https://64.media.tumblr.com/097e2db6368048012efa188b2faa62fa/aaaf07dc5ab03905-a5/s250x400/31be28e06c0d20176d3d4afb8194447070b20352.gif" class="BMInfos_Pop">
                    </div>

                    <div class="BMInfo_BlockPop">
                        <h1>Suah</h1>
                        <h2>Administratrice</h2>
                        <img src="https://www.zupimages.net/up/24/04/2pnl.png" style="margin-top: 4px;margin-bottom: 10px;height: 80px;width: 80px;object-fit: cover;text-align: center;margin-left: 40px;">
                        <tagadmin><a href="https://busanmemory.forumactif.com/privmsg?mode=post&amp;u=6" target="_blank">mp</a></tagadmin>
                        <tagadmin><a href="https://busanmemory.forumactif.com/u6" target="_blank">profil</a></tagadmin>
                    </div>

                    <div class="BMInfos_PresPop">
                        <span>
                          Moi, c’est <i3>Suah</i3> alias la drama queen par intermittence (pas dans le mauvais sens, hein), je suis super fan de dramas in rp et je dédies toute ma vie aux rp’s <mc7>pleins d’émotions et drôles</mc7>, sachez-le (si vous voulez faire un remake de the penthouse, mine ou sky castle svp toquez à ma porte je vous en supplie, vous pouvez même la casser). Je m'excuse d'avance si vos fc's ne me disent rien parfois je ne suis plus du tout les nouveaux groupes, je suis de l'ancienne génération #vieille mais je serais ravie de connaître de nouvelles têtes. Et je serais ravie de vous faire connaître des musiques venant des Philippines !
                          Je suis aussi une énorme fan de gangs et de guerre de clans, me demandez pas pourquoi moi-même j'ai pas la réponse... Je rp depuis 2011 donc j’ai peut-être croisé certaines personnes dans les dernières années donc je serais heureuse de vous retrouver  pour partager de nouveaux rp's et pour ceux que je ne connais pas créons de bons souvenirs !  J’espère que vous ferez de <bt6>Busan Memory</bt6> votre petit nid douillet ou même votre <mc1>safe place</mc1>.  Je suis totalement joignable si besoin de quoi que ce soit !
                          En général, je suis assez <b8>énergique</b8> dû au rythme de mes études donc on me retrouve connectée à des heures pas possibles devant mon ordi à boire des <i2>matcha latte </i2> (être prof de FLE, c'est ça aussi) mais hésitez pas à venir m’embêter. Il se peut d'ailleurs que mon fuseau horaire change totalement puisque je pars pour <i3>les Philippines</i3> pour de la recherche de terrain dans les mois à venir mais j'essayerais de vous répondre au plus vite quand même !
                        </span>
                    </div>
                </div>

                <a href="#links" class="close"><span class="th th-cross-1"></span></a>
            </div>

            <!-- This link is the light box -->
            <a href="#links" class="lightbox">Back to links</a>
        </div>
    </div>

    <div class="panmiddlecont">
        <span class="panmiddleur"><a href="https://busanmemory.forumactif.com/t17-reglement" title="règlement">règlement</a></span>
        <span class="panmiddleur"><a href="https://busanmemory.forumactif.com/t16-contexte" title="contexte">contexte</a></span>
        <span class="panmiddleur"><a href="https://busanmemory.forumactif.com/t15-groupes" title="groupes">groupes</a></span>
        <span class="panmiddleur"><a href="https://busanmemory.forumactif.com/t23-faceclaim" title="bottin">bottin</a></span>
        <span class="panmiddleur"><a href="https://busanmemory.forumactif.com/f30-scenariis" title="scenarios">scénariis</a></span>
        <span class="panmiddleur"><a href="https://busanmemory.forumactif.com/t8-guide-du-newbie" title="guide">guide</a></span>
        <span class="panmiddleur"><a href="https://busanmemory.forumactif.com/f77-guest" title="invités">invités</a></span>
        <span class="panmiddleur"><a href="https://busanmemory.forumactif.com/t571-les-tops-sites" title="tops sites">tops sites</a></span>
        <span class="panmiddleur"><a href="https://busanmemory.forumactif.com/t14-l-aes" title="l'aes">l'aes</a></span>
        <span class="panmiddleur"><a href="https://discord.gg/r23TrYMDp9" title="discord">discord</a></span>
    </div>
</div>
<br>
<table class="bodylinewidth" width="{T_BODY_TABLE_WIDTH}" cellspacing="10" cellpadding="10" border="0" align="center">
  <tr>
      <td class="bodyline">
        <div style="clear: both;"></div>

        <!-- BEGIN switch_ticker_new -->
        <div id="fa_ticker_block" style="margin-top:4px;margin-bottom:4px;">
            <table width="100%" border="0" cellspacing="0" cellpadding="0" class="forumline">
              <tr>
                  <td align="left" class="row1">
                    <div id="fa_ticker_container">
                        <ul id="fa_ticker_content" class="jcarousel-skin-tango" style="display:none;">
                          <!-- BEGIN ticker_row -->
                          <li>{switch_ticker.ticker_row.ELEMENT}</li>
                          <!-- END ticker_row -->
                        </ul>
                    </div>
                  </td>
              </tr>
            </table>
        </div>
        <!-- END switch_ticker_new -->

        <!-- BEGIN switch_ticker -->
        <div id="fa_ticker_block" style="margin-top:4px;margin-bottom:4px;">
            <table width="100%" border="0" cellspacing="0" cellpadding="0" class="forumline">
              <tr>
                  <td align="left" class="row1">
                    <div id="fa_ticker_container">
                        <div id="fa_ticker" style="height:{switch_ticker.HEIGHT}px;">
                          <div class="fa_ticker_content">
                              <!-- BEGIN ticker_row -->
                              <div>{switch_ticker.ticker_row.ELEMENT}</div>
                              <!-- END ticker_row -->
                          </div>
                        </div>
                    </div>
                  </td>
              </tr>
            </table>
        </div>
        <!-- END switch_ticker -->

        <div id="page-body">
            <div id="{ID_CONTENT_CONTAINER}"{CLASS_CONTENT_CONTAINER}>
              <table cellpadding="0" cellspacing="0" width="100%" class="three-col">
                  <tbody>
                  <tr>
                    <td valign="top" width="{C1SIZE}">
                        <div id="{ID_LEFT}">
                          <!-- BEGIN giefmod_index1 -->
                          {giefmod_index1.MODVAR}
                          <!-- BEGIN saut -->
                          <div style="height:{SPACE_ROW}px"></div>
                          <!-- END saut -->
                          <!-- END giefmod_index1 -->
                        </div>
                    </td>
                    <td valign="top" width="100%">
                        <!-- BEGIN html_validation -->
                    </td>
                  </tr>
                  </tbody>
              </table>
            </div>
        </div>
      </td>
  </tr>
</table>
</body>
</html>
<!-- END html_validation -->
Toryudo

Toryudo
Aidactif
Aidactif

Masculin
Messages : 1372
Inscrit(e) le : 31/03/2020

https://deus-academia.forumactif.com/
Toryudo a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Pop Up Box qui fait tout bug

Message par Rnd. Jeu 1 Fév 2024 - 13:13

Encore une fois vous me sauvez Angel
Merci beaucoup, je constate que mon template était un véritable petit chantier Shocked
Je prends note de vos indications !
Merci encore pour votre précieuse aide,
Belle journée !
Rnd.

Rnd.
Nouveau membre

Autre / Ne pas divulguer
Messages : 22
Inscrit(e) le : 07/09/2022

https://busanmemory.forumactif.com/
Rnd. a été remercié(e) par l'auteur de ce sujet.

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

- Sujets similaires

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