<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0"><channel><title><![CDATA[[JQuery] Evenement de base]]></title><description><![CDATA[<p dir="auto">Salut all,<br />
Aujourd'hui je vais vous montrer les événement de base des éléments en JQuery lié au clavier et à la souris.</p>
<p dir="auto">Les événements les plus utilisés sont lié à la souris donc je vais commencer par cela, la disposition du code est expliquée dans mon intro donc je vais mettre moins de code... <img src="http://new.melinyel.net/assets/plugins/nodebb-plugin-emoji/emoji/android/1f627.png?v=b824361be89" class="not-responsive emoji emoji-android emoji--anguished" style="height:23px;width:auto;vertical-align:middle" title="D:" alt="😧" /></p>
<p dir="auto">petit exemple quand même avec l'event .click() en interaction avec un objet donc l'id est "MrPoke":</p>
<pre><code>$("#MrPoke").click(function() {
// code à exécuter lors de l’événement 
});
</code></pre>
<p dir="auto">Événements liés à la souris les plus utilisés:</p>
<ul>
<li>.click() : à quoi ça sert quoi déjà... c'est quand on clique sur l'élément.</li>
<li>.dbclick() : double clique sur l'élèment.</li>
<li>.mousedown() : lorsque vous enfoncez un bouton de la souris sur l’élément.</li>
<li>.mouseup() : event successif à .mousedown(), c'est à dire que c'est lorsque que vous arrêtez d'enfoncer le bouton sur l’élément.</li>
<li>.mouseenter() : lorsque vous placez votre curseur sur l’élément ou un de ses enfants.</li>
<li>.mouseleave() : lorsque vous retirez votre curseur de l'élément.</li>
<li>.mousemove() : lorsque vous déplacez le curseur sur l'élèment.</li>
</ul>
<p dir="auto">Pour le clavier je vais donner un exemple de raccourcis clavier on va dire faire un mouvement de mon #MrPoke, je vous passe le code html, et css:</p>
<pre><code>$(document).keypress(function(e) { // lorsque une touche est pressée sur le document ou un de ses enfantés en bref tout... avec une récupération d'entrée (la variable "e").
switch (e.which) { // on test l'entrée sous forme de chiffre
case 90: $("#MrPoke").stop().animate({top : '-=100px'}); break; // Si la touche est 90 (=z) on déplace #MrPoke vers le haut.
case 68: $("#MrPoke").stop().animate({left : '+=100px'}); break; // 68 = d
case 83: $("#MrPoke").stop().animate({top : '+=100px'}); break; // 83 = s
case 81: $("#MrPoke").stop().animate({left : '-=100px'}); break; // 81 = q
}
});
</code></pre>
<p dir="auto">Événements liés à la souris:</p>
<ul>
<li>.keydown() : lorsque l'on appuie sur une touche.</li>
<li>.keyup() : lorsque l'on relâche la touche.</li>
<li>.keypress() : lorsque l'on presse une touche, continuel contrairement à .keydown().</li>
</ul>
<p dir="auto">et encore une fonction:</p>
<ul>
<li>.focus() : lorsque l’élément est sélectionné.</li>
</ul>
<p dir="auto">ps: pour les raccourcis clavier je vous invite à cliquer sur <a href="http://chief.over-blog.com/article-raccourcis-clavier-en-javascript-jquery-69187878.html" rel="nofollow ugc">ce lien</a> ou il y a un tuto + liste</p>
<p dir="auto">Bonne programmation à tous!<br />
Cordialement,<br />
Mars073</p>
]]></description><link>http://new.melinyel.net/topic/189/jquery-evenement-de-base</link><generator>RSS for Node</generator><lastBuildDate>Fri, 22 May 2026 16:53:35 GMT</lastBuildDate><atom:link href="http://new.melinyel.net/topic/189.rss" rel="self" type="application/rss+xml"/><pubDate>Sun, 16 Mar 2014 20:23:57 GMT</pubDate><ttl>60</ttl><item><title><![CDATA[Reply to [JQuery] Evenement de base on Fri, 21 Mar 2014 21:36:35 GMT]]></title><description><![CDATA[<p dir="auto">Bah personnellement je trouve ça très intéressant, j'aime bien découvrir le mode de fonctionnement des différents langages (même si je n'y -pour l'instant- pas grand chose en jQuery). <img src="http://new.melinyel.net/assets/plugins/nodebb-plugin-emoji/emoji/android/1f642.png?v=b824361be89" class="not-responsive emoji emoji-android emoji--slightly_smiling_face" style="height:23px;width:auto;vertical-align:middle" title=":)" alt="🙂" /></p>
]]></description><link>http://new.melinyel.net/post/2916</link><guid isPermaLink="true">http://new.melinyel.net/post/2916</guid><dc:creator><![CDATA[Azad]]></dc:creator><pubDate>Fri, 21 Mar 2014 21:36:35 GMT</pubDate></item><item><title><![CDATA[Reply to [JQuery] Evenement de base on Thu, 20 Mar 2014 18:44:31 GMT]]></title><description><![CDATA[<p dir="auto">toujours un plaisir de partager mon savoir surtout quand y a au moins quelques personnes que ça intéresse x')</p>
]]></description><link>http://new.melinyel.net/post/2787</link><guid isPermaLink="true">http://new.melinyel.net/post/2787</guid><dc:creator><![CDATA[mars073]]></dc:creator><pubDate>Thu, 20 Mar 2014 18:44:31 GMT</pubDate></item><item><title><![CDATA[Reply to [JQuery] Evenement de base on Tue, 18 Mar 2014 23:38:12 GMT]]></title><description><![CDATA[<p dir="auto">Merci du partage ! <img src="http://new.melinyel.net/assets/plugins/nodebb-plugin-emoji/emoji/android/1f642.png?v=b824361be89" class="not-responsive emoji emoji-android emoji--slightly_smiling_face" style="height:23px;width:auto;vertical-align:middle" title=":)" alt="🙂" /></p>
]]></description><link>http://new.melinyel.net/post/2523</link><guid isPermaLink="true">http://new.melinyel.net/post/2523</guid><dc:creator><![CDATA[Azad]]></dc:creator><pubDate>Tue, 18 Mar 2014 23:38:12 GMT</pubDate></item><item><title><![CDATA[Reply to [JQuery] Evenement de base on Sun, 16 Mar 2014 21:15:42 GMT]]></title><description><![CDATA[<p dir="auto">Fail lien ?</p>
<p dir="auto">Merci du partage.</p>
]]></description><link>http://new.melinyel.net/post/2047</link><guid isPermaLink="true">http://new.melinyel.net/post/2047</guid><dc:creator><![CDATA[Soon]]></dc:creator><pubDate>Sun, 16 Mar 2014 21:15:42 GMT</pubDate></item></channel></rss>