[TUTO] Barre de progression pour vos blogs

 
  • Hamisoitil

    Néophyte de la lecture

    Hors ligne

    #11 15 Novembre 2011 22:15:51

    Donc voici le code :

    <!-- Progess bar widget, by Matthew Harvey (matt at smallish.com) --> <!-- Licensed under a Creative Commons Attribution-Share Alike 2.5 License (http://creativecommons.org/licenses/by-sa/2.5/) --> <style type="text/css"> div.smallish-progress-wrapper { /* Don't change the following lines. */ position: relative; border: 1px solid black; } div.smallish-progress-bar { /* Don't change the following lines. */ position: absolute; top: 0; left: 0; height: 100%; } div.smallish-progress-text { /* Don't change the following lines. */ text-align: center; position: relative; /* Add your customizations after this line. */ } </style> <!-- Progess bar widget, by Matthew Harvey (matt at smallish.com) --> <!-- Licensed under a Creative Commons Attribution-Share Alike 2.5 License (http://creativecommons.org/licenses/by-sa/2.5/) --> <script type="text/javascript"> function drawProgressBar(color, width, percent) { var pixels = width * (percent / 100); document.write('<div class="smallish-progress-wrapper" style="width: ' + width + 'px">'); document.write('<div class="smallish-progress-bar" style="width: ' + pixels + 'px; background-color: ' + color + ';"></div>'); document.write('<div class="smallish-progress-text" style="width: ' + width + 'px">' + percent + '%</div>'); document.write('</
    div>'); } </script>


    Puis on place juste après ce code :

    <script type="text/javascript">drawProgressBar('#ff0000', 200, 50);</script>


    Pour le reste  de  la manœuvre c'est à dire: changer la longueur, la couleur etccc, c'est sur ce blog
    http://bobinesetpelotes.blogspot.com/20 … ssion.html


    N'oubliez pas de rajouter l'image pour le livre que vous placerez au dessus du code comme   indiqué dans mon premier message  et le nombre de pages  que vous placerez juste en dessous du code.


    ce blog est valable pour blogger/blogspot, je vais chercher pour les autres

    Dernière modification par Hamy (15 Novembre 2011 22:18:12)

  • minifourmi

    Lecteur invétéré

    Hors ligne

    #12 17 Novembre 2011 21:58:19

    Bon ben, j'ai tenté, et pour overblog ça n'a pas l'air de fonctionné... Il me dit que c'est un code Javascript qui n'est pas accepté, donc il le supprime d'office!
  • Hamisoitil

    Néophyte de la lecture

    Hors ligne

    #13 17 Novembre 2011 22:01:40

    Ok, je vais voir si je peux trouver un autre code sans Java. Je reviens vers vous si j'ai qqchose
  • minifourmi

    Lecteur invétéré

    Hors ligne

    #14 17 Novembre 2011 22:13:01

    Merci beaucoup Hamy! :pouceleve:
  • hylyirio

    Lecteur-express

    Hors ligne

    #15 19 Novembre 2011 11:04:15

    je tenterai ça ce soir sur Wordpress, mais je suis pas certaine non plus qu'il accepte java... mais je vais tester malgré tout :)
    merci pour le code ;)
  • Joanskingdom

    Dompteur de pages

    Hors ligne

    #16 20 Novembre 2011 09:12:57

    Merci Hamy car depuis le temps que je cherchais comment faire. Je vais essayer tout de suite.
  • Sharlene

    Commence à sentir l'encre qui colle aux doigts

    Hors ligne

    #17 20 Novembre 2011 16:11:21

    J'aimerais bien le faire, mais je n'y arrive pas du tout.... :(
  • PommeBook

    Bibliophile

    Hors ligne

    #18 20 Novembre 2011 16:53:46

    J'ai essayé, mais je m'arrache un peu les cheveux...
    Ca ne fonctionne pas :(
  • Sharlene

    Commence à sentir l'encre qui colle aux doigts

    Hors ligne

    #19 20 Novembre 2011 16:58:58

    'ai essayé, mais je m'arrache un peu les cheveux...


    C'est exactement ca!!! :ptdr:

  • Iani

    Lecteur invétéré

    Hors ligne

    #20 20 Novembre 2011 22:11:53

    Ça marche parfaitement chez moi, merci pour l'astuce !