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



    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
    AMIANTE
    FémininAge : 22Messages : 36

    le Jeu 3 Avr 2014 - 9:47

    très joli dis donc !



    uc
    Licmac.
    FémininAge : 25Messages : 18

    le Sam 5 Avr 2014 - 14:12

    Merci Very Happy
    avatar
    Seven
    FémininAge : 24Messages : 135

    le Dim 6 Avr 2014 - 15:13

    Oh. Exactement ce que je cherchais. Merci beaucoup ! *^*
    avatar
    Deviliar
    FémininAge : 29Messages : 44

    le Dim 6 Avr 2014 - 18:59

    Merci !
    avatar
    alex24d
    FémininAge : 30Messages : 95

    le Lun 7 Avr 2014 - 14:08

    Nice!!
    Jamy
    FémininAge : 28Messages : 37

    le Dim 13 Avr 2014 - 12:14

    Sympa !! Very Happy
    avatar
    CathyCréation
    FémininAge : 38Messages : 207

    le Ven 25 Avr 2014 - 14:42

    merci
    avatar
    Invité

    le Mar 6 Mai 2014 - 16:39

    Nice comme d'habitude hallo' x)
    avatar
    Tatia38
    FémininAge : 29Messages : 306

    le Mer 7 Mai 2014 - 10:34

    J'aime beaucoup la taille des images et de combien ? Merci encore
    avatar
    Halloween
    FémininAge : 24Messages : 9753

    le Mer 7 Mai 2014 - 11:42

    Hey !

    100*100 pour les illustrations, et 150*80 pour les images "new", "no new" et "lock" qui recouvrent les derniers messages Wink




    < / Libre service codage >
    avatar
    Tatia38
    FémininAge : 29Messages : 306

    le Mer 7 Mai 2014 - 11:50

    Merci beaucoup
    avatar
    TUC
    FémininAge : 30Messages : 103

    le Mer 7 Mai 2014 - 11:52

    Merci (:



    avatar
    cosmos-chann
    FémininAge : 21Messages : 115

    le Mer 7 Mai 2014 - 21:11

    Merci du partage !
    avatar
    Lily-R
    FémininAge : 25Messages : 17

    le Jeu 8 Mai 2014 - 14:45

    Très simple mais élégant =D !
    Merci beaucoup encore !
    avatar
    Zelfy
    FémininAge : 22Messages : 3

    le Ven 9 Mai 2014 - 13:31

    Merci (:
    avatar
    SpicAsh
    FémininAge : 21Messages : 170

    le Ven 9 Mai 2014 - 21:16

    Merci !
    avatar
    LickingBoot
    FémininAge : 19Messages : 503

    le Ven 9 Mai 2014 - 22:59

    merci beaucoup !



    avatar
    HW.
    FémininAge : 17Messages : 10

    le Sam 10 Mai 2014 - 13:48

    merci !
    avatar
    Invité

    le Sam 10 Mai 2014 - 18:57

    Merci !
    avatar
    Gabriiielle
    FémininAge : 27Messages : 53

    le Sam 10 Mai 2014 - 19:16

    merci :)
    avatar
    Snape.
    FémininAge : 21Messages : 55

    le Dim 11 Mai 2014 - 12:21

    Mercii !



    avatar
    Parka
    MasculinAge : 38Messages : 100

    le Dim 11 Mai 2014 - 13:46

    Merci
    avatar
    Milka
    FémininAge : 30Messages : 112

    le Lun 12 Mai 2014 - 9:48

    Sublime *-*
    avatar
    Tchii
    FémininAge : 32Messages : 254

    le Mer 14 Mai 2014 - 12:20

    Merci beaucoup pour ce ptit code.
    A trés vite!
    Tchii!
    Contenu sponsorisé


      La date/heure actuelle est Mer 18 Juil 2018 - 2:45