Accueil > Forum > > > > Simple problème bouton 1ER plan javascript
Simple problème bouton 1ER plan javascript
jeudi 10 février 2011 à 10:42:36 |
Simple problème bouton 1ER plan javascript

quinton75
|
Bonjour  
J'ai repris le modele suivant
http://www.ndoherty.biz/demos/coda-slider/2.0/#1
A la place du texte qui defile j'ai intégré des images.
Par contre les boutons de navigation "left"(#coda-nav-left) and "right"(#coda-nav-right) je voudrais les introduire dans l'image (chaque image il y aura deja un lien).
Donc il faudrait que au dessus de chaque image (avec son lien) il y ait à droite et à gauche les boutons de navigations...
Ci-dessous les codes sources:
HTML
Code HTML : ]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
<title>Yellow Korner</title>
<meta http-equiv="Content-Language" content="en-us" />
<meta name="author" content="Niall Doherty" />
<!-- Begin Stylesheets -->
<link rel="stylesheet" href="stylesheets/reset.css" type="text/css" media="screen" />
<link rel="stylesheet" href="stylesheets/coda-slider-2.0.css" type="text/css" media="screen" />
<!-- End Stylesheets -->
<!-- Begin JavaScript -->
<script type="text/javascript" src="javascripts/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="javascripts/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="javascripts/jquery.coda-slider-2.0.js"></script>
<script type="text/javascript">
$().ready(function() {
$('#coda-slider-1').codaSlider();
});
</script>
<!-- End JavaScript -->
</head>
<body class="coda-slider-no-js">
<h1>Yellowkorner</h1>
<noscript>
<div>
<p>Unfortunately your browser does not hava JavaScript capabilities which are required to exploit full functionality of our site. This could be the result of two possible scenarios:</p>
<ol>
<li>You are using an old web browser, in which case you should upgrade it to a newer version. We recommend the latest version of <a
="http://www.getfirefox.com">Firefox</a>.</li>
<li>You have disabled JavaScript in you browser, in which case you will have to enable it to properly use our site. <a href="http://www.google.com/support/bin/answer.py?answer=23852">Learn how to enable JavaScript</a>.</li>
</ol>
</div>
</noscript>
<div class="coda-slider-wrapper">
<div class="coda-slider preload" id="coda-slider-1">
<div class="panel">
<div class="panel-wrapper">
<h2 class="title">1</h2>
<table cellpadding="0" cellspacing="0" border="0"> <tr> <td><div id="Layer1" style="position:absolute; z-index:1"> <img src= "FLECHE-GAUCHE-NON-SELECTIONNE.jpg"/> </div><div id="Layer2" style="position:absolute; z-index:1"> <img src= "FLECHE-DROITE-NON-SELECTIONNE.jpg"/> </div> <img src= "slid-cadre-kourtney_01.jpg" style="border: 0px solid ; display: block" border="0" /></td><td> <a href="http://www.yellowkorner.com"><img src= "slid-cadre-kourtney_02.jpg" style="border: 0px solid ; display: block" border="0"/></a> <td> <a href="http://www.yellowkorner.com"><img src= "slid-cadre-kourtney_03.jpg" style="border: 0px solid ; display: block" border="0"/></a> </td></td></tr></table>
</div>
</div>
<div class="panel">
<div class="panel-wrapper">
<h2 class="title">2</h2>
<a href="http://www.yellowkorner.com"> <img src= "slid-CC-Jorg.jpg"/> </a>
</div>
</div>
<div class="panel">
<div class="panel-wrapper">
<h2 class="title">3</h2>
<a href="http://www.yellowkorner.com"> <img src= "slid-cadre-kourtney.jpg"/></a>
</div>
</div>
</div><!-- .coda-slider -->
</div><!-- .coda-slider-wrapper -->
</body>
</html>
CSS
Code : /*
jQuery Coda-Slider v2.0 - http://www.ndoherty.biz/coda-slider
Copyright (c) 2009 Niall Doherty
This plugin available for use in all personal or commercial projects under both MIT and GPL licenses.
*/
/* Insignificant stuff, for demo purposes */
body { padding: 20px }
.panel h2.title { margin-bottom: 10px }
noscript div { background: #ccc; border: 1px solid #900; margin: 20px 0; padding: 15px }
/* Most common stuff you'll need to change */
.coda-slider-wrapper { padding: 20px 0 }
.coda-slider { background: #ebebeb }
#Layer1 {margin-top: 170px}
#Layer2 {margin-top: 170px; margin-left: 945px}
/* Use this to keep the slider content contained in a box even when JavaScript is disabled */
.coda-slider-no-js .coda-slider { height: 200px; overflow: auto !important; padding-right: 20px }
/* Change the width of the entire slider (without dynamic arrows) */
.coda-slider, .coda-slider .panel { width: 600px }
/* Change margin and width of the slider (with dynamic arrows) */
.coda-slider-wrapper.arrows .coda-slider, .coda-slider-wrapper.arrows .coda-slider .panel { width: 977px }
.coda-slider-wrapper.arrows .coda-slider { margin: 0 10px }
/* Arrow styling */
.coda-nav-left a { background-image: url(images/FLECHE-GAUCHE-NON-SELECTIONNE.jpg); color: #fff; margin-top: 200px; height: 34px;}
.coda-nav-right a { background-image: url(images/FLECHE-DROITE-NON-SELECTIONNE.jpg); color: #fff; margin-top: 200px; height: 34px; }
/* Tab nav */
.coda-nav ul li a.current { background: #39c }
/* Panel padding */
.coda-slider .panel-wrapper { padding: 0px }
/* Preloader */
.coda-slider p.loading { padding: 20px; text-align: center }
/* Don't change anything below here unless you know what you're doing */
/* Tabbed nav */
.coda-nav ul { clear: both; display: block; margin: auto; overflow: hidden }
.coda-nav ul li { display: inline }
.coda-nav ul li a { background: #000; color: #fff; display: block; float: left; margin-right: 1px; padding: 3px 6px; text-decoration: none }
/* Miscellaneous */
.coda-slider-wrapper { clear: both; overflow: auto }
.coda-slider { float: left; overflow: hidden; position: relative }
.coda-slider .panel { display: block; float: left }
.coda-slider .panel-container { position: relative }
.coda-nav-left, .coda-nav-right { float: left }
.coda-nav-left a, .coda-nav-right a { display: block; text-align: center; text-decoration: none }
JAVASCRIPT
Code Javascript : /*
jQuery Coda-Slider v2.0 - http://www.ndoherty.biz/coda-slider
Copyright (c) 2009 Niall Doherty
This plugin available for use in all personal or commercial projects under both MIT and GPL licenses.
*/
$(function(){
// Remove the coda-slider-no-js class from the body
$("body").removeClass("coda-slider-no-js");
// Preloader
$(".coda-slider").children('.panel').hide().end().prepend('<p class="loading">Loading...<br /><img src="images/ajax-loader.gif" alt="loading..." /></p>');
});
var sliderCount = 1;
$.fn.codaSlider = function(settings) {
settings = $.extend({
autoHeight: true,
autoHeightEaseDuration: 1000,
autoHeightEaseFunction: "easeInOutExpo",
autoSlide: false,
autoSlideInterval: 7000,
autoSlideStopWhenClicked: true,
crossLinking: true,
dynamicArrows: true,
dynamicArrowLeftText: "« left",
dynamicArrowRightText: "right »",
dynamicTabs: true,
dynamicTabsAlign: "center",
dynamicTabsPosition: "top",
externalTriggerSelector: "a.xtrig",
firstPanelToLoad: 1,
panelTitleSelector: "h2.title",
slideEaseDuration: 1000,
slideEaseFunction: "easeInOutExpo"
}, settings);
return this.each(function(){
// Uncomment the line below to test your preloader
// alert("Testing preloader");
var slider = $(this);
// If we need arrows
if (settings.dynamicArrows) {
slider.parent().addClass("arrows");
slider.before('<div class="coda-nav-left" id="coda-nav-left-' + sliderCount + '"><a href="#">' + settings.dynamicArrowLeftText + '</a></div>');
slider.after('<div class="coda-nav-right" id="coda-nav-right-' + sliderCount + '"><a href="#">' + settings.dynamicArrowRightText + '</a></div>');
};
var panelWidth = slider.find(".panel").width();
var panelCount = slider.find(".panel").size();
var panelContainerWidth = panelWidth*panelCount;
var navClicks = 0; // Used if autoSlideStopWhenClicked = true
// Surround the collection of panel divs with a container div (wide enough for all panels to be lined up end-to-end)
$('.panel', slider).wrapAll('<div class="panel-container"></div>');
// Specify the width of the container div (wide enough for all panels to be lined up end-to-end)
$(".panel-container", slider).css({ width: panelContainerWidth });
// Specify the current panel.
// If the loaded URL has a hash (cross-linking), we're going to use that hash to give the slider a specific starting position...
if (settings.crossLinking && location.hash && parseInt(location.hash.slice(1)) <= panelCount) {
var currentPanel = parseInt(location.hash.slice(1));
var offset = - (panelWidth*(currentPanel - 1));
$('.panel-container', slider).css({ marginLeft: offset });
// If that's not the case, check to see if we're supposed to load a panel other than Panel 1 initially...
} else if (settings.firstPanelToLoad != 1 && settings.firstPanelToLoad <= panelCount) {
var currentPanel = settings.firstPanelToLoad;
var offset = - (panelWidth*(currentPanel - 1));
$('.panel-container', slider).css({ marginLeft: offset });
// Otherwise, we'll just set the current panel to 1...
} else {
var currentPanel = 1;
};
// Left arrow click
$("#coda-nav-left-" + sliderCount + " a").click(function(){
navClicks++;
if (currentPanel == 1) {
offset = - (panelWidth*(panelCount - 1));
alterPanelHeight(panelCount - 1);
currentPanel = panelCount;
slider.siblings('.coda-nav').find('a.current').removeClass('current').parents('ul').find('li:last a').addClass('current');
} else {
currentPanel -= 1;
alterPanelHeight(currentPanel - 1);
offset = - (panelWidth*(currentPanel - 1));
slider.siblings('.coda-nav').find('a.current').removeClass('current').parent().prev().find('a').addClass('current');
};
$('.panel-container', slider).animate({ marginLeft: offset }, settings.slideEaseDuration, settings.slideEaseFunction);
if (settings.crossLinking) { location.hash = currentPanel }; // Change the URL hash (cross-linking)
return false;
});
// Right arrow click
$('#coda-nav-right-' + sliderCount + ' a').click(function(){
navClicks++;
if (currentPanel == panelCount) {
offset = 0;
currentPanel = 1;
alterPanelHeight(0);
slider.siblings('.coda-nav').find('a.current').removeClass('current').parents('ul').find('a:eq(0)').addClass('current');
} else {
offset = - (panelWidth*currentPanel);
alterPanelHeight(currentPanel);
currentPanel += 1;
slider.siblings('.coda-nav').find('a.current').removeClass('current').parent().next().find('a').addClass('current');
};
$('.panel-container', slider).animate({ marginLeft: offset }, settings.slideEaseDuration, settings.slideEaseFunction);
if (settings.crossLinking) { location.hash = currentPanel }; // Change the URL hash (cross-linking)
return false;
});
// If we need a dynamic menu
if (settings.dynamicTabs) {
var dynamicTabs = '<div class="coda-nav" id="coda-nav-' + sliderCount + '"><ul></ul></div>';
switch (settings.dynamicTabsPosition) {
case "bottom":
slider.parent().append(dynamicTabs);
break;
default:
slider.parent().prepend(dynamicTabs);
break;
};
ul = $('#coda-nav-' + sliderCount + ' ul');
// Create the nav items
$('.panel', slider).each(function(n) {
ul.append('<li class="tab' + (n+1) + '"><a href="#' + (n+1) + '">' + $(this).find(settings.panelTitleSelector).text() + '</a></li>');
});
navContainerWidth = slider.width() + slider.siblings('.coda-nav-left').width() + slider.siblings('.coda-nav-right').width();
ul.parent().css({ width: navContainerWidth });
switch (settings.dynamicTabsAlign) {
case "center":
ul.css({ width: ($("li", ul).width() + 2) * panelCount });
break;
case "right":
ul.css({ float: 'right' });
break;
};
};
// If we need a tabbed nav
$('#coda-nav-' + sliderCount + ' a').each(function(z) {
// What happens when a nav link is clicked
$(this).bind("click", function() {
navClicks++;
$(this).addClass('current').parents('ul').find('a').not($(this)).removeClass('current');
offset = - (panelWidth*z);
alterPanelHeight(z);
currentPanel = z + 1;
$('.panel-container', slider).animate({ marginLeft: offset }, settings.slideEaseDuration, settings.slideEaseFunction);
if (!settings.crossLinking) { return false }; // Don't change the URL hash unless cross-linking is specified
});
});
// External triggers (anywhere on the page)
$(settings.externalTriggerSelector).each(function() {
// Make sure this only affects the targeted slider
if (sliderCount == parseInt($(this).attr("rel").slice(12))) {
$(this).bind("click", function() {
navClicks++;
targetPanel = parseInt($(this).attr("href").slice(1));
offset = - (panelWidth*(targetPanel - 1));
alterPanelHeight(targetPanel - 1);
currentPanel = targetPanel;
// Switch the current tab:
slider.siblings('.coda-nav').find('a').removeClass('current').parents('ul').find('li:eq(' + (targetPanel - 1) + ') a').addClass('current');
// Slide
$('.panel-container', slider).animate({ marginLeft: offset }, settings.slideEaseDuration, settings.slideEaseFunction);
if (!settings.crossLinking) { return false }; // Don't change the URL hash unless cross-linking is specified
});
};
});
// Specify which tab is initially set to "current". Depends on if the loaded URL had a hash or not (cross-linking).
if (settings.crossLinking && location.hash && parseInt(location.hash.slice(1)) <= panelCount) {
$("#coda-nav-" + sliderCount + " a:eq(" + (location.hash.slice(1) - 1) + ")").addClass("current");
// If there's no cross-linking, check to see if we're supposed to load a panel other than Panel 1 initially...
} else if (settings.firstPanelToLoad != 1 && settings.firstPanelToLoad <= panelCount) {
$("#coda-nav-" + sliderCount + " a:eq(" + (settings.firstPanelToLoad - 1) + ")").addClass("current");
// Otherwise we must be loading Panel 1, so make the first tab the current one.
} else {
$("#coda-nav-" + sliderCount + " a:eq(0)").addClass("current");
};
// Set the height of the first panel
if (settings.autoHeight) {
panelHeight = $('.panel:eq(' + (currentPanel - 1) + ')', slider).height();
slider.css({ height: panelHeight });
};
// Trigger autoSlide
if (settings.autoSlide) {
slider.ready(function() {
setTimeout(autoSlide,settings.autoSlideInterval);
});
};
function alterPanelHeight(x) {
if (settings.autoHeight) {
panelHeight = $('.panel:eq(' + x + ')', slider).height()
slider.animate({ height: panelHeight }, settings.autoHeightEaseDuration, settings.autoHeightEaseFunction);
};
};
function autoSlide() {
if (navClicks == 0 || !settings.autoSlideStopWhenClicked) {
if (currentPanel == panelCount) {
var offset = 0;
currentPanel = 1;
} else {
var offset = - (panelWidth*currentPanel);
currentPanel += 1;
};
alterPanelHeight(currentPanel - 1);
// Switch the current tab:
slider.siblings('.coda-nav').find('a').removeClass('current').parents('ul').find('li:eq(' + (currentPanel - 1) + ') a').addClass('current');
// Slide:
$('.panel-container', slider).animate({ marginLeft: offset }, settings.slideEaseDuration, settings.slideEaseFunction);
setTimeout(autoSlide,settings.autoSlideInterval);
};
};
// Kill the preloader
$('.panel', slider).show().end().find("p.loading").remove();
slider.removeClass("preload");
sliderCount++;
});
};
|
|
jeudi 10 février 2011 à 16:00:19 |
Re : Simple problème bouton 1ER plan javascript

dvwyns
|
Salut,
Si j'ai bien compris, tu veux que les boutons défilent avec les images se trouvant dans le slideshow.
Tu peux faire ça en mettant:
la class panel en "position:relative" et tu mets dans le div de chaque panel le div contenant les boutons, ces derniers auront "position:absolute;left:0px;top:0px;z-index:2;" pour le bouton de gauche et "position:absolute;right:0px;top:0px;z-index:2;" pour le bouton de droite
Je me base sur le code de la page ou tu as été cherché ce slideshow.
Dvwyns
|
|
jeudi 10 février 2011 à 16:19:02 |
Re : Simple problème bouton 1ER plan javascript

quinton75
|
Merci de ta réponse  ....
Ou ça dans le html?? car il n'y pas pas le bouton sur le html cf le code ci-dessus....
Les boutons sont suelement mentionnées dans le javascript : exemple bouton gauchee
" Left arrow click
$("#coda-nav-left-"
Il se trouve dans le javascript
Et sinon non, en fait je voudrais que les boutons de navigation restent
|
|
jeudi 10 février 2011 à 16:51:02 |
Re : Simple problème bouton 1ER plan javascript

dvwyns
|
Réponse acceptée !
Salut,
Je te propose de mettre dans le setting javascript "dynamicArrows: false"
Et de mettre dans l'html "<div class="coda-nav-left" id="coda-nav-left-4"><a href="#">« left</a></div>" pour le bouton de gauche.
Et
"<div class="coda-nav-right" id="coda-nav-right-2"><a href="#">right »</a></div>" pour le bouton de droite.
Les numéros qui se trouvent dans les id correspondent pour le bouton de gauche au 4eme slide et pour le bouton de droite au 2eme slide (on imagine qu'on est sur le premier slide)
Donc mtn avec les codes ci-dessus tu pourras utiliser les conseils que je t'ai fourni juste avant.
Dvwyns
|
|
vendredi 11 février 2011 à 15:10:03 |
Re : Simple problème bouton 1ER plan javascript

quinton75
|
ou est ce que je mets "<div class="coda-nav-left" id="coda-nav-left-4"><a href="#">« left</a></div>"
|
|
mardi 15 février 2011 à 15:33:03 |
Re : Simple problème bouton 1ER plan javascript

dvwyns
|
Salut,
Sorry, ai pas eu bcp de temps ce weekend.
Mais bon, si tu as accepté ma réponse, j'imagine que tu as su décrypter mes commentaires ^^
N'hésites pas à mettre ton code pour les autres.
Dvwyns
|
|
Cette discussion est classée dans : panel, nav, slider, settings, coda
Répondre à ce message
Sujets en rapport avec ce message
Coda Slider Jquery Javascipt/CSS [ par mamsk00 ]
Bonjour, j'aimerais modifier " Coda Slider "(http://www.ndoherty.biz/demos/coda-slider/1.0/). Je me perd un peu dans le code et je ne vois vraiment
problèmes coda-slider [ par mariestad ]
Bonjour! J'ai des problèmes avec mon slider javascript fait à l'aide de: http://www.ndoherty.biz/demos/coda-slider/2.0/ Je ne sais pas ce que j'ai f
Featured content slider [ par zecka1213 ]
Bonjour j'ai télécharger ce script. http://css-tricks.com/creating-a-slick-auto-playing-featured-content-slider/ Tout fonctionne. Mais je n'arrive pa
récupération du title en javascript [ par slashf ]
salut à tous, voilà j'ai un petit problème au niveau de mon javascript, j'ai un code qui affiche la taille réelle d'une image après un clic sur la min
Timer sur slider js [ par quinton75 ]
Bonjour[^^clinoeil1][^^clinoeil1][^^clinoeil1][^^clinoeil1] Je souhaite faire defiler mes photos avec un timer de 3 secondes par exemple...Pour le mo
Intervalle de temps en defilement photo javascript [ par quinton75 ]
Bonjour Je n'arrive pas à faire defiler mes photos avec un timer de 3 secondes par exemple.Je suppose qu'il faut que j'utilise un set timeout ou set
Intégrer un timer dans un slieshow [ par quinton75 ]
Bonjour [^^clinoeil1][^^clinoeil1] Je ne m'y connais pas du tout en js donc malgré divers tuto de slideshow je rame Je souhaite faire defiler mes ph
slider [ par guilstunt ]
Bonjour a tous je suis entrain de créer une slide barre. Jusque la j'ai réussi, j'arrive aussi a enregistrer la valeur dans ma BDD. Mon probleme c'e
La valeur d'un slider [ par asmagh ]
Bonjour, J'utilise le framework Ext Js depuis peu de temps et j'aimerai récupérer la valeur d'un slider dans un champ de texte. Quelqu'un pourrait m'
Problème de compatibilité avec un slider [ par quentinus95 ]
Bonjour ! Ne sachant coder en javascript, je me permet de vous demander un peu d'aide. J'ai un slider sur la page d'accueil de mon site (www.qandb-po
Livres en rapport
|
Derniers Blogs
POUR RAPPEL ! LES SPéCIFICATIONS DES PROTOCOLES OFFICE ET SHAREPOINT SONT DISPONIBLES SUR MSDNPOUR RAPPEL ! LES SPéCIFICATIONS DES PROTOCOLES OFFICE ET SHAREPOINT SONT DISPONIBLES SUR MSDN par neodante
Quelle est le point commun entre : Microsoft il y a 10 ans et Apple aujourd'hui ? Réponse: avoir une politique de protocoles propriétaires et fermés :) Car pour rappel (si si je vous assure c'est important de le rappeler), la majorité des spécifications e...
Cliquez pour lire la suite de l'article par neodante JOYEUX ANNIVERSAIRE NIXJOYEUX ANNIVERSAIRE NIX par ebartsoft
Souhaitons un bon et joyeux anniversaire à notre hôte à tous, Nix.
Je ne le répéterais jamais assez mais sans lui rien ne serait possible. Il défit en permanence les lois de la gravité et comme il le dit si bien, si tu lui fais confiance ça devra...
Cliquez pour lire la suite de l'article par ebartsoft IMAGINE CUP 2012, MAKE A SIGN EN FINALEIMAGINE CUP 2012, MAKE A SIGN EN FINALE par junarnoalg
Voilà qui est fait, la nouvelle est officielle ! L'équipe belge "Make a Sign" va au pays des kangourous défendre son projet dans la catégorie Software Design. http://www.imaginecup.com/CompetitionsContent/Competition/WorldwideFinalists.aspx V...
Cliquez pour lire la suite de l'article par junarnoalg KINECT 1.5 IS OUT !KINECT 1.5 IS OUT ! par Vko
La version 1.5 du Kinect For Microsoft vient tout juste de sortir ! Plein de nouveautés: Tracking de squelette en Near Mode Détection en position assise Détection faciale avec un SDK dédié Documentation et des guideline (enfin) Un out...
Cliquez pour lire la suite de l'article par Vko LES ACTUALITéS DE LA SEMAINE SUR C2I.FR (14 MAI - 20 MAI) LES ACTUALITéS DE LA SEMAINE SUR C2I.FR (14 MAI - 20 MAI) par richardc
Mise à jour des Web API du 14 Mai
Réservez dès maintenant votre journée du 20 juin pour le Windows Azure Dev Camp 2012 à Paris
Mise à jour de Team Foundation Service
MechCommander 2 sur Windows 8
Entity Framework 5 Release Candidate e...
Cliquez pour lire la suite de l'article par richardc
Logiciels
sDEVIS-FACTURES vlPRO (8.1.0.3)SDEVIS-FACTURES VLPRO (8.1.0.3)sDEVIS-FACTURES vlPRO a été mis au point pour les particuliers, créateurs, entrepreneurs, artisa... Cliquez pour télécharger sDEVIS-FACTURES vlPRO 974 Application Server (12.2.4.6)974 APPLICATION SERVER (12.2.4.6)Développez de puissantes applications dans un environnement de 'cloud computing', clusterisé, séc... Cliquez pour télécharger 974 Application Server vPicture (1.4.2.1)VPICTURE (1.4.2.1)Avec vPicture, hébergez vos images facilement et rapidement.
vPicture est un utilitaire simple, ... Cliquez pour télécharger vPicture Easy-Planning (2.2.1.6)EASY-PLANNING (2.2.1.6)Easy-Planning permet de créer des plannings sous la représentation de diagrammes et est adapté au... Cliquez pour télécharger Easy-Planning COM-BACKUP (2.0)COM-BACKUP (2.0)
COM-BACKUP est un logiciel de sauvegarde qui permet de planifier les sauvegardes de vos dossiers ...
Cliquez pour télécharger COM-BACKUP
|