Carousel

Fermé

fdawch Messages postés 51 Date d'inscription mardi 2 septembre 2014 Statut Membre Dernière intervention 1 mai 2018 - 28 déc. 2017 à 12:33
fdawch Messages postés 51 Date d'inscription mardi 2 septembre 2014 Statut Membre Dernière intervention 1 mai 2018 - 8 févr. 2018 à 13:33

Bonjour

SVP je veux faire deux carousel dans une page.
vous trouverez mon code, merci bien de me guider pour le corrige.

Cordialement

<?php
@session_start();

$cnx = @mysql_connect( "localhost", "root", "" );
$db= @mysql_select_db( "cneree" );
$sql = "SELECT * FROM partners ORDER BY id_partners	";
$requete = @mysql_query( $sql, $cnx ) or die( "ERREUR MYSQL numéro: ".mysql_errno()."<br>Type de cette erreur: ".mysql_error()."<br>\n" );
?>

<!doctype html>
<html>
<head>
        <meta charset="utf-8">
        <!-- Bootstrap core CSS -->
        <link href="public/website/theme-1/css/bootstrap.min.css" rel="stylesheet">
        <!-- Custom styles for this template -->
        <link href="public/website/theme-1/css/main.css"   rel="stylesheet">
    </head>

<body style="background-color: #EBEBEB">
<section id="partners">
	<div class="bloc-slide-annonce bg-7">
           <div class="main text-center">
                <h1 style="font-family: Tungsten-Medium; font-size: 30px;">Nos partenaires</h1>
            </div>
            <br><br>
            <div class="slide-annonce">     
                   <?php
					while( $result = mysql_fetch_array( $requete ) )
					{
					 ?>
                        <a href="<?php echo($result["lien"]."\n" ); ?>"><?php echo '<div align=\"center\"><img src="gestion/upload/partenaires/' .$result["image"].'"></div>';?> </a>
                   <?php } ?>     
            </div>
                  <br><br> 
        </div>
</section> <br><br>

 <section id="partners">
	<div class="bloc-slide-annonce bg-7">
           <div class="main text-center">
                <h1 style="font-family: Tungsten-Medium; font-size: 30px;">Nos partenaires</h1>
            </div>
            <br><br>
            <div class="slide-annonce">     
                   <?php
					while( $result = mysql_fetch_array( $requete ) )
					{
					 ?>
                        <a href="<?php echo($result["lien"]."\n" ); ?>"><?php echo '<div align=\"center\"><img src="gestion/upload/partenaires/' .$result["image"].'"></div>';?> </a>
                   <?php } ?>     
            </div>
                  <br><br> 
        </div>
</section>  
</body>

        <!-- jquery marquee -->
        <script type="text/javascript" src="public/website/theme-1/js/jquery.marquee.js"></script>
        <script>
            /* Slide annonce */
            var $mq = $('.slide-annonce').marquee({
                        duration: 10000,
                        gap: 50,
                        delayBeforeStart: 0,
                        direction: 'left',
                        duplicated: true
                    });
            // Pause
            $('.slide-annonce').mouseover(function(){
              $mq.marquee('pause');
            });
            // Resume
            $('.slide-annonce').mouseout(function(){
              $mq.marquee('resume');
            }); 
        </script> 

</html>

A voir également:

Désactiver carousel xiaomi
Desactiver instagram - Guide
Fond d'écran carousel xiaomi - Forum Xiaomi
Désactiver onedrive - Guide
Desactiver windows defender - Guide
Son bluetooth faible xiaomi - Forum Mobile

3 réponses

Réponse 1 / 3

totodunet Messages postés 1377 Date d'inscription mercredi 18 mars 2009 Statut Membre Dernière intervention 5 mars 2020 199
28 déc. 2017 à 15:28

salut,

as-tu debuguer pour voir exactement où se situe le problème ? Les liens et nom de tes images sont-ils bien reçues ? probleme de code JS ? probleme dans les boucles d'affichage des resultats SQL ?

Réponse 2 / 3

jordane45 Messages postés 38138 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 17 avril 2024 4 649
28 déc. 2017 à 17:47

Bonjour,

Avant tout.... Attention, l'extension mysql était obsolète en PHP 5.5.0, et a été supprimée en PHP 7.0.0.
https://www.commentcamarche.net/faq/43261-php-l-extension-mysql-est-obsolete#top

À la place, tu peux (<gras DOIS </gras> ) utiliser l'extension MySQLi ou l'extension PDO_MySQL
https://www.commentcamarche.net/faq/44117-connexion-a-une-base-avec-pdo-mysqli

Si tu choisis PDO, pense à activer la gestion des erreurs : https://forums.commentcamarche.net/forum/affich-37584941-php-pdo-gerer-les-erreurs

fdawch Messages postés 51 Date d'inscription mardi 2 septembre 2014 Statut Membre Dernière intervention 1 mai 2018 1
30 déc. 2017 à 16:28

Bonjour jordane45

je ne sais pas ou es le problème, je veux quel soit carrousel dynamique comme ce exemple
https://bootsnipp.com/snippets/kE4g

Cordialement

jordane45 Messages postés 38138 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 17 avril 2024 4 649 > fdawch Messages postés 51 Date d'inscription mardi 2 septembre 2014 Statut Membre Dernière intervention 1 mai 2018
30 déc. 2017 à 17:47

Oui oui.... mais .... commence donc pas appliquer les changements que je t'ai indiqué ... et si le souci persiste revient nous voir avec ton code corrigé.

fdawch Messages postés 51 Date d'inscription mardi 2 septembre 2014 Statut Membre Dernière intervention 1 mai 2018 1
2 janv. 2018 à 14:07

Je crois que le problème dans la boucle while, et je sais pas comment le corrige

Comme indiqué dans mon message précédent :

revient nous voir avec ton code corrigé

Autrement-dit .... colles nous ton code (en l'ayant modifié pour tenir compte de nos précédentes remarques avant bien entendu...)

NB : Pour poster du code sur le forum.. merci d'utiliser la coloration syntaxique (les balises de code).
Explications disponibles ici : https://codes-sources.commentcamarche.net/faq/10686-le-nouveau-codes-sources-comment-ca-marche#balises-code

fdawch Messages postés 51 Date d'inscription mardi 2 septembre 2014 Statut Membre Dernière intervention 1 mai 2018 1
4 janv. 2018 à 12:26

Bonjour jordane45
Vous trouverez le code html souhaité et le code php erroné
Merci beaucouq de votre aide

HTML Code

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Document sans titre</title>
<style>
/* carousel */
.media-carousel 
{
  margin-bottom: 0;
  padding: 0 40px 30px 40px;
  margin-top: 30px;
}
/* Previous button  */
.media-carousel .carousel-control.left 
{
  left: -12px;
  background-image: none;
  background: none repeat scroll 0 0 #222222;
  border: 4px solid #FFFFFF;
  border-radius: 23px 23px 23px 23px;
  height: 40px;
  width : 40px;
  margin-top: 30px
}
/* Next button  */
.media-carousel .carousel-control.right 
{
  right: -12px !important;
  background-image: none;
  background: none repeat scroll 0 0 #222222;
  border: 4px solid #FFFFFF;
  border-radius: 23px 23px 23px 23px;
  height: 40px;
  width : 40px;
  margin-top: 30px
}
/* Changes the position of the indicators */
.media-carousel .carousel-indicators 
{
  right: 50%;
  top: auto;
  bottom: 0px;
  margin-right: -19px;
}
/* Changes the colour of the indicators */
.media-carousel .carousel-indicators li 
{
  background: #c0c0c0;
}
.media-carousel .carousel-indicators .active 
{
  background: #333333;
}
.media-carousel img
{
  width: 250px;
  height: 100px
}
/* End carousel */	
</style>

<script>
$(document).ready(function() {
  $('#media').carousel({
    pause: true,
    interval: false,
  });
});	
</script>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>

<body>
<div class="container">
  <div class='row'>
    <div class='col-mda-8'>
      <div class="carousel slide media-carousel" id="media">
        <div class="carousel-inner">
          <div class="item  active">
            <div class="row">
              <div class="col-md-2">
                <a class="thumbnail" href="#"><img alt="" src="http://placehold.it/150x150"></a>
              </div>          
              <div class="col-md-2">
                <a class="thumbnail" href="#"><img alt="" src="http://placehold.it/150x150"></a>
              </div>
              <div class="col-md-2">
                <a class="thumbnail" href="#"><img alt="" src="http://placehold.it/150x150"></a>
              </div>
              <div class="col-md-2">
                <a class="thumbnail" href="#"><img alt="" src="http://placehold.it/150x150"></a>
              </div>
              <div class="col-md-2">
                <a class="thumbnail" href="#"><img alt="" src="http://placehold.it/150x150"></a>
              </div>  
              <div class="col-md-2">
                <a class="thumbnail" href="#"><img alt="" src="http://placehold.it/150x150"></a>
              </div>            
            </div>
          </div>
          <div class="item">
            <div class="row">
              <div class="col-md-2">
                <a class="thumbnail" href="#"><img alt="" src="http://placehold.it/150x150"></a>
              </div>          
              <div class="col-md-2">
                <a class="thumbnail" href="#"><img alt="" src="http://placehold.it/150x150"></a>
              </div>
              <div class="col-md-2">
                <a class="thumbnail" href="#"><img alt="" src="http://placehold.it/150x150"></a>
              </div>
              <div class="col-md-2">
                <a class="thumbnail" href="#"><img alt="" src="http://placehold.it/150x150"></a>
              </div>
              <div class="col-md-2">
                <a class="thumbnail" href="#"><img alt="" src="http://placehold.it/150x150"></a>
              </div>  
              <div class="col-md-2">
                <a class="thumbnail" href="#"><img alt="" src="http://placehold.it/150x150"></a>
              </div>            
            </div>
          </div>
        </div>
        <a data-slide="prev" href="#media" class="left carousel-control">‹</a>
        <a data-slide="next" href="#media" class="right carousel-control">›</a>
      </div>                          
    </div>
  </div>
  
  
</div>
</body>
</html>

PHP Code

<?php
@session_start();
$cnx = @mysql_connect( "localhost", "root", "" );
$db= @mysql_select_db( "name" );
$sql = "SELECT * FROM partners ORDER BY id_partners	";
$requete = @mysql_query( $sql, $cnx ) or die( "ERREUR MYSQL numéro: ".mysql_errno()."<br>Type de cette erreur: ".mysql_error()."<br>\n" );
?>

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Document sans titre</title>
<style>
/* carousel */
.media-carousel 
{
  margin-bottom: 0;
  padding: 0 40px 30px 40px;
  margin-top: 30px;
}
/* Previous button  */
.media-carousel .carousel-control.left 
{
  left: -12px;
  background-image: none;
  background: none repeat scroll 0 0 #222222;
  border: 4px solid #FFFFFF;
  border-radius: 23px 23px 23px 23px;
  height: 40px;
  width : 40px;
  margin-top: 30px
}
/* Next button  */
.media-carousel .carousel-control.right 
{
  right: -12px !important;
  background-image: none;
  background: none repeat scroll 0 0 #222222;
  border: 4px solid #FFFFFF;
  border-radius: 23px 23px 23px 23px;
  height: 40px;
  width : 40px;
  margin-top: 30px
}
/* Changes the position of the indicators */
.media-carousel .carousel-indicators 
{
  right: 50%;
  top: auto;
  bottom: 0px;
  margin-right: -19px;
}
/* Changes the colour of the indicators */
.media-carousel .carousel-indicators li 
{
  background: #c0c0c0;
}
.media-carousel .carousel-indicators .active 
{
  background: #333333;
}
.media-carousel img
{
  width: 250px;
  height: 100px
}
/* End carousel */	
</style>

<script>
$(document).ready(function() {
  $('#media').carousel({
    pause: true,
    interval: false,
  });
});	
</script>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>

<body>
<div class="container">
  <div class='row'>
    <div class='col-mda-8'>
      <div class="carousel slide media-carousel" id="media">
        <div class="carousel-inner">
         
          <div class="item active">
            <div class="row">
<?php
while( $result = mysql_fetch_array( $requete ) )
{
	@$i++;
if($i==1){
?>
              <div class="col-md-2">
                <a href="<?php echo($result["lien"]."\n" ); ?>"><?php echo '<div align=\"center\"><img src="gestion/upload/partenaires/' .$result["image"].'"></div>';?> </a>
              </div>  
<?php $i++; }else{ ?>  
              <div class="col-md-2">
                <a href="<?php echo($result["lien"]."\n" ); ?>"><?php echo '<div align=\"center\"><img src="gestion/upload/partenaires/' .$result["image"].'"></div>';?> </a>
              </div>
              
<?php } } ?>              
                 
            </div>
          </div>
        </div>
        <a data-slide="prev" href="#media" class="left carousel-control">‹</a>
        <a data-slide="next" href="#media" class="right carousel-control">›</a>
      </div>                          
    </div>
  </div>
  
  
</div>
</body>
</html>

Réponse 3 / 3

Kuartz Messages postés 850 Date d'inscription vendredi 13 février 2015 Statut Membre Dernière intervention 15 février 2019 61
17 janv. 2018 à 14:57

Bonjour,

Tout d'abord, comme jordane45, je te déconseille fortement l'utilisation des fonctions mysqli.

Aujourd'hui, les objets de la classe PDO permettent des requêtes sécurisées, optimisées et des traitements incroyables par la suite grâce aux méthodes proposées.

Si je relis ton code et ton erreur, elle vient du fait que la variable qui initie ta base de données ($bdd) n'existe pas. Du coup, je te conseille dans un premier temps de ne laisser que le code jusqu'au echo de l'erreur de bdd et de supprimer tout le reste. Cela te permettra de voir si déjà la connexion à la bdd est OK.

Cordialement.

jordane45 Messages postés 38138 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 17 avril 2024 4 649
17 janv. 2018 à 15:31

Hello
Il a déjà corrigé cette erreur : https://forums.commentcamarche.net/forum/affich-35098976-carousel#2

fdawch Messages postés 51 Date d'inscription mardi 2 septembre 2014 Statut Membre Dernière intervention 1 mai 2018 1
23 janv. 2018 à 14:59

Bonjour

SVP je veux un code pour ce carousel, j'ai déjà fait des corrections mais sans résultats.

Cordialement

Kuartz Messages postés 850 Date d'inscription vendredi 13 février 2015 Statut Membre Dernière intervention 15 février 2019 61 > fdawch Messages postés 51 Date d'inscription mardi 2 septembre 2014 Statut Membre Dernière intervention 1 mai 2018
Modifié le 29 janv. 2018 à 15:19

Bonjour,

J'ai gardé ton code qui pour moi est parfaitement illisible. Mais voilà ce que ça peut donner, à tester :

<?php

ini_set('display_errors', 1);

try
{
    $bdd = new PDO('mysql:host=localhost;dbname=cneree;charset=utf8', 'root', '');
    array(PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION);
}
catch(Exception $e)
{
    die('Erreur: ' . $e->getMessage());
}

$req = $bdd->query("SELECT * FROM partners ORDER BY id_partners");

?>

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Document sans titre</title>
<style>
/* carousel */
.media-carousel 
{
  margin-bottom: 0;
  padding: 0 40px 30px 40px;
  margin-top: 30px;
}
/* Previous button  */
.media-carousel .carousel-control.left 
{
  left: -12px;
  background-image: none;
  background: none repeat scroll 0 0 #222222;
  border: 4px solid #FFFFFF;
  border-radius: 23px 23px 23px 23px;
  height: 40px;
  width : 40px;
  margin-top: 30px
}
/* Next button  */
.media-carousel .carousel-control.right 
{
  right: -12px !important;
  background-image: none;
  background: none repeat scroll 0 0 #222222;
  border: 4px solid #FFFFFF;
  border-radius: 23px 23px 23px 23px;
  height: 40px;
  width : 40px;
  margin-top: 30px
}
/* Changes the position of the indicators */
.media-carousel .carousel-indicators 
{
  right: 50%;
  top: auto;
  bottom: 0px;
  margin-right: -19px;
}
/* Changes the colour of the indicators */
.media-carousel .carousel-indicators li 
{
  background: #c0c0c0;
}
.media-carousel .carousel-indicators .active 
{
  background: #333333;
}
.media-carousel img
{
  width: 250px;
  height: 100px
}
/* End carousel */ 
</style>
 
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>

<body>
<div class="container">
  <div class='row'>
    <div class='col-mda-8'>
      <div class="carousel slide media-carousel" id="media">
        <div class="carousel-inner">
         
          <div class="item active">
            <div class="row">

<?php
   
while($results = $req->fetch())
{ 
 @$i++;
if($i==1){
?>
              <div class="col-md-2">
                <a href="<?php echo($results["lien"]."\n" ); ?>"><?php echo '<div align=\"center\"><img src="gestion/upload/partenaires/' .$results["image"].'"></div>';?> </a>
              </div>  
<?php $i++; }else{ ?>  
              <div class="col-md-2">
                <a href="<?php echo($results["lien"]."\n" ); ?>"><?php echo '<div align=\"center\"><img src="gestion/upload/partenaires/' .$results["image"].'"></div>';?> </a>
              </div>
<?php } } ?>              
            </div>
          </div>
        </div>
        <a data-slide="prev" href="#media" class="left carousel-control">‹</a>
        <a data-slide="next" href="#media" class="right carousel-control">›</a>
      </div>                          
    </div>
  </div>
</div>

 
 <script>
$(document).ready(function() {
  $('#media').carousel({
    pause: true,
    interval: false,
  });
}); 
</script>
</body>
</html>

fdawch Messages postés 51 Date d'inscription mardi 2 septembre 2014 Statut Membre Dernière intervention 1 mai 2018 1
8 févr. 2018 à 13:33

merci Kuartz, le carrousel n'est pas dynamique :(

Discussions similaires

comment supprimer fond d'ecran en verrouillage galaxy s5

Problème fond d'ecran de verrouillage sur Xiaomi mi 8 lite

Fond d'écran à mon carousel

Discussions similaires

Newsletters