Farbtastic, selecteur de couleur via jquery

29/08/2007
WebDev et Design Allez aux commentaires

Ah ah, celà fait plusieurs jours que je ne vous ai pas sortis un script pour jquery ! Allez, comme je sais que ça vous manque, en voici un ...

Farbtastic est donc un script jquery qui va vous permettre d'installer une pipette à couler ou vous le désirez. Utile pour donner un confort supplémentaire a certain de vos script ....

Mise en place:

  • Comme d'habitude, on commence par inclure le framework jquery
    <script type='text/javascript' src='jquery.js'></script>
  • Ensuite on intègre le plugin Farbtastic
    <script type='text/javascript' src='farbtastic.js'></script>
  • On inclus le css lié
    <link rel="stylesheet" href="farbtastic.css" type="text/css" />
  • Ensuite à l'endroit où vous désirez afficher la pipette
    <form><input type="text" id="color" name="color" value="#123456" /></form>
    <div id="colorpicker"></div>
  • Et pour finir, il faut activer le script (dans un .js ou sur votre page via les balises script)
    $(document).ready(function() {
          $('#colorpicker').farbtastic('#color');
    });

Voir la démo (ainsi que des exemples de fonctions avancées)

-----

Articles relatifs

  • Shaïpen

    Heum OK
    et dans la pratique… ça sert a quoi ? ^^’
    Je veux dire ok en interne ça peut toujours servir de temps en tems une palette de couleur, mais sur un site je vois pas a quoi ça va servi, peu etre la couleur du texte lors d’un commentaire :X

    Merci pour ce lien utile xD

  • Kenobi17

    Je découvre ton site et je le trouve excellent c’est du bon boulot continue comme ça.

    > Shaïpen : les utilisations de ce script sont multiples, par exemple la création d’un compte utilisateur avec la possibilité de choisir sa couleur par défaut ( ce que je suis en train de faire sa tombe bien). ou bien sur un netvibes-like choisir la couleur de fond de sa page ….

  • k-ny

    Ahah, fait travailler ton imagination !

    Effectivement genre pour une zone de commentaire ou autre …

    Ou une personnalisation du bakground de ton site pour chaque visiteur, enfin voilà ^^

  • Shaïpen

    ouais enfin … faire une personalisation d’un BG je veux bien mais bon là c’est juste un générateur de code ^^’
    et puis un site avec un background a couleur changeable est un site pauvre graphisquement, quand tu travalle sur le graph en général tout est prévu a la mindre couleur alors si tu fais un beau site ténébreux et que le visiteur te mets un jaune pipi comme BG ^^’

    M’enfin ^^’
    Moi vais essayer de débugger mon dotclear -.-

  • Eric Maugendre

    Si le visiteur met un jaune pipi comme background, il aura choisi. Ce script est donc utile pour que l’usager personnalise son environnement. Merci beaucoup.

  • momayse

    Salut à tous petit souci lors de l’intégration de ce script qui doit me servir a définir la couleur d’un textarea
    après avoir suivis sagement la manip je n’obtient qu’un champ texte avec la valeur par défaut écrit a l’intérieur
    j’ai du mal mis prendre mais je ne sais pas ou alors si quelqu’un aurais un indice merci d’avance !!

  • x@v

    Bonjour,
    moi je vais m’en servir pour un backoffice et permettre le personalisation du site, classe…
    J’utilise déjàn wslide qui est un bon script.
    http://www.developpus.com/mvc
    Super ton site !