IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

jQuery Discussion :

Sortie de Avgrund Modal : le plugin jQuery pour vos boîtes modales et popups


Sujet :

jQuery

  1. #1
    Expert éminent sénior

    Avatar de vermine
    Profil pro
    Inscrit en
    Mars 2008
    Messages
    6 582
    Détails du profil
    Informations personnelles :
    Âge : 39
    Localisation : Belgique

    Informations forums :
    Inscription : Mars 2008
    Messages : 6 582
    Points : 79 912
    Points
    79 912
    Par défaut Sortie de Avgrund Modal : le plugin jQuery pour vos boîtes modales et popups
    Sortie de Avgrund Modal
    le plugin jQuery pour vos boîtes modales et popups.

    Ce plugin, créé par Dmitri Voronianski, ajoute une impression de profondeur à la page lorsque vous affichez une boîte modale. Le contenu principal fait un zoom arrière (il rétrécit) et se grise. Il fonctionne dans tous les navigateurs récents.

    Simple d'utilisation, vous n'avez qu'à appeler ce code :

    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    $('element').avgrund();

    Il faut également ajouter le CSS :

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    <link rel="stylesheet" href="path/to/your/avgrund.css">

    Toutefois, il vous est possible de préciser une série d'options :

    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    $('element').avgrund({			
    	width: 380, // max 640px
    	height: 280, // max 350px
    	showClose: false, // passer à 'true' pour ajouter le bouton de fermeture 
    	showCloseText: '', // le texte du bouton de fermeture
    	holderClass: '',
    	overlayClass: '',
    	enableStackAnimation: false,
    	template: 'Le contenu...'
    });

    Cette idée vient du concept de Avgrund créé par Hakim El Hattab.


    Démo et présentation.
    Télécharger les sources.
    D'après un article sur DailyJS. Cet article parle également de jQuery Color 2.1.0.

  2. #2
    Membre éprouvé
    Avatar de dkmix
    Profil pro
    Inscrit en
    Septembre 2007
    Messages
    619
    Détails du profil
    Informations personnelles :
    Localisation : Jamaïque

    Informations forums :
    Inscription : Septembre 2007
    Messages : 619
    Points : 924
    Points
    924
    Par défaut
    très sympa l'effet

  3. #3
    Expert éminent
    Avatar de transgohan
    Homme Profil pro
    Développeur Temps réel Embarqué
    Inscrit en
    Janvier 2011
    Messages
    3 146
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Maine et Loire (Pays de la Loire)

    Informations professionnelles :
    Activité : Développeur Temps réel Embarqué

    Informations forums :
    Inscription : Janvier 2011
    Messages : 3 146
    Points : 9 386
    Points
    9 386
    Par défaut
    A noter qu'il est tout à fait compatible sur d'anciennes versions de navigateurs.
    Testé à l'instant sous FF 3.6 et il fonctionne.
    C'est juste qu'on a pas la transition (pas d'effet) et qu'on a directement l'application du zoom.

    « Toujours se souvenir que la majorité des ennuis viennent de l'espace occupé entre la chaise et l'écran de l'ordinateur. »
    « Le watchdog aboie, les tests passent »

  4. #4
    Rédacteur

    Avatar de Jérôme Lambert
    Homme Profil pro
    Développeur .NET
    Inscrit en
    Novembre 2003
    Messages
    4 451
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 40
    Localisation : Belgique

    Informations professionnelles :
    Activité : Développeur .NET
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Novembre 2003
    Messages : 4 451
    Points : 14 357
    Points
    14 357
    Par défaut
    Je viens d'esssayer sous IE10 en mode IE8 et IE7 et ça ne fonctionne pas. Sous IE10 en mode IE9, il n'y a pas l'effet au niveau du zoom et l'arrière plan n'est pas flooté. C'est dommage.
    Jérôme Lambert
    Développeur, Architecte, Rédacteur & Fan technologies Microsoft
    Ma boite informatique | Mon profil LinkedIn

  5. #5
    Membre émérite

    Homme Profil pro
    Software Developer
    Inscrit en
    Mars 2008
    Messages
    1 470
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Software Developer

    Informations forums :
    Inscription : Mars 2008
    Messages : 1 470
    Points : 2 368
    Points
    2 368
    Par défaut
    Citation Envoyé par Jérôme Lambert Voir le message
    Je viens d'esssayer sous IE10 en mode IE8 et IE7 et ça ne fonctionne pas. Sous IE10 en mode IE9, il n'y a pas l'effet au niveau du zoom et l'arrière plan n'est pas flooté. C'est dommage.
    Oui pas d'effet sous IE9, et pas tres longue a charger.
    Sinon effet plutot sympa en effet

    Par contre la compatibilité est un minimum, donc plugin non-utilisable tant qu'ils ne fixent pas cela.

  6. #6
    Membre à l'essai
    Profil pro
    Inscrit en
    Juillet 2003
    Messages
    44
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juillet 2003
    Messages : 44
    Points : 19
    Points
    19
    Par défaut
    interressant c'est ce que je cherche
    mais est il possible de le modifier pour que cela s'ouvre automatiquement, par xemple sur la page d'accueil d'un site, sans avoir a cliquer sur un bouton
    ... et si oui quelqu'un pourrait il me montrer car je n'arrive pas a le faire

Discussions similaires

  1. Réponses: 0
    Dernier message: 19/09/2012, 08h07
  2. Réponses: 20
    Dernier message: 27/08/2012, 10h19
  3. plugin jQuery pour League of Legend
    Par momox19 dans le forum jQuery
    Réponses: 1
    Dernier message: 10/06/2011, 16h46
  4. Réponses: 2
    Dernier message: 02/06/2010, 10h23
  5. Réponses: 0
    Dernier message: 03/09/2009, 21h53

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo