AccueilFAQRechercherMembresGroupesS'enregistrerConnexion

Forum de graphisme, codage et game design proposant des tutoriels, astuces, libres services et commandes dans les domaines de l'infographie amateur, de l'intégration web (HTML et CSS essentiellement) ainsi que dans la conception de RPG sur forum.


    Catégories Antarctiques ▬ Dernier message en hover

    Partagez
    avatar
    Halloween
    FémininAge : 24Messages : 9753

    le Dim 23 Mar 2014 - 10:25

    Rappel du premier message :



    Plop,

    Suite à une demande voici le LS qui en découle.

    Catégories


    Version  phpBB2 ▬ CSS & HTML

    Aperçu ▬ www


    CSS
    Code:
    /* --------------------------------- CATEGORIES --------------------------------- */


    /* CODES CSS DERNIERS MESSAGES CACHES */

    .last {
      width: 150px;
      height: 80px;
      overflow: hidden;
      position: relative;
      top: -0.5em;
      background-color: #D5D2D2;
    }

    .last_img {
      position: relative;
      z-index: 2;
      width: 150px;
      height: 80px;
      margin-left: 0px;
      transform: all;
      -moz-transform: all;
      -o-transform: all;
      -htm-transform: all;
      -webkit-transform: all;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
    }

    .last:hover .last_img {
      margin-left: 400px;
      transform: all;
      -moz-transform: all;
      -o-transform: all;
      -htm-transform: all;
      -webkit-transform: all;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
    }
        
    .last_description {
      position: relative;
      z-index: 1;
      width: 150px;
      height: 80px;
      margin-top: -75px;
      font-size: 11px;
      color: #8c8c8c;
      padding: 15px;
      overflow: auto;
    }

    .last_description a{
      color: #005677;
    }

    .last_description a:hover {
      color: #007EAE;
      text-decoration: none !important;
    }

    /*** FONDS GENERAUX ***/

    /* Fond titre catégorie */
    .cate_titre {
      width: 600px;
      margin: auto;
      padding: 5px;
      background-color: #007BAA;
      box-shadow: 2px 2px 15px black;
      -moz-box-shadow: 2px 2px 15px black;
      -webkit-box-shadow: 2px 2px 15px black;
    }

    /* Mise en forme nom de catégorie */
    h2 {
      font-size: 30px;
      font-family: 'Oregano', cursive;
      color: #003E55;
      text-align: center;
    }

    /* Fond du forum */
    .categorie {
      background-color: #B7B3B3;
     border-left: 4px solid #007BAA;
     width: 600px;
      height: 180px;
      padding: 15px;
    }


    /*** MISE EN FORME DES FORUM ***/

    /* Mise en forme du texte des titres de forum */
    .forumlink {
      position: relative;
      left: 2em;
      color: #007BAA !important;
      font-family: 'Alegreya Sans SC', sans-serif;
      font-size: 20px !important;
      font-weight: none !important;
      z-index: 1;
    }

    .forumlink:hover {
      color: #002F40 !important;
      text-decoration: none !important;
    }

    .forumlink a {
      font-size: 16px;
      width: 500px;
    }

    /* Mise en forme de la description */
    .description {
      width: 300px;
      height: 70px;
      overflow: auto;
      font-size: 11px;
      text-align: justify;
      background-color: #D5D2D2;
      color: #272727;
      border-radius: 5px;
      padding: 15px;
    }

    .description:hover {
      width: 300px;
      height: 70px;
      overflow: auto;
      font-size: 11px;
      text-align: justify;
      background-color: #D5D2D2;
      color: #272727;
      border-radius: 5px;
      padding: 15px;
      border-left: 2px solid #007BAA;
     border-right: 2px solid #007BAA;
    }

    /*** SOUS-FORUM ***/

    .lienssf {
      width: 420px;
      max-height: 15px;
      overflow: auto;
      padding: 15px;
      position: relative;
      top: -2em;
    }

    .lienssf a {
      color: #007BAA !important;
      text-decoration: none !important;
    }

    .lienssf a:hover {
      color: #005677 !important;
      text-decoration : none !important;
    }

        /*--------------------------------- FIN CATEGORIES --------------------------------- */



    Template index_box
    Code:
       <table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
           <tr>
              <td valign="bottom">
                 <!-- BEGIN switch_user_logged_in -->
                 <span class="gensmall">{LAST_VISIT_DATE}<br />
                 {CURRENT_TIME}<br />
                 </span>
                 <!-- END switch_user_logged_in -->
                 <div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
              </td>
              <td class="gensmall" align="right" valign="bottom">
                 <!-- BEGIN switch_user_logged_in -->
                 <a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br />
                 <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br />
                 <!-- END switch_user_logged_in -->
                 <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
              </td>
           </tr>
        </table>
        <!-- BEGIN catrow --><!-- BEGIN tablehead -->

        <center><div style="background-color: #D5D2D2; padding: 15px; width: 780px;"><div class="cate_titre" style="vertical-align: middle;">{catrow.tablehead.L_FORUM}</div>



           <!-- END tablehead -->
           <!-- BEGIN cathead -->
          
          <!-- END cathead -->
           <!-- BEGIN forumrow -->
        
       
        <br /><br /> <div class="categorie">
            <table><tr>
              <td><a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a><br /><br />
            {catrow.forumrow.FORUM_DESC}
              <div class="lienssf">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</div></td>
          <td><div class="last"><div class="last_img"><img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" /></div><div class="last_description">{catrow.forumrow.LAST_POST}</div></div>
    <div style="clear: both;"></div></td>
               </tr></table>
            
         </div>

           <!-- END forumrow -->
           <!-- BEGIN catfoot -->
          
          <!-- END catfoot -->
           <!-- BEGIN tablefoot -->
        
        </div>  </center>
        
       <!-- END tablefoot --><!-- END catrow -->
    <link href='http://fonts.googleapis.com/css?family=Oregano|Carrois+Gothic+SC' rel='stylesheet' type='text/css'>

    Dans les descriptions de sous-forum
    Code:
    <table>
     
    <tbody>
     <tr>
     
    <td>
     <img src="http://i58.servimg.com/u/f58/17/97/89/15/the_or11.png" />
    </td>
     
    <td>
     <div class="description">
     Nec minus feminae quoque calamitatum participes fuere similium. nam ex hoc quoque sexu peremptae sunt originis altae conplures, adulteriorum flagitiis obnoxiae vel stuprorum. inter quas notiores fuere Claritas et Flaviana, quarum altera cum duceretur ad mortem, indumento, quo vestita erat, abrepto, ne velemen quidem secreto membrorum sufficiens retinere permissa est. ideoque carnifex nefas admisisse convictus inmane, vivus exustus est.
    </div>
     </td>
     
    </tr>
     
    </tbody>
    </table>



    Un petit merci ou commentaire est toujours le bienvenu ^^
    - Mettre/laisser un crédit vers Never-Utopia est obligatoire.
    - Si vous avez des problèmes avec ce LS ou des questions, venez poster ici.


    Dernière édition par Halloween le Jeu 13 Avr 2017 - 20:33, édité 1 fois




    < / Libre service codage >
    avatar
    petit lu
    FémininAge : 25Messages : 172

    le Lun 16 Fév 2015 - 23:17

    super beau, merci
    avatar
    Sacha73
    MasculinAge : 38Messages : 67

    le Mer 18 Fév 2015 - 21:11

    pour voir
    avatar
    Toupimero
    FémininAge : 57Messages : 56

    le Mer 25 Fév 2015 - 8:26

    Merciii Very Happy
    avatar
    Kokoa
    FémininAge : 19Messages : 57

    le Mer 25 Fév 2015 - 17:34

    Simple et efficace !




    « Tous cet espace pour moi ? Fallait pas ! »
    avatar
    Drizzle
    FémininAge : 20Messages : 135

    le Ven 27 Fév 2015 - 19:09

    Thanks Very Happy.



    avatar
    Kirito
    MasculinAge : 22Messages : 200

    le Mar 3 Mar 2015 - 16:02

    waw <3
    avatar
    Youp
    FémininAge : 23Messages : 579

    le Mar 10 Mar 2015 - 22:14

    Je suis curieuse, merci pour le partage :love:



    avatar
    Kianda
    MasculinAge : 17Messages : 88

    le Mer 11 Mar 2015 - 12:59

    Merci !



    avatar
    Bunny Lune
    FémininAge : 28Messages : 142

    le Jeu 12 Mar 2015 - 22:39

    Merci du partage
    avatar
    Ryukaï
    MasculinAge : 20Messages : 614

    le Sam 4 Avr 2015 - 12:48

    Merci Wink



    avatar
    Meylah
    FémininAge : 16Messages : 60

    le Sam 4 Avr 2015 - 13:31

    Merci
    avatar
    Neilia
    FémininAge : 26Messages : 101

    le Dim 12 Avr 2015 - 16:57

    merci ^^
    avatar
    Windae
    FémininAge : 23Messages : 13

    le Lun 13 Avr 2015 - 10:13

    Merci :)
    avatar
    Ivy
    FémininAge : 22Messages : 45

    le Lun 13 Avr 2015 - 23:23

    Merci !
    avatar
    Akiyuki
    MasculinAge : 19Messages : 89

    le Sam 18 Avr 2015 - 14:31

    Merci !
    avatar
    Fuyuka
    FémininAge : 23Messages : 62

    le Lun 20 Avr 2015 - 2:41

    Merci beaucoup !
    avatar
    Leelo
    FémininAge : 27Messages : 147

    le Mar 21 Avr 2015 - 14:10

    magnifique
    avatar
    Tit_Kiwi
    FémininAge : 26Messages : 25

    le Mer 22 Avr 2015 - 16:36

    Superbe :)
    avatar
    Artchie
    FémininAge : 26Messages : 42

    le Mer 22 Avr 2015 - 21:52

    Magnifique
    avatar
    Spitfire
    FémininAge : 24Messages : 55

    le Ven 24 Avr 2015 - 14:11

    ça c'est extra comme effet !
    avatar
    Kira de Shola
    FémininAge : 21Messages : 60

    le Dim 26 Avr 2015 - 17:21

    Merci !
    avatar
    Staark
    MasculinAge : 22Messages : 49

    le Ven 1 Mai 2015 - 23:30

    Merci **
    avatar
    Presley♥Cash
    FémininAge : 27Messages : 76

    le Sam 2 Mai 2015 - 14:34

    Merci ♥
    avatar
    Izaya Orihara
    FémininAge : 16Messages : 105

    le Dim 10 Mai 2015 - 21:57

    Merci pour le partage.
    avatar
    ☮ mistletoe
    FémininAge : 19Messages : 28

    le Sam 16 Mai 2015 - 21:50

    merci
    Contenu sponsorisé


      La date/heure actuelle est Mer 18 Juil 2018 - 12:44