Bonjour
voila ...
est il possible d'ajouter un lien a chaque image dans un carrousel .
et comment le faire ?


et Merci ..

N.B Je suis NUL dans la matière.

le code

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Rotating Image Gallery - Solo Developer</title>

    <link rel="stylesheet" href="style.css">

<style>
.image-container{
margin: 0 auto;
  position:relative;
  width:200px;
  height:200px;
  transform-style: preserve-3d;
  transform: perspective(1000px) rotateY(0deg);
  transition: transform 0.7s;
}
.image-container span{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  transform: rotateY(calc(var(--i) * 45deg)) translateZ(400px);
}
.image-container span img{
  position:absolute;
  left:0;
  top:0;
  width:100%;
  border-radius: 5px;
}
.btn-container{
  position:relative;
  margin: 0 auto;
  width:80%;
}
.btn{
  position: absolute;
  bottom:-80px;
  background-color: orangered;
  color:white;
  padding:10px 20px;
  border-radius: 5px;
  border:none;
  cursor: pointer;
}
.btn:hover{
  filter:brightness(1.5);
}
#prev{
  left:20%;
}
#next{
  right:20%;
}

</style>

</head>
<body>
 
  <div class="image-container">
  <span style="--i: 1">
    <img src="https://i.servimg.com/u/f86/15/11/07/63/elzove10.jpg" title="image">
  </span>
  <span style="--i: 2">
    <img src="https://i.servimg.com/u/f86/15/11/07/63/retour10.jpg" title="image">
  </span>
  <span style="--i: 3">
    <img src="https://www.jqueryscript.net/dummy/3.jpg" title="image">
  </span>
  <span style="--i: 4">
<img src="https://i.servimg.com/u/f86/15/11/07/63/fille10.jpg" title="image">
  </span>
  <span style="--i: 5">
    <img src="https://www.jqueryscript.net/dummy/5.jpg" title="image">
  </span>
  <span style="--i: 6">
    <img src="https://www.jqueryscript.net/dummy/6.jpg" title="image">
  </span>
  <span style="--i: 7">
    <img src="https://www.jqueryscript.net/dummy/7.jpg" title="image">
  </span>
  <span style="--i: 8">
    <img src="https://www.jqueryscript.net/dummy/8.jpg" title="image">
  </span>
</div>
  <div class="btn-container">
  <button class="btn" id="prev">Précédent</button>
  <button class="btn" id="next">Suivant</button>
</div>
<script type="text/javascript" charset="utf-8">
  const imageCon = document.querySelector(".image-container");
const prevEl = document.getElementById("prev");
const nextEl = document.getElementById("next");
let x=0;
let timer=0;
prevEl.addEventListener("click",()=>{
  x=x+45;
  clearTimeout(timer);
  updateImage();
});
nextEl.addEventListener("click",()=>{
  x=x-45;
  clearTimeout(timer);
  updateImage();
});
function updateImage(){
  imageCon.style.transform=`perspective(1000px) rotateY(${x}deg)`;
  timer=setTimeout(()=>{
      x=x-45;
      updateImage();
  },2000);
}
updateImage();
</script>
</body>
</html>
Bonjour,

Uncaught mysqli_sql_exception: Illegal mix of collations (utf8mb4_unicode_ci,IMPLICIT) and (utf8mb3_general_ci,COERCIBLE) for operation '='

if (!Empty ($vv[22]))
{
if (isSet ($Fab_Tab[$vv[22]])) $vv[22] = $Fab_Tab[$vv[22]];
 
$requete = "SELECT col_1 FROM table WHERE col_2 = '" . $vv[22] . "'";
 
if (mysqli_num_rows (mysqli_query ($connexion, $requete)) == 0) $Tab_Equi[$vv[0]] = $vv[22];
}


col_1 = INT
col_2 = varchar(40) INTERCLASSEMENT utf8mb4_unicode_ci
$vv[22] = provient d'un fichier externe, codage inconnu (peut-être utf8mb3_general_ci,COERCIBLE).

Je ne comprends pas l'erreur.
Je suppose qu'il faut ajouter un COLLATE quelque part mais où ?

Merci d'avance de votre aide.
Bongota a écrit :
Par exemple :
&lt;div class="container"&gt;
        &lt;!-- here --clr is css variable --&gt;
        &lt;a class="btn" href="lien" style="--clr: yellow;"&gt;Get Started&lt;/a&gt;
        &lt;a class="btn" href="lien" style="--clr: red;"&gt;Get Started&lt;/a&gt;
        &lt;a class="btn" href="lien" style="--clr: #80D8FF;"&gt;Get Started&lt;/a&gt;
    &lt;/div&gt;

À vous de choisir les liens qui vont. Le fond jaune est presque invisible.



ça marche et très bien ..
c'est très aimable de votre part
et un grand merci a vous et pour tout le monde et ..
casper2 a écrit :
Bonsoir, je viens de voir plusieurs erreurs dans votre code, passez votre code au validateur pour voir et corriger les erreurs de syntaxe =&gt; https://validator.w3.org/
La balise &lt;/meta&gt; et la balise &lt;/link&gt; n'existe pas.
Rien entre la balise &lt;/body&gt; et la balise &lt;/html&gt;.



Merci beaucoup

c'est trop pour moi Je suis nul dans la matières
Modifié par ouzou (05 Feb 2025 - 20:32)
Bonjour

Voila .
je viens de télécharger un code html pour faire des boutons , et j'aimerais bien d'insérer un lien pour que ses boutons ouvres une autre page .

Merci bien

N.B je suis NUL dans la matière ( je suis plutôt littéraire).

le code

<html lang="en">
<head>
    <meta charset="UTF-8"></meta>
    <meta content="width=device-width, initial-scale=1.0" name="viewport"></meta>
    <link href="./style.css" rel="stylesheet"></link>
    <title>Document</title>

<style>
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: sans-serif;
}

.container{
    width: 100%;
    height: 20vh;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 2rem;
}
.btn{
    position: relative;
    padding: 1.5rem 2rem;
    font-size: 1.3rem;
    width: 15rem;
    border-radius: 50px;
    background: transparent;
    border: 2px solid var(--clr);
    color: var(--clr);
    font-weight: 600;
    cursor: pointer;
    text-transform: uppercase;
    overflow: hidden;
    transition: 0.75s;
    z-index: 2;
    
}
.btn::after{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--clr);
    clip-path: circle(0% at 50% 50%);
    transition: 0.75s;
    z-index: -1;
    }
.btn:hover::after{
    clip-path: circle(100% at 50% 50%);
}

.btn:hover {
    color: black;
    box-shadow: 0 0 10px var(--clr),
    0 0 50px var(--clr);
    
}
</style>


</head>
<body>
    <div class="container">
        <!-- here --clr is css variable -->
        <button class="btn" style="--clr: yellow;">Get Started</button>
        <button class="btn" style="--clr: red;">Get Started</button>
        <button class="btn" style="--clr: #80D8FF;">Get Started</button>
    </div>
</body>
<script crossorigin="anonymous" integrity="sha512-aNMyYYxdIxIaot0Y1/PLuEu3eipGCmsEUBrUq+7aVyPGMFH8z0eTP0tkqAvv34fzN6z+201d3T8HPb1svWSKHQ==" referrerpolicy="no-referrer" src="https://cdnjs.cloudflare.com/ajax/libs/animejs/3.2.2/anime.min.js"></script>
<script src="./script.js"></script>
</html>

Modifié par ouzou (05 Feb 2025 - 18:06)
Bonjour

Grave erreur de jugement/appréciation. On se forme tout la vie, si vous ne connaissez pas les langages que vous utilisez pour votre site, je vous invite sérieusement à les apprendre.
>>>> Toujours bien de ne pas sur interpréter quand on ne connaît pas les tenants et les aboutissants. Si vous relisez ma phrase « pour le moment ». Je passe ma vie à me former, donc allez déverser votre haine ailleurs.

Je vais me passé de vous donner le lien du site et vous servir de cible à abattre pour le plaisir de vos petits doigts devant votre écran, je me suis débrouillé jusqu’à maintenant seul et trouvé des ressources et de l’aide part des personnes qui avaient une réelle intention d’aider avec de la bienveillance.

Il y a des manières de dire les choses, le site a été construit avec Elementor et remplie grandement ses objectifs de base, encore une fois un jugement sans fondement ni contexte. Pour cet effet là en particulier j’ai utilisé une IA pour appliquer l’effet, qui jusque là, fonctionne très bien à par sur un détail.

Certes je ne maîtrise pas le css et je devrais commencé par là, mais ce n’est pas dans ma priorité et aucun cas pour venir me descendre de cette manière

Certaines personnes de cette communauté devraient vraiment arrêter de se croire les tout puissants du monde, vraiment too much
Bonjour,
>> le site est bouclé fonctionnel et accessible
Quel est l'URL du site?

>> Donc je n'ai pas vocation à me former pour le moment.
Grave erreur de jugement/appréciation. On se forme tout la vie, si vous ne connaissez pas les langages que vous utilisez pour votre site, je vous invite sérieusement à les apprendre.

>> j'ai utilisé l'IA
Qui raconte n'importe quoi, comme d'habitude...
Passer votre code au validateur HTML => https://validator.w3.org/ pour voir et corriger les erreurs de syntaxe.
Le sélecteur HTML selector n'existe pas. Aucune balise HTML se nomme <selector>.
L'IA voulait sans doute vous indiquez que "selector" était à remplacer par le sélecteur que vous utilisez dans votre site. Cela vous ne l'avez pas compris.
D’où le fait qu'il ne faut pas utiliser un IA quand on ne sait pas ce que l'on fait!!! Et surtout pas recopier bêtement ce qui sort d'une IA!!
Modifié par casper2 (05 Feb 2025 - 17:07)
lionel_css3 a écrit :

je pensais qu'on ne pouvait interpoler des variables PHP que entres des guillemets double quotes ""


C'est bien le cas, $today est "transformé" en date (2025-02-05) parce qu'au niveau "global" tu as des doubles quotes pour créer $sql.
Les simples quotes restent des simples quotes à l’intérieur du string $sql (et sont nécessaire à la requête sql qui à besoin de quotes (simple ou double) pour encadrer une chaîne de caractère "2025-02-05" . C'est ce que je demandais avec ma question 2 de tester directement dans mysql, ça remonte directement ce genre d'erreur de guillemets manquants)
Mathieuu a écrit :

- Tu es sur de ce que renvoie
$today = date_i18n( 'Y-m-d' );
? (Je ne connais pas cette fonction mais pour moi i18n j'aurai bien vu un truc qui renvoie un texte dépendant du lieu/langue, genre 5 fevrier 2025 en france et 5 february 2025 en anglais)

Oui, bien sur , je l'ai vérifié, d'ailleurs je le dis dans le post au début.
date_i18n() est une fonction de WordPress



Mathieuu a écrit :

- C'est forcement today ? Si oui tu dois avoir moyen d'utiliser directement les fonctions de ta bdd pour avoir la date d'aujourd'hui. A priori en mysql ça donnerait directement :
$sql = "SELECT * FROM $tablename1 WHERE `date_event` &gt; CURRENT_DATE()";


Ceci est très intéressant aussi, j'essaierai mais de toutes façons il faut que je récupère le mois et l'année de départ pour créer des découpages par mois donc j'ai besoin de décomposer la date de départ.

(edit) oui ça marche avec CURRENT_DATE()

Un grand merci en tout cas.
Modifié par lionel_css3 (05 Feb 2025 - 16:04)
Hello,

Merci pour ton retour, je t'avoue que j'ai conçu entièrement mon site sans codage en passant par elementor et le site est bouclé fonctionnel et accessible. Donc je n'ai pas vocation à me former pour le moment. Seulement pour ces effets, j'ai utilisé l'IA et il y a seulement pour la version tablette que ça bloque.

De moi même je ne sais donc pas comment m'y prendre.
Pitet a écrit :
Essaye d'ajouter des guillemets simples pour délimiter la chaine de caractère à comparer dans ta requête :
$sql = "SELECT * FROM $tablename1 WHERE `date_event` &gt; '$today'";


Mais tu es un génie !!! Smiley prie

ça marche avec les single quotes... j'aurais du essayer

je pensais qu'on ne pouvait interpoler des variables PHP que entres des guillemets double quotes ""
Salut,
il faut utiliser les balises qui vont bien quand tu mets du code (en bas de la zone de texte la ligne "Colorisation syntaxique : code html css php .." )
(Éventuellement tu peux remplir une page directement sur jsfiddle.com ou codepen.io pour illustrer plus concrètement ce qui se passe)
Salut,

2 -3 petites questions :
- Tu es sur de ce que renvoie
$today = date_i18n( 'Y-m-d' );
? (Je ne connais pas cette fonction mais pour moi i18n j'aurai bien vu un truc qui renvoie un texte dépendant du lieu/langue, genre 5 fevrier 2025 en france et 5 february 2025 en anglais)
- Tu as essayé la requête directement dans mysql ? Des fois ça permet d’être sur que cela fonctionne correctement avant d'attaquer le debug du coté du php (après si $today contient bien 2025-02-05, visuellement cela me semble correct)
- C'est forcement today ? Si oui tu dois avoir moyen d'utiliser directement les fonctions de ta bdd pour avoir la date d'aujourd'hui. A priori en mysql ça donnerait directement :
$sql = "SELECT * FROM $tablename1 WHERE `date_event` > CURRENT_DATE()";


Edit : la réponse de Pitet me semble correct, manque de guillemets pour une chaîne de caractère
Modifié par Mathieuu (05 Feb 2025 - 15:22)
Bonjour à tous,

J'utilise wordpress et elementor.

J'ai réussi à appliquer un code pour créer un effet sur mes cartes.

Tout est ok sur ordinateur et mobile par contre sur tablette l'effet n'est pas fou, l'effet n'est pas homogène, on voit des rectangles en arrière-plan.

Savez-vous d'où cela peut venir ?

Voici le code :

/* Variables pour les couleurs */
selector {
  --first-color: #007dff; 
  --second-color: #a2252e;
  --third-color: #ff6600;
}

/* Déclaration de la propriété CSS personnalisée */
@property --rotate {
  syntax: "<angle>";
  initial-value: 132deg;
  inherits: false;
}

/* Avant et après de selector */
selector::before, 
selector::after {
  opacity: 0;
  content: "";
  transition: all 0.5s ease-in-out;
}

selector::before, 
selector::after {
  position: absolute;
  z-index: -1;
  background-image: linear-gradient(
    var(--rotate),
    var(--first-color), 
    var(--second-color) 43%, 
    var(--third-color)
  );
  animation: spin 2.5s linear infinite;
  opacity: 1;
}

/* Avant */
selector::before {
  width: 99%;
  height: 89%;
  border-radius: 100px;
  top: 10%;
  left: 0;
}

/* Après */
selector::after {
  top: 0;
  left: 0;
  right: 0;
  height: 90%;
  width: 90%;
  transform: scale(0.9);
  filter: blur(100px);
}

/* Animation */
@keyframes spin {
  0% {
    --rotate: 0deg;
  }
  100% {
    --rotate: 360deg;
  }
}

/* Tablettes en mode portrait et paysage */
@media (min-width: 768px) and (max-width: 1366px) {
  selector::before {
    width: 99%;
    height: 80%;  /* Réduction de la hauteur */
    border-radius: 100px;
    top: 5%;  /* Ajustement position */
    left: 0;
  }
  
  selector::after {
    height: 80%;  /* Réduction de la hauteur */
    width: 90%;
    top: 0;
    left: 0;
    right: 0;
    transform: scale(0.9);
    filter: blur(100px);
  }
}

/* Mobile (conservé de l'original) */
@media (max-width: 768px) {
  selector::before {
    width: 90%;
    height: 80%;
    top: 15%;
    left: 5%;
  }
  
  selector::after {
    width: 80%;
    height: 75%;
    top: 10%;
    left: 10%;
    filter: blur(60px);
  }
}


edit : ajout de la balise[code]
Modifié par gcyrillus (05 Feb 2025 - 16:47)
Je dirais que today ne renvoie pas une chaine formatée comme dans l'array pour le test, il faudrait peut être vérifier en testant les timestamp correspondants avec strtotime par exemple

J'utilise pour la date du jour avec un enregistrement en base comme le tien 'aaaa-mm-jj' des champs à tester, mais je gère le 0 des mois inférieur à 10 car ça ne marchait pas directement.

Function aujourdhui () {

  $aujourdhui = getdate();
  $mois = $aujourdhui['mon'];
  $mjour = $aujourdhui['mday'];

  $annee = $aujourdhui['year'];
  if ($mois>9) {
     $daterech=$annee.'-'.$mois.'-'.$mjour;
  } else {
     $daterech=$annee.'-0'.$mois.'-'.$mjour;
  }
  return $daterech;
}


ensuite je fais la recherche
$sel = $link->prepare("
	SELECT * from calendrier where (cal_deb>=? or  cal_fin>=?)  order by cal_deb,cal_fin
	");
$sel->execute(array($daterech, $daterech));
Bonjour,

je suis en train d'expérimenter un plugin Wordpress qui gère des évènements et qui travaille avec des dates.
Les dates sont stockées (dans une table custom de WordPress) sous forme de chaines comme ceci:


array (size=24)
  0 => 
    object(stdClass)[1632]
      public 'id' => string '1' (length=1)
      public 'date_event' => string '2025-03-13' (length=10)
      public 'events_ids' => string '64673' (length=5)
  1 => 
    object(stdClass)[1631]
      public 'id' => string '2' (length=1)
      public 'date_event' => string '2025-03-14' (length=10)
      public 'events_ids' => string '64673' (length=5)
  2 => 
    object(stdClass)[1628]
      public 'id' => string '3' (length=1)
      public 'date_event' => string '2025-05-22' (length=10)
      public 'events_ids' => string '64672,64660' (length=5)
  3 => 
    object(stdClass)[1627]
      public 'id' => string '4' (length=1)
      public 'date_event' => string '2025-06-28' (length=10)
      public 'events_ids' => string '64660,64657,64655' (length=5)
  


je voudrais récupérer, avec une requête, les enregistrement postérieurs à la date du jour et ça ne fonctionne pas, il me renvoie tout le contenu de la table mysql

voici le code que j'utilise dans WordPress:

$today = date_i18n( 'Y-m-d' );  // renvoie 2025-02-05 pour le 5 fév 2025

global $wpdb;
$tablename1  = $wpdb->prefix . "gibi_all_current_events";

$sql = "SELECT * 
				FROM $tablename1 
				WHERE `date_event` > $today";
$date_set = $wpdb->get_results( $sql );



alors je me doute bien qu'il y a un problème dans ma clause WHERE `date_event` > $today
Je suis pas un expert en requêtes mysql et je me demande si il existe un moyen de forcer la comparaison des dates de la sorte, on peut bien les classer... alors on doit peut-être pouvoir les extraire en fonction d'une valeur...
-
Modifié par lionel_css3 (05 Feb 2025 - 10:10)
Mathieuu a écrit :
Salut,
tu as un autre code qui transforme la première lettre différemment :
body.postid-3 .entry-content div.elementor-element:first-child div.elementor-widget p:first-child::first-letter {
    color: #333!important;
    font-weight: 600!important;
    font-size: 24px!important;
    float: none!important;
    padding-right: 1px!important
}


EN effet, je n'avais pas vu cette ligne ! Problème résolu. Merci Smiley smile
Bonjour,

J'ai créé une ligne de code qui permet de mettre la première lettre du premier paragraphe des pages articles en grande taille et en rouge.

Le problème est que seulement sur certaines pages mon code ne fonctionne pas. J'ai beau comparer et tester, je ne trouve rien.

Voici la fameuse ligne CSS
body.single-post article.post .entry-content .elementor-element .elementor-widget:first-child .elementor-widget-container p:first-child::first-letter{
  color:#F7251C; font-weight:800; font-size:80px;
  line-height: 1; float:left; padding-right:6px; text-transform:uppercase;}


Et les pages concernées
OK : https://andeva.fr/lassociation/presentation-andeva
NO OK : https://andeva.fr/lassociation/objectifs-dates-et-chiffres-de-landeva

Un coup de main svp ?
Bonjour,
une première mesure, c’est de mettre aussi AddDefaultCharset utf-8 tout en haut du htaccess. Ça peut parfois aider. Mais les symboles ASCII ne sont pas toujours compatibles, suivant les matériels. C’est parfois risqué.
Il y a une façon plus robuste pour faire des flèches et toutes sortes de caractères
.puce::before{
  content?: " ";
  padding-right: 8px;
  color???:red;}

Ensuite, dans le html
span class="puce"> </span>
<
Les caractères à copier/coller sont ici, entre autres?????:
https://www.leptidigital.fr/productivite/symboles-de-fleches-29812/
(tiens, ma flèche a été transformée en deux??) Smiley confus
Je laisse vide, entre les deux " ", il faut mettre l’image de la flèche. Pourquoi de?? partout.
Tu auras compris, il faut enlever les point d'interrogation qui sont mis par... je ne sais pas qui.
Modifié par Bongota (03 Feb 2025 - 18:45)
Bonjour,
Suivant le navigateur, les caractères spéciaux UTF 8 ne s'affichent pas. Pas de souci avec FireFox et Edge sur l'ordinateur. Mais sur mon mobile et ma tablette Samsung, ni Samsung Internet ni Chrome ne les affichent. Ils sont remplacés par un rectangle avec une croix de St André.
Exemple de code HTML :
<li class="slide-down"> <a id="down_button" href="#" title="Suivant">&#129094;</a></li>

Pourtant dans mon <head> j'ai bien :
<meta charset="UTF-8">

Merci.
Bonjour, je réalise un petit jeu réalisé uniquement en caractère texte (ASCII)
chaque ascii est dessiné sur un fichier .txt et est appelé dans une balise <pre>.

Je les positionne ensuite les uns par rapport aux autre en partant du centre:
top: 50%; left: 50%; transform: translate(-50%, -50%);

Malgré plusieurs tentatives, il y a des décalages selon la qualité des écran. Auriez-vous une idée de comment je peux faire pour empêcher ça?

Je vous remercie par avance:



<style>

body {
font-size: 13px;
            font-family: Consolas, monospace;
            margin: 0; 
            line-height:1.15;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            width: 100vw;
            overflow: hidden;
        }


pre{
    position: absolute;
            line-height:1.15;
    top: 50%;
    left: 50%;  
    transform: translate(-50%, -50%);
    white-space: pre;

    }

    
div{
    position: absolute;
    }


</style>

</head>
<body>
  <div id="letout">
  <div id="paysage">
        <pre ><script>document.include('txt/paysage.txt');</script>
        </pre>
    </div>
                <!-- radia -->
    <div id="radia" style="top: 60px; left: -160px; cursor: pointer;" onclick="fonction_radia()">
        <pre ><script>document.include('txt/radia.txt');</script>
        </pre>
    </div>

        [...]    

Effectivement, et je lis sur le lien que tu as donné que ça peut poser de sérieux problèmes de sécurité. C'est fait, je l'ai enlevé.
Il faut que je revoie la portion de code php qui est situé avant cette partie phpmail. C'est une partie pour détecter et interdire certains mots. Elle fonctionne très bien dans sa détection des mots interdits, mais apporte justement ce message "Votre mail n'a pas été expédié". Si je l'enlève, tout devient normal.
Je continue.
Bonjour,

Sur ton précédent sujet, tu avais déjà le message "Votre message n'a pas été expédié" et tu avais à priori environ 90 lignes de code en plus avant l'envoi du mail.
On peut donc supposer que le message est affiché via le reste du code que tu n'a pas partagé.

Au passage, ton utilisation de try/catch est contre-productive dans ton code : en cas d'exception, celle-ci ne sera jamais loguée et tu ne seras jamais informé des erreurs en prod.
Le plus simple dans ton cas est de ne pas utiliser try/catch : en cas d'exception, celle-ci sera convertie en erreur fatale par PHP et l'erreur sera ainsi loguée.
https://www.julp.fr/blog/posts/43-mythe-php-4-il-faut-mettre-un-try-catch
J’avais déjà essayé ça hier. Effectivement, il n’y a plus les longs messages d’erreur.
Mais il y en a un "Votre message n’a pas été expédié". Alors qu’il a bien été envoyé et reçu sur la boîte?!!!
Et cette phrase ne provient pas de echo de php, où les deux alertes d’envoi ne sont pas rédigées avec les même mots.
D'autre part, est-ce que ces quelques lignes dans le corps d'un message reçu du formulaire me confirment que le mail est encrypté:
Received: from non_domaine.fr (node07.cluster1.easy-hebergement.net [91.238.72.79])
	(using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits)
	 key-exchange X25519 server-signature RSA-PSS (3072 bits) server-digest SHA256)
	(No client certificate requested)
	(Authenticated sender: mon_mail@domaine.fr)

Modifié par Bongota (02 Feb 2025 - 17:51)
Voilà le code php complet. Excepté l'erreur dont je parle, le formulaire fonctionne, je le reçoit bien sur l'adresse mail située sur le domaine de l'hébergeur. Tant que j'ai cette erreur, je ne vais pas plus loin et n'ajoute pas d'autres fonctions (envoi de pièces jointes, de html, cc, Bcc)

<?php
	require_once "PHPMailer/src/Exception.php";
	require_once "PHPMailer/src/PHPMailer.php";
	require_once "PHPMailer/src/SMTP.php";
	
	use PHPMailer\PHPMailer\PHPMailer;
	use PHPMailer\PHPMailer\SMTP;
	use PHPMailer\PHPMailer\Exception;
	
	// Envoi de l’adresse électronique avec PHPMailer
    
    $email = $_POST["email"];
    $message = $_POST["message"];
	
	// Initialiser PHPMailer
	$courriel = new PHPMailer(true);
	try {
		//Paramètres du serveur
		$courriel->SMTPDebug = 1;			        
		$courriel->isSMTP();                                            // Envoi via SMTP
		$courriel->Host       = "mail-b.easy-hebergement.net";          //Définir le serveur SMTP pour envoyer via		
		$courriel->SMTPAuth   = true;                                   //Activer l’authentification SMTP 
		$courriel->Username   = "nom_utilisateur";              	//nom d’utilisateur SMTP 
		$courriel->Password   = "le_pass";                       	// Mot de passe SMTP
		$courriel->SMTPSecure = PHPMailer::ENCRYPTION_SMTPS;            //Activer le chiffrement TLS implicite 
		$courriel->Port       = 465;                                   //Port TCP auquel se connecter ; utilisez 587 si vous avez défini `SMTPSecure = PHPMailer?::ENCRYPTION_STARTTLS` (993, c’est celui de l’hébergeur)
		
		//Destinataires
		$courriel->setFrom("toctoc@free.fr", "Mailer");
		$courriel->addAddress("mon_mail_chez_l'hébergeur", "Mailer");     	 //Ajouter un destinataire
				
		//Contenu
		$courriel->isHTML(true);                                						 
		$courriel->CharSet = "UTF-8";
		$courriel->Encoding = "base64";
		$courriel->Subject = "Envoi depuis le formulaire";
		$courriel->Body    = "Ceci est le corps du message HTML <b>en gras????!</b>";
		$courriel->AltBody = $message;
		
		$courriel->send();
		echo "Votre message a bien été envoyé";
	}
	catch (Exception $e) {
		echo "Votre message n’a pas pu être envoyé. Erreur?: {$courriel->ErrorInfo}";
	}
?>
Alors, Olivier C j'ai pas réussi à faire marcher ta solution..

avec ce code

if (typeof L !== 'undefined') {
      maps()
    }

si L n'est pas définit, on a pas de seconde chance quand il est défini, pour ce que j'ai compris.

par contre la solution de robertkaczor fonctionne mais pour moi elle équivaut à ce que je faisais avec window.dispatchEvent(new Event('resize'))...
Je vais quand même adopter cette solution puisque invalidateSize est une fonction de Leaflet, ça fera moins 'hack'

voici mon code actuel..



let map;
let marker;	

jQuery(document).ready(function($)  {
	// création de la carte commune



	map = L.map('location-map-preview');
	L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
		maxZoom: 19,
		attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
	}).addTo(map);


	// =======initialisation carte si lieu est défini au chargement
	if (typeof(object_map)!="undefined") {
		let lat = object_map.lat;
		let lng = object_map.lng;

		map.setView([lat, lng], 16);
		marker = L.marker([lat, lng]);
		marker.addTo(map);

		//setTimeout(gibiResize, 300);  // pour le bug de refresh

		setTimeout(() => {
			map.invalidateSize();
			}, 300);
	}
	
    // suite du script
    // Opérations sur la carte

});

Bonjour,
je reviens sur PHPMail.
Tout est bon, il n'y a plus d'erreur php, j'ai réglé le problème du port sécurisé en TLS et je peux envoyer maintenant un message sur le domaine de l'hébergeur, ce qui n'était pas le cas avant.
Reste que quand j'expédie le formulaire, il y a un long message d'erreur signalant "Votre message n'a pas été expédié", alors que plus bas un autre message dit "votre message a bien été envoyé". Et effectivement, je le reçois sur le mail désigné.
Autant le message d'envoi est celui écrit dans echo de php, autant celui d'erreur ne l'est pas. Il vient de la machine, quelque part.
Le formulaire fonctionne, mais je ne peux laisser une telle erreur, qui va effrayer n'importe quel visiteur.
Message d'erreur d'un texte non écrit dans echo (et c'est en français).
Votre message n'a pas été expédié 2025-02-01 13:37:50 CLIENT -> SERVER: AUTH LOGIN
2025-02-01 13:37:50 CLIENT -> SERVER: [credentials hidden]
2025-02-01 13:37:50 CLIENT -> SERVER: [credentials hidden]
..................................................Ici une longue liste de messages et dont aucun ne signale une erreur. Et à la fin) :
Votre message a bien été envoyé

Smiley hum
Boujour

voila ...
je viens de télécharger un carrousel, et je n'arrive pas a le centrer.
je vous prie monsieur de bien vouloirs m'aidait a ce sujet .

N.B je suis nul dans la matière.

Merci Bien



<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Rotating Image Gallery - Solo Developer</title>

    <link rel="stylesheet" href="style.css">


  
<style>


.image-container{
  position:relative;
  width:200px;
  height:200px;
  transform-style: preserve-3d;
  transform: perspective(1000px) rotateY(0deg);
  transition: transform 0.7s;
}
.image-container span{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  transform: rotateY(calc(var(--i) * 45deg)) translateZ(400px);
}
.image-container span img{
  position:absolute;
  left:0;
  top:0;
  width:100%;
  border-radius: 5px;
}
.btn-container{
  position:relative;
  width:80%;
}
.btn{
  position: absolute;
  bottom:-80px;
  background-color: orangered;
  color:white;
  padding:10px 20px;
  border-radius: 5px;
  border:none;
  cursor: pointer;
}
.btn:hover{
  filter:brightness(1.5);
}
#prev{
  left:65%;
}
#next{
  right:65%;
}

</style>

</head>
<body>
 
  <div class="image-container">
  <span style="--i: 1">
    <img src="https://www.jqueryscript.net/dummy/1.jpg" title="image">
  </span>
  <span style="--i: 2">
    <img src="https://www.jqueryscript.net/dummy/2.jpg" title="image">
  </span>
  <span style="--i: 3">
    <img src="https://www.jqueryscript.net/dummy/3.jpg" title="image">
  </span>
  <span style="--i: 4">
<img src="https://www.jqueryscript.net/dummy/4.jpg" title="image">
  </span>
  <span style="--i: 5">
    <img src="https://www.jqueryscript.net/dummy/5.jpg" title="image">
  </span>
  <span style="--i: 6">
    <img src="https://www.jqueryscript.net/dummy/6.jpg" title="image">
  </span>
  <span style="--i: 7">
    <img src="https://www.jqueryscript.net/dummy/7.jpg" title="image">
  </span>
  <span style="--i: 8">
    <img src="https://www.jqueryscript.net/dummy/8.jpg" title="image">
  </span>
</div>
  <div class="btn-container">
  <button class="btn" id="prev">Précédent</button>
  <button class="btn" id="next">Suivant</button>
</div>
<script type="text/javascript" charset="utf-8">
  const imageCon = document.querySelector(".image-container");
const prevEl = document.getElementById("prev");
const nextEl = document.getElementById("next");
let x=0;
let timer=0;
prevEl.addEventListener("click",()=>{
  x=x+45;
  clearTimeout(timer);
  updateImage();
});
nextEl.addEventListener("click",()=>{
  x=x-45;
  clearTimeout(timer);
  updateImage();
});
function updateImage(){
  imageCon.style.transform=`perspective(2000px) rotateY(${x}deg)`;
  timer=setTimeout(()=>{
      x=x-45;
      updateImage();
  },2000);
}
updateImage();
</script>
</body>
</html>


modération : correction mise en forme code (coloration syntaxique)
Modifié par niuxe (31 Jan 2025 - 01:23)
50 Dernières réponses