[JS] utilisation de la librairies highlightfade de jquery

utilisation de la librairies highlightfade de jquery [JS] - HTML/CSS - Programmation

Marsh Posté le 31-07-2008 à 09:05:52    

bonjour a tous,
 
je n'arrive pas a utiliser la librairie highlightfade je voudrais faire une fondue , démarrer de rien jusqu'au jaune dans une div, cependent avec la doc je ne comprends pas grand chose ...
 
je m'appuie sur cette doc :
 
http://jquery.offput.ca/highlightFade/old.php
 
voici mes tests :
http://www.developpementphoto.net/V3/tst.html
 
j'inclus les librairies :
 

Code :
  1. <script type="text/javascript" src="js/jquery.js"></script>
  2. <script type="text/javascript" src="js/jquery.highlightFade.js"></script>


 
au chargement :
 

Code :
  1. <script type="text/javascript">
  2. <!--
  3. window.onload = function(){document.getElementById(test).highlightFade({color:'red',speed:2000,iterator:'exponential'});}
  4. -->
  5. </script>


 
l'html :
 

Code :
  1. <body>
  2. <div id="test"> bla bla </div>
  3. </body>


 
une idée me serait bien venue ...


---------------
la vie à le goût qu'on lui donne !! Vive le photo numérique et le tirage photo
Reply

Marsh Posté le 31-07-2008 à 09:05:52   

Reply

Marsh Posté le 31-07-2008 à 21:25:24    

hup !!
 
 :jap:


---------------
la vie à le goût qu'on lui donne !! Vive le photo numérique et le tirage photo
Reply

Marsh Posté le 01-08-2008 à 00:42:39    

je ne suis pas spécialiste de jQuery, mais dans ton code je vois "document.getElementById (test)", ce qui est faux car :
1) si tu veux choper ton id 'test', tu dois écrire

Code :
  1. document.getElementById ('test')

à moins que pour toi "test" soit une variable qui contient la chaine 'test' (mais je pense pas).
 
2) pour lancer la méthode highlightFade (), tu dois choper l'élement avec jQuery et non avec les méthodes classiques du DOM, càd avec la fonction $(), comme précisé dans la doc ...

Code :
  1. window.onload = function(){
  2. $('test').highlightFade ({ color: 'red', speed: 2000, iterator: 'exponential' })
  3. }


 
Si tu es sous FireFox, je te conseille l'extension FireBug pour faire du dev en javascript, ou Firebug-lite pour les autres browser (je te laisse le soin de googliser tout ca)


Message édité par SICKofitALL le 01-08-2008 à 00:45:17

---------------
We deserve everything that's coming...
Reply

Marsh Posté le 01-08-2008 à 08:25:08    

Je viens d'essayer Firebug, c'est clair que c'est pas mal du tout.
j'utilisais jusqu'à présent Webdevelopper toolbar !
 
Bon je viens d'effectuer quelques test avec l'appel de fonction comme tu l'as écris ... et toujours rien ...  
dans la doc je ne comprennais pas bien l'appel de la fonction, je ne suis pas du tout familier avec Jquery ....  
 
Pas évident tout ca


---------------
la vie à le goût qu'on lui donne !! Vive le photo numérique et le tirage photo
Reply

Marsh Posté le 01-08-2008 à 09:58:23    

arf en fait c'est tt con, c'est la sélection de l'élement qui continu à poser problème.

Code :
  1. $("#test" ).highlightFade ({ color: 'yellow', speed: 2000, iterator: 'exponential' });


---------------
We deserve everything that's coming...
Reply

Marsh Posté le 01-08-2008 à 11:59:57    

Super génial ! merci pour ton aide ! c'est top ces librairies ... bon il faut se familiariser ... bonne journée à toi !


---------------
la vie à le goût qu'on lui donne !! Vive le photo numérique et le tirage photo
Reply

Marsh Posté le 03-08-2008 à 22:13:51    

juste encore une petite interrogation, si je désire lancer un highlightFade  sur un clique de souris ???  
 
j'ai testé avec ca :
 
 
 

Code :
  1. function hg(id){
  2. function(){
  3. $(id).highlightFade ();
  4.   }
  5. }


 
je passe en parametre l'id de la div sur laquel j'agit en lui rajoutant #  
 
par exemple "#22"
 
mais la fonction ne se lance pas ... sans doute encore des particuliarité des fonction jquery ??  
 
merci de ton aide SICKofitALL

Reply

Marsh Posté le 04-08-2008 à 01:18:08    

En regardant le source de la page de highlightFade, tu as ta solution :

Code :
  1. $('#<ID_DE_TON_DIV>').click (function () { $(this).highlightFade () } );


 
ou en format fonction :

Code :
  1. var maFonction = function (id, params) /* params est un objet et peut être nul */
  2. {
  3. $('#' + id).click (function () { $(this).highlightFade (params) } );
  4. return true;
  5. }


 
Exemples reprenant ce qu'on a déjà vu plus haut :
maFonction ('test'); // pas de params
maFonction ('test', { color: 'red', speed: 2000, iterator: 'exponential' });
 
 
 
Concernant ton "#22", je sais pas si le "22" est un exemple, mais appeller un élément par un chiffre (ou commencer son nom par un chiffre) est une mauvaise idée.


---------------
We deserve everything that's coming...
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed