/images/rss.gif){kind=small}
JQuery tag archives
10
TOP sites Jquery design
Voici une liste de sites qui utilisent le framework Ajax Javascript jQuery :
Des sites qui pourront vous inspirer par leur design et les possibilités d’animations et de navigation grâce à JQuery :
Un site avec une navigation par images polaroid. Et à remarquer un tableau en scroll époustouflant tout en CSS et javascript.
Beau menu de navigation. Slide show.
Trés belle présentation. Des transitions qui semblent être faites en Flash, mais non tout est en JQuery.
Menu animé
Galerie d’images et scrollbar customisée
Galerie photos en barcode. Etonnant!
A voir le formulaire et la navigation dans le choix des widgets.
Un pied de page rétractable. Un joli slider.
20
JQuery 1.4.2 encore plus rapide
Une nouvelle version du framework jQuery vient de sortir (19 février 2010) : la version 1.4.2
C’est une release mineure de la 1.4 qui corrige quelques bugs et ajoute quelques nouveautés dans son API.
Le point à noter c’est l’amélioration des performances :
Pour faire appel à jQuery, il est préférable de passer par les CDNS :
* http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js
* http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.2.min.js
20
jQuery fête ses 4 ans nouvelle version 1.4
La librairie Ajax jQuery f̻te son quatri̬me anniversaire avec une nouvelle version majeure РJQuery 1.4.
JQuery propose un framework javascript aux concepteurs d’interface. Sa rapidité et sa structure légère le rende facile à intégrer. On peu ajouter des effets complexes avec seulement quelques lignes de code. Google, Microsoft, Amazon et plusieurs développeurs web indépendants partout dans le monde ont choisi jQuery pour gérer Ajax. WordPress a choisi jQuery.
La dernière version de jQuery possède des gains en vitesse impressionnante et représente un refactoring d’une grande partie du code jQuery. Selon les développeurs de jQuery cette nouvelle version est nettement plus rapide sur les différents navigateurs et élimine une grande partie de la redondance dans les fonctions internes de jQuery.
Autres changements important, la prise en compte des éléments HTML5 dans les appels de sérialisation, la capacité d’essai pour les moteurs de rendu spécifique (par exemple, WebKit cible avec jQuery.browser.webkit) et la possibilité de « easing » dans vos animations.
Pour tout savoir sur tout ce qui est nouveau, consultez le blog post jQuery et n’oubliez pas de regarder les changements incompatibles avant d’essayer de mettre à niveau tous vos projets jQuery.
Comme toujours, vous pouvez récupérer les versions source minified et full de jQuery sur la page de téléchargement ou tout simplement inclure la version hébergée de Google dans vos projets en incluant l’URL, http://ajax.googleapis.com/ajax/libs/jquery/1.4 / jquery.min.js.
30
TopUp nouvelle ligthbox
Dans la série des scripts Ajax javascript, les ligthbox sont les plus répandus. Cliquer sur un lien pour faire apparaitre une photo, une video, un formulaire dans la même page HTML voici ce que propose tous les scripts ligthbox.
TopUp est donc un nouveau script dans la série des ligthbox comme thickbox en jQuery. L’instalation est facile, un appel à la librairie javascript et dans les liens il faut mettre class= »topup »
Caractéristiques :
• TopUp est absolument libre, également pour un usage commercial
• Un processus très facile d’installation
• Utilisation des paramètres prédéfinis conserve le code HTML 100% clean, aucun code supplémentaire nécessaire .
• La possibilité d’afficher des images, du flash (à partir de sites comme Youtube, de fichiers SWF et FLV), des films (QuickTime, Windows Media et RealPlayer), iframes, des éléments et des DOM HTML brut
• TopUp est compatible avec Prototype
• TopUp est compressé avec Yahoo! YUI Compressor à 33,4 Ko (comprend JS, HTML et CSS)
• L’usage de CSS sprites réduit la quantité de demandes d’images par deux pour un chargement plus rapide
• Cross-browser compatible
• Fancy mises en page, animations et transitions
• Auto-correction de la taille et la position en cas de besoin
• La possibilité de créer des groupes
• Soutien aux requêtes AJAX
• Et bien plus …
J’ai testé sur une page en remplacement de thickbox. L’auto size n’a pas fonctionné : scroll de la box et mauvais centrage (notamment sur IE8). Ce script propose des caractéristiques intéressantes pour afficher des photos ou vidéos. Un script à suivre mais qui a encore quelques bugs de jeunesse.
29
Faire son netvibes avec JQuery
JPolite est un nouveau framework basé sur JQuery pour créer un portail à la façon netvibes.
Jpolite fournit le code en open source, vous pourrez donc essayer de faire votre propre netvibes. On peut intégrer les modules UWA de netvibes, donc avoir des widgets de toutes sortes.
Le lecteur RSS est encore assez simple.
Un outil à surveiller donc, sa force étant d’utiliser JQuery ce qui ouvre la possibilité d’intégration de plusieurs scripts du fameux framework ajax JQuery.
Pour ceux qui ne veulent pas développer, vous pouvez avoir votre page personnelle sur mirPod.com
26
Updater avec JQuery du contenu à jour
Voici un plugin JQuery utile pour mettre à jour du contenu périodiquement.
A télécharger ici
Step 1 -Â jQuery et le plugin.
<script src="jquery-1.3.2.min.js" type="text/javascript"></script> <script src="jquery.periodicalupdater.js" type="text/javascript"></script>
Step 2 – le script d’appel
$(document).ready(function(){
$.PeriodicalUpdater({
url : 'random.php'
},
function(data){
var myHtml = 'The data returned from the server was: ' + data + '';
$('#results').append(myHtml);
});
})Liste des options:
url
URL appel ajax de votre fonction php
method
GET ou POST!)
sendData
Tableau des valeurs envoyées à la page
minTimeout
valeur de départ de timeout en millisecondes.
maxTimeout
durée Maximum du temps entre deux requêtes.
multiplier
coefficient multiplicateur entre deux requêtes
type
Type de la r̩ponse : text, xml, json etc Р.
Step 3 РArr̻ter les requ̻tes!
le script
$('a#stop').click(function(e){
e.preventDefault();
clearTimeout(PeriodicalTimer);
})25
JQuery en 15 minutes
Une présentation en slideshow de JQuery, le célèbre framework Ajax :
1
Des images en grand écran
Si vous désirez afficher des images de grande taille sur votre site ou votre Blog Wordpress, voici une bonne idée pour améliorer le tag IMG.
Drew Wilson propose d’ajouter un attribut fullsize sur le Tag <IMG>. L’idée est de pouvoir afficher en grande taille toute image d’un site dans une LigthBox. Les navigateurs ne tenant pas encore compte de cet attribut, il a réalisé un plugin JQuery.
C’est le plugin Fullsize jQuery plugin
Pour les blogs WordPress il existe un plugin spécifique c’est ici
26
Des plugins JQuery indispensables
Voici une liste de TOP plugins javascript indispensables pour JQuery . WordPress utilise le framework javascript Ajax JQuery, ces plugins peuvent donc être facilement implanté sur votre Blog.
qTip
qTip est un plugin pour avoir des tooltip riches avec des bords ronds et des bulles design
uploadify – a file upload plugin for jQuery
Un plugin pour faire des upload de fichiers
Boxy
Un plugin pour des formulaires à la façon FaceBook
