• Sommaire cliquable

    Par LiseFleur dans Les Codes HTML le 4 Avril 2015 à 14:00

    -Code pour les fiches Lapino.-

    Sommaire cliquable

    ★ Sommaire, à droite :

    <div style="background-image: url(URL DU FOND); width: 500px; margin: 0px;">
    <table>
    <tbody>
    <tr>
    <td>
    <div style="margin: 10px; background-color: rgba(255, 255, 255, 0.5); border: 1px dashed white ; width: 306px; height:305px; box-shadow: 0px 0px 3px #000; overflow: hidden;">
     

    <div style="height: 285px; width: 286px; overflow: auto; padding:10px;">
    <a name="1"></a>
    <div style="text-align: center;"><br>
    <b>Titre Partie 1</b></div>
    <div style="text-align: left;">Texte</div>
    </div>

    <div style="height: 285px; width: 286px; overflow: auto; padding:10px;">
    <a name="2"></a>
    <div style="text-align: center;"><br>
    <b>Titre Partie 2</b></div>
    <div style="text-align: left;">Texte</div>
    </div>
     

    <div style="height: 285px; width: 286px; overflow: auto; padding:10px;">
    <a name="3"></a>
    <div style="text-align: center;"><br>
    <b>Titre Partie 3</b></div>
    <div style="text-align: left;">Texte</div>
    </div>


    <div style="height: 285px; width: 286px; overflow: auto; padding:10px;"></div>
    </div>
    </td>
    <td>
    <div style="margin: 0px; padding:10px; background-color: rgba(255, 255, 255, 0.5); border: 1px dashed white ; width: 130px; height:285px; box-shadow: 0px 0px 3px #000;">
    <div style="text-align: center;"><b><br></b></div>
    <div style="text-align: center;"><b>Sommaire</b></div>
    <div style="text-align: center;"><br></div>
    <div style="text-align: center;"><a href="#1" title="" target="">Titre Partie 1</a></div>
    <div style="text-align: center;"><a href="#2" title="" target="">Titre Partie 2</a><br></div>
    <div style="text-align: center;"><a href="#3" title="" target="">Titre Partie 3</a><br></div>
    </div>
    </td>
    </tr>
    </tbody>
    </table>
    </div>


    Titre Partie 1
    Texte

    Titre Partie 2
    Texte

    Titre Partie 3
    Texte
     

     ↑ Ne faites pas attention au modèle, il ne marche pas, mais c'est pour vous donner une idée de l'apparence ↑

    Explications 

    Changez les éléments en rouge.

    Pour modifier le texte qui se trouve sur les parties suivantes, placez votre curseurdans le texte, et descendez avec la touche flèche en bas  jusqu’à arriver à l'endroit que vous voulez éditer. 


  • Commentaires

    1
    Kiwiz
    Dimanche 5 Avril 2015 à 07:37
    Merci beaucoup ! Je pense qu'il va être utile pour ma fiche ! :D
    Répondre
    2
    Kiwiz
    Dimanche 5 Avril 2015 à 12:52

    C'est comme une fiche à onglets ! :O

    Répondre
    3
    Awani Profil de Awani
    Lundi 6 Avril 2015 à 14:16
    Awani

    Waaaah merci ! :D

     

     

    EDIT : J'ai essayé d'ajouter une quatrième partie, mais ça ne fonctionne pas quand on clique dessus > http://www.lapino.fr/joueur/fiche/149617#3

    RE-EDIt : Ah non, c'est bon j'ai réussi :D

    Répondre
    4
    Daisy90
    Samedi 11 Avril 2015 à 18:15

    merci du code happy

    Répondre
    5
    Paint'
    Dimanche 19 Avril 2015 à 10:15

    Super :D

    Répondre
    6
    Paint'
    Dimanche 19 Avril 2015 à 10:16

    Pourquoi tu ne viens plus sur lapino LiseFleur ?

    Répondre
    7
    Cyni&me
    Vendredi 24 Avril 2015 à 07:42

    En tout cas moi j'adore ce code *-* Jme suis dit "Bah dis donc, tout le monde a ce code u.u Jvais peut etre chercher sur le blog de LiseFleur..." et me voila ici x) Bref merci *-*

    Répondre
    8
    Perle.
    Vendredi 1er Mai 2015 à 17:58

    C'est vraiment bien !

    Répondre
    9
    Hanaaa
    Dimanche 24 Mai 2015 à 12:16

     


    Est il possible de ne pas avoir la même image par onglet?sarcastic


    -Hanaaa♥

    Répondre
    10
    Mimilo
    Lundi 3 Août 2015 à 21:29

    Il n'en a pas en gris c'est mieux je trouve 

    Répondre
    11
    julie
    Mardi 15 Septembre 2015 à 23:19
    julie

    bonjour,

    cela faisait longtemps je n'etais pas venue, tu sais je suis sur un blog wordpress, et j'arrive pas toujours avec tes codes, par exemple, celui ci me plait, j ai mis mon fond d images, impeccable, mais lorsque je visionne, en brouillon je vois mon fond, mais en billet je le vois pas en appercu,

    je ne vois qu'en brouillon

    que dois je faire ?

     

    sinon autre blem, j arrive pas a mettre youtube en auto play,

    auparavant je pouvais, avant ton code, mais wordpress est tres vigilant securité, maintenant on arrive plus trop a faire des trucs, j ai essaye ton code niet

     

     as tu une idee , crois tu que ces ma faute ?

     

    voila, en tous les cas je continue a me servir de tes fiches, certaines car yen a aussi qui sous wordpress fonctionne pas trop, a l'ocaz si tu visites mon blog tu reconnaitra les fiches,, j en suis contente

     

    bises et merci pour tes conseils et ton blog qui aide pas mal de personne

     

    julie

    Répondre
    12
    ♥coucou♥
    Dimanche 22 Novembre 2015 à 13:51

    Lorsque je fais ma fiche, je n'arrive pas à changer la page alors que lorsque j'enregistre, j'y arrive. Comment dois-je faire pour éditer ma fiche alors?ouch

     

    Répondre
    13
    ♥coucou♥
    Dimanche 29 Novembre 2015 à 19:06

    Ne pas utiliser ce code 2 fois sur la même fiche.

    Répondre
    14
    ♥coucou♥
    Mardi 1er Décembre 2015 à 15:15

    Comment tu as fait, Awanie pour mettre une 4ème partie? Sinon, ce code est SUPER!coolhappy

    Répondre
    15
    emyx1
    Dimanche 24 Avril 2016 à 12:07
    Bonjour, comment fait-on pour éditer les autres parties sur tablette?
    Répondre
    16
    Sixine
    Mardi 16 Août 2016 à 12:31

    Salut,

    J'essaye ton code sur ma fiche mais les partie 2 et 3 ne s'affichent pas. Et lorsque je clique sur un des liens du sommaire cliquable, je suis tout simplement envoyée sur la page d'accueil ! Pourquoi ?

    Merci pour ta future réponse. 

    Répondre
    • Nom / Pseudo :

      E-mail (facultatif) :

      Site Web (facultatif) :

      Commentaire :


    Suivre le flux RSS des commentaires


    Ajouter un commentaire

    Nom / Pseudo :

    E-mail (facultatif) :

    Site Web (facultatif) :

    Commentaire :