Voir la démoAcheter $18

- Voir Plus d'information - le script

Ce fichier convient à la bannière de la page d’accueil, au diaporama, à la visionneuse de produit, à la galerie même si vous pouvez l’utiliser comme intro. Toutes les animations sont personnalisables et conviennent donc à tout type de bannières. Vous pouvez utiliser n’importe quel nombre de calques sur chaque curseur. Vous pouvez facilement positionner et espacer chaque couche à l’aide d’attributs de données. Dans le fichier de téléchargement, cinq exemples par défaut sont disponibles dans un fichier html distinct.

Il fonctionne bien dans tous les navigateurs, y compris iPad, iOS et Android

Presque toutes les options sont disponibles pour personnaliser ce curseur sans modifier le code source

Capacité d’écran tactile pour le bureau et l’appareil à écran tactile

Utilisez n’importe quel type de contenu Div, il peut s’agir de plusieurs div, image (y compris le format d’image transparente), vidéo, youtube et swf (fichier flash)

Caractéristiques uniques:

  • Facile à aligner, espacement et direction d’animation pour chaque image et texte
  • Option pour choisir n’importe quel type de direction d’animation d’entrée / sortie
  • Option pour définir la distance à venir de l’animation
  • Animation de déplacement de motif d’arrière-plan
  • Option pour définir le temps d’entrée / sortie pour chaque div
  • Option pour définir le temps de retard du diaporama pour chaque diapositive
  • Activer / désactiver le glissement du bureau
  • Prise en charge d’images et de texte illimités sur chaque diapositive

Bouton en pointillé:

  • Trois types différents de boutons en pointillé avec la conception des boutons Suivant et Précédent sont disponibles
  • Positionnez la navigation n’importe où à l’aide de l’option Aligner et espacer
  • Afficher / Masquer les boutons en pointillé, Suivant et Précédent
  • Activer / désactiver le masquage automatique de la navigation

Miniatures:

  • Option pour afficher les miniatures avec le bouton suivant et précédent
  • Peut être facilement modifier la largeur et la hauteur de la vignette à l’aide de css
  • La couleur de la bordure de la vignette, la taille de la bordure, la vignette à l’espace des vignettes sont contrôlées via le fichier css
  • La miniature s’adapte automatiquement à la largeur de la bannière. Vous pouvez également modifier la zone d’affichage des miniatures
  • Vignette de la souris sur l’image de teinte ou contrôle via un fichier css, vous pouvez également utiliser la couleur au lieu de l’image
  • Positionnez la vignette n’importe où à l’aide des options d’alignement et d’espacement
  • Vous pouvez afficher les boutons et les miniatures en pointillé

Autres caractéristiques:

  • Le diaporama fait une pause lorsque l’utilisateur a frappé la bannière, sinon il continue à jouer
  • Cinq types d’échantillons différents sont disponibles
  • Prend en charge tous les navigateurs
  • Prise en charge des polices Cufon
  • Vous pouvez animer tout ce que vous placez à l’intérieur du div

Dans le code du plug-in, vous pouvez personnaliser le diaporama en utilisant les variables ci-dessous

jQuery(function($){
    $('#jq_fmslideshow').fmslideshow({
        banner_width : "",    
        banner_height : "",

        image_sprite : "fmslideshow_assets/sprite.png",
        image_background : "",
        image_topShadow : "",
        image_bottomShadow : "",
        image_loader : "fmslideshow_assets/loader_img.png",

        background_fullScreen : false,
        background_move : false,
        background_moveDistance : 1250,    

        buttons_type : 0,
        buttons_autoHide : false,    
        buttons_align : "BC",
        buttons_spacing :"15,0",

        button_nextPrevious_type : 0,
        button_nextPrevious_autoHide : true,

        button_next_align : "RC",
        button_next_spacing : "20,0",
        button_previous_align : "LC",
        button_previous_spacing : "20,0",    

        dotButtons : false,
        button_next_previous : false,

        thumbnails_align : "BC",
        thumbnails_spacing : "-75,0",
        thumb_next_preious_width : 38,

        slideShow : false,
        slideShow_delayTime : 2,

        desktop_drag : true

        default_data_align : "LC",    
        default_data_spacing : "70,0",
        default_data_inOutDirection : "LR",
        default_data_inOutDistance : "60"    

    });
});

Exemple de code de diaporama

 
fmslideshow
Customize Animation
In/Out Direction - Alignment - Spacing

Le document d’aide complet est inclus dans le fichier de téléchargement

Mise à jour le 10-06-2013: Correction d’un bug mineur

Mise à jour le 23-11-2012: Correction d’un bug IE10

Diaporama de la bannière de la page d'accueil jQuery / Visionneuse de produits - 1

Diaporama de la bannière de la page d'accueil jQuery / Visionneuse de produits - 2

Diaporama de la bannière de la page d'accueil jQuery / Visionneuse de produits - 3

Diaporama de la bannière de la page d'accueil jQuery / Visionneuse de produits - 4

Si vous avez des questions sur ce fichier, contactez-moi via ma page de profil.

Diaporama de la bannière de la page d'accueil jQuery / Visionneuse de produits - 5

Découvrez mes autres fichiers:

Diaporama de la bannière de la page d'accueil jQuery / Visionneuse de produits - 6

Diaporama de la bannière de la page d'accueil jQuery / Visionneuse de produits - 7

Diaporama de la bannière de la page d'accueil jQuery / Visionneuse de produits - 8

Diaporama de la bannière de la page d'accueil jQuery / Visionneuse de produits - 9

Diaporama de la bannière de la page d'accueil jQuery / Visionneuse de produits - 10

Diaporama de la bannière de la page d'accueil jQuery / Visionneuse de produits - 11

Diaporama de la bannière de la page d'accueil jQuery / Visionneuse de produits - 12

Diaporama de la bannière de la page d'accueil jQuery / Visionneuse de produits - 13

Diaporama de la bannière de la page d'accueil jQuery / Visionneuse de produits - 14

Diaporama de la bannière de la page d'accueil jQuery / Visionneuse de produits - 15

Diaporama de la bannière de la page d'accueil jQuery / Visionneuse de produits - 16

Diaporama de la bannière de la page d'accueil jQuery / Visionneuse de produits - 17

Diaporama de la bannière de la page d'accueil jQuery / Visionneuse de produits - 18

Consultez mes fichiers Flash:

accordéon-horizontal-vertical-image-texte-animation

Diaporama de la bannière de la page d'accueil jQuery / Visionneuse de produits - 19

Diaporama de la bannière de la page d'accueil jQuery / Visionneuse de produits - 20

Diaporama de la bannière de la page d'accueil jQuery / Visionneuse de produits - 21

carrousel-3-types-image-visionneuse-produit

accordéon-horizontal-vertical-image-texte-animation

Diaporama de la bannière de la page d'accueil jQuery / Visionneuse de produits - 22

Laisser un commentaire