Bonsoir à tous,

je test actuellement fullcalendar et je rencontre un conflit en bootstrap et Tootip pour afficher les infobulles

Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script src='https://cdn.jsdelivr.net/npm/fullcalendar@6.1.9/index.global.min.js'></script>
<script src='https://unpkg.com/popper.js/dist/umd/popper.min.js'></script>
<script src='https://unpkg.com/tooltip.js/dist/umd/tooltip.min.js'></script>
	<link href='https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css' rel='stylesheet'>  
<link href='https://cdn.jsdelivr.net/npm/bootstrap-icons@1.8.1/font/bootstrap-icons.css' rel='stylesheet'>


- Il faut que je commente la ligne
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
 <link href='https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css' rel='stylesheet'>
pour que les infobulles fonctionne.Mais j'ai besoin de bootstrap sur le reste de ma page .

Je me suis dit je vais aussi utiliser que bootstrap pour les infobulles dans fullcalendar, mais je n'arrive pas a savoir comment faire pour afficher infobulle avec boostrap depuis Calendar;

la partie code de fullcalendar (JavaScript) pour afficher infobulle
Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
	//themeSystem: 'bootstrap5',
   eventDidMount: function(info) {
      var tooltip = new Tooltip(info.el, {
        title: info.event.extendedProps.description,
        placement: 'top',
        trigger: 'hover',
        container: 'body'
      });
      //info.event.setProp('display','block');
    },

Merci d'avance pour vos aides et vos explications.

guigui69