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 :

Animation d'un carrousel


Sujet :

jQuery

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Futur Membre du Club
    Homme Profil pro
    infographiste
    Inscrit en
    Septembre 2011
    Messages
    3
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : infographiste
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Septembre 2011
    Messages : 3
    Par défaut Animation d'un carrousel
    Bonjour,

    je suis tout nouveau dans l'utilisation de javascript. J'ai trouvé un bout de code pas mal que j'ai reussi a modifier. et la depuis une semaine je seche...
    Actuellement les photos sont cote a cote et on ne voit qu'une partie de l'image et onmousever elle bouge on les voient en totalité. Mais j'aimerais qu'on voit la totalité de l'image1
    j'essaye deseperement de faire en sorte que mon visuel1 s'affiche en premier et que les evenements de souris fasse le reste apres et bing impossible pouvez vous m'aider.
    vous pouvez voir l'animation http://www.jechercheuneimprimerie.com

    merci d'avance
    voici le code :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    jQuery(function () {
    	//Hides the Slide Images and Panel Texts for Preloading
    	jQuery('.slideimage').hide('background', '#000')();
     
    	jQuery('.slide-minicaption').hide();
    	jQuery('.slide-minicaptiontitle').hide();
    	jQuery('.slidecaption').hide();
    	jQuery('.slidecaptiontitle').hide();
     
    	var slidenos = jQuery('.slideimage').length;
     
    });
     
    var i;
     
    jQuery(window).bind("load", function() {
     
    	//Preload
     
    	var slidenos = jQuery('.slideimage').length;
     
    		jQuery('.slideimage:hidden').fadeIn(800);
     
     
     
    		jQuery(".kwicks.horizontal li").css('background', '#000');
     
     
    		jQuery('.slide-minicaption').hide();
    		jQuery('.slide-minicaptiontitle').hide();
    		jQuery('.slidecaption').hide();
    		jQuery('.slidecaptiontitle').hide();
     
    		jQuery('.kwicks').kwicks({
    			max : 850,
    			spacing : 0
    		});
     
     
     
    });
     
    jQuery(function(){
     
    	//Hide all Captions and Mini Captions
    	jQuery(".slidecaption").fadeTo(1, 0);
    	jQuery(".slide-minicaption").fadeTo(1, 0.8);
     
     
    	//On hover of a Kwick Panel
    	//The Following Block is repeated for every Kwick Panel added
    	//Basically It Hide the mini captions - Shows the hovered Panel with Full Caption and Fades the rest.
    	//On Mouse Out it resets things back with mini captions
    	//If you Add another Panel Simply Duplicate this block with additional kwickblock#
    	jQuery('#kwickblock1').hover(function() {
    		jQuery(".slide-minicaption").stop().fadeTo("fast", 0);	// Hide Mini Caption
    		jQuery('#kwickblock1 .slidecaption').stop().fadeTo("slow", 0.8);	// Show Fullcaption
    		jQuery("#kwickblock1 .slideimage").stop().fadeTo("slow", 1);	// Show Image in without transparency
    		jQuery("#kwickblock2 .slideimage,#kwickblock3 .slideimage,#kwickblock4 .slideimage,#kwickblock5 .slideimage,#kwickblock6 .slideimage").stop().fadeTo("slow", 0.3);	// Fade the rest of the kwich panels
    	},function(){
    		jQuery('.slidecaption').stop().fadeTo("slow", 0);	// Hide fullcaption on mouse out
    		jQuery(".slide-minicaption").stop().fadeTo("slow", 0.8);	// Show minicaption
    		jQuery(".slideimage").stop().fadeTo("slow", 1);	// Show all kwicks wihout transparency again
    	});	
    	jQuery('#kwickblock2').hover(function() {
    		jQuery(".slide-minicaption").stop().fadeTo("slow", 0);
    		jQuery('#kwickblock2 .slidecaption').stop().fadeTo("slow", 0.8);
    		jQuery("#kwickblock2 .slideimage").stop().fadeTo("slow", 1);
    		jQuery("#kwickblock1 .slideimage,#kwickblock3 .slideimage,#kwickblock4 .slideimage,#kwickblock5 .slideimage,#kwickblock6 .slideimage").stop().fadeTo("slow", 0.3);
    	},function(){
    		jQuery('.slidecaption').stop().fadeTo("slow", 0);
    		jQuery(".slide-minicaption").stop().fadeTo("slow", 0.8);
    		jQuery(".slideimage").stop().fadeTo("slow", 1);	
    	});
     
    	jQuery('#kwickblock3').hover(function() {
    		jQuery(".slide-minicaption").stop().fadeTo("slow", 0);
    		jQuery('#kwickblock3 .slidecaption').stop().fadeTo("slow", 0.8);
    		jQuery("#kwickblock3 .slideimage").stop().fadeTo("slow", 1);
    		jQuery("#kwickblock1 .slideimage,#kwickblock2 .slideimage,#kwickblock4 .slideimage,#kwickblock5 .slideimage,#kwickblock6 .slideimage").stop().fadeTo("slow", 0.3);
    	},function(){
    		jQuery('.slidecaption').stop().fadeTo("slow", 0);
    		jQuery(".slide-minicaption").stop().fadeTo("slow", 0.8);
    		jQuery(".slideimage").stop().fadeTo("slow", 1);	
    	});
     
    	jQuery('#kwickblock4').hover(function() {
    		jQuery(".slide-minicaption").stop().fadeTo("slow", 0);
    		jQuery('#kwickblock4 .slidecaption').stop().fadeTo("slow", 0.8);
    		jQuery("#kwickblock4 .slideimage").stop().fadeTo("slow", 1);
    		jQuery("#kwickblock1 .slideimage,#kwickblock2 .slideimage,#kwickblock3 .slideimage,#kwickblock5 .slideimage,#kwickblock6 .slideimage").stop().fadeTo("slow", 0.3);
    	},function(){
    		jQuery('.slidecaption').stop().fadeTo("slow", 0);
    		jQuery(".slide-minicaption").stop().fadeTo("slow", 0.8);
    		jQuery(".slideimage").stop().fadeTo("slow", 1);
    	});
     
     
    	jQuery('#kwickblock5').hover(function() {
    		jQuery(".slide-minicaption").stop().fadeTo("slow", 0);
    		jQuery('#kwickblock5 .slidecaption').stop().fadeTo("slow", 0.8);
    		jQuery("#kwickblock5 .slideimage").stop().fadeTo("slow", 1);
    		jQuery("#kwickblock1 .slideimage,#kwickblock2 .slideimage,#kwickblock3 .slideimage,#kwickblock4 .slideimage,#kwickblock6 .slideimage").stop().fadeTo("slow", 0.3);
    	},function(){
    		jQuery('.slidecaption').stop().fadeTo("slow", 0);
    		jQuery(".slide-minicaption").stop().fadeTo("slow", 0.8);
    		jQuery(".slideimage").stop().fadeTo("slow", 1);
    			});
     
    	jQuery('#kwickblock6').hover(function() {
    		jQuery(".slide-minicaption").stop().fadeTo("slow", 0);
    		jQuery('#kwickblock6 .slidecaption').stop().fadeTo("slow", 0.8);
    		jQuery("#kwickblock6 .slideimage").stop().fadeTo("slow", 1);
    		jQuery("#kwickblock1 .slideimage,#kwickblock2 .slideimage,#kwickblock3 .slideimage,#kwickblock4 .slideimage,#kwickblock5 .slideimage").stop().fadeTo("slow", 0.3);
    	},function(){
    		jQuery('.slidecaption').stop().fadeTo("slow", 0);
    		jQuery(".slide-minicaption").stop().fadeTo("slow", 0.8);
    		jQuery(".slideimage").stop().fadeTo("slow", 1);
    });
    	});

  2. #2
    Membre éprouvé

    Profil pro
    Inscrit en
    Juillet 2006
    Messages
    1 448
    Détails du profil
    Informations personnelles :
    Localisation : Belgique

    Informations forums :
    Inscription : Juillet 2006
    Messages : 1 448
    Par défaut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
     
    	à remplacer :
    	//Hide all Captions and Mini Captions
    	jQuery(".slidecaption").fadeTo(1, 0);
    	jQuery(".slide-minicaption").fadeTo(1, 0.8);
     
    	par :
     
    jQuery(".slide-minicaption").stop().fadeTo("fast", 0);	// Hide Mini Caption
    		jQuery('#kwickblock1 .slidecaption').stop().fadeTo("slow", 0.8);	// Show Fullcaption
    		jQuery("#kwickblock1 .slideimage").stop().fadeTo("slow", 1);	// Show Image in without transparency
    		jQuery("#kwickblock2 .slideimage,#kwickblock3 .slideimage,#kwickblock4 .slideimage,#kwickblock5 .slideimage,#kwickblock6 .slideimage").stop().fadeTo("slow", 0.3);	// Fade the rest of the kwich panels
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    
    jQuery('#kwickblockxxx').hover(function() {
    		code à garder
    	},function(){
    		code a remplacer par :
    
    jQuery(".slide-minicaption").stop().fadeTo("fast", 0);	// Hide Mini Caption
    		jQuery('#kwickblock1 .slidecaption').stop().fadeTo("slow", 0.8);	// Show Fullcaption
    		jQuery("#kwickblock1 .slideimage").stop().fadeTo("slow", 1);	// Show Image in without transparency
    		jQuery("#kwickblock2 .slideimage,#kwickblock3 .slideimage,#kwickblock4 .slideimage,#kwickblock5 .slideimage,#kwickblock6 .slideimage").stop().fadeTo("slow", 0.3);	// Fade the rest of the kwich panels
     
    	});

  3. #3
    Futur Membre du Club
    Homme Profil pro
    infographiste
    Inscrit en
    Septembre 2011
    Messages
    3
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : infographiste
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Septembre 2011
    Messages : 3
    Par défaut Animation d'un carrousel
    Merci beaucoup pour ta reponse j'ai essayé mais ca ne marche pas...il reste comme avant...j'ai peut etre fais une mauvaise manip....je ne sais pas....

  4. #4
    Rédacteur

    Avatar de danielhagnoul
    Homme Profil pro
    Étudiant perpétuel
    Inscrit en
    Février 2009
    Messages
    6 389
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant perpétuel
    Secteur : Enseignement

    Informations forums :
    Inscription : Février 2009
    Messages : 6 389
    Billets dans le blog
    125
    Par défaut
    Bonjour

    Je ne connais pas "kwicks", mais un coup d'oeil sur la documentation montre qu'il existe un paramètre "sticky" qu'il suffirait de passer à "true" au lieu de "false" sa valeur par défaut.

    Voir : http://www.jeremymartin.name/project...project=kwicks

    Blog

    Sans l'analyse et la conception, la programmation est l'art d'ajouter des bogues à un fichier texte vide.
    (Louis Srygley : Without requirements or design, programming is the art of adding bugs to an empty text file.)

  5. #5
    Futur Membre du Club
    Homme Profil pro
    infographiste
    Inscrit en
    Septembre 2011
    Messages
    3
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : infographiste
    Secteur : Communication - Médias

    Informations forums :
    Inscription : Septembre 2011
    Messages : 3
    Par défaut
    trop fort....ca marche ...j'y crois pas...merci merci merci du premier coup...j'en reviens pas....

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Animation de texte sur des images d'un carrousel
    Par Paul Reed Smith dans le forum jQuery
    Réponses: 6
    Dernier message: 27/01/2014, 17h11
  2. Animation de carrousel
    Par ronley dans le forum Général JavaScript
    Réponses: 0
    Dernier message: 11/01/2011, 19h11
  3. [Composants][Animation] Lire une vidéo compressée
    Par femtosa dans le forum Composants VCL
    Réponses: 6
    Dernier message: 03/09/2002, 08h03
  4. Rx Controls Gif animés
    Par toufou dans le forum Composants VCL
    Réponses: 6
    Dernier message: 23/08/2002, 14h09
  5. Passage de parametre a une anim Flash 5
    Par debug dans le forum Intégration
    Réponses: 4
    Dernier message: 03/06/2002, 17h59

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