01
JUIN

AeroWindow - Créez des fenêtres javascript au style Aero Windows 7

Publié le 01/06/10 à 07h13 par DJo

AeroWindow est un plugin jQuery permettant de créer des fenêtres javascript très design, inspiré du style Aero de Windows 7.

AeroWindow - Un plugin jQuery pour créer des fenêtres javascript design

Lorsque vous déplacez la fenêtre avec votre souris, un effet glossy s'anime. Les coutours de la fenêtre sont translucides, ce qui donne un très bon style aux fenêtres.

Les fenêtres disposent des fonctions classiques: Réduire, agrandir ou fermer.

Elles réagissent aussi au double clic de la souris pour maximiser la fenêtre...

Très faciles à mettre en place, il vous suffira d'intégrer ce bout de code jQuery dans votre page:

$('#divConteneur').AeroWindow({
  WindowTitle:        'Titre de votre fenêtre',
  WindowPositionTop:  'center',
  WindowPositionLeft: 'center',
  WindowWidth:        400,
  WindowHeight:       100,
  WindowAnimation:    'easeOutCubic'       
});  

Le plugin est compatible avec IE6+, FF3+, Opera 10+, Safari 4+, Chrome 4+.

 

Site Officiel

Baraguiné par Ouka le 01/06/10 à 09h11
Ouka sur La Ferme du Web
Vraiment impréssionant les possibilitées du JQuery, avec une adaptation rapide de ce plugin on peut faire des choses comme ça :
http://www.ampix0.com/
Baraguiné par le_mulot le 01/06/10 à 09h53
le_mulot via Twitter
Ah oui c'est vraiment sympa !
Baraguiné par didus le 01/06/10 à 11h25
didus sur La Ferme du Web
Vraiment trop classe, bravo pour cette découverte.
Baraguiné par codegrabber le 02/06/10 à 11h52
codegrabber sur La Ferme du Web
sympa l'effet de transparence :)
je regrette un peu les rollovers qui rament un peu mais sinon c'est vraiment sympa.

ouka > de quoi parles tu ? ton adaptation apporte quoi par rapport à l'original ?
Baraguiné par legarspol le 02/06/10 à 18h58
legarspol sur La Ferme du Web
J'ai pas bien saisi:
Comment définir le contenu de la fenetre ?
Baraguiné par codegrabber le 03/06/10 à 11h08
codegrabber sur La Ferme du Web
legarspol > il te suffit de créer les contenus de tes fenêtres dans des div qui ont chacun un id, ensuite tu prends le code ci-dessus et tu l'appliques a chaque div.

Ajouter un Commentaire

Pour poster un commentaire, vous devez être identifié. Vous pouvez choisir parmi ces trois méthodes d'identification:

Compte la Ferme du Web

Identifiez-vous
Inscrivez-vous

Compte Facebook

Connexion avec Facebook

Compte Twitter

Connexion avec votre compte twitter
Rechercher sur la Ferme du web