.quiz_body {
            font-family: system-ui;
            margin: 0;
            padding: 0;
            display: flex;
            flex-direction: column;
            align-items: center;
        }
    
            .header_quiz {
            width: 100%;
            min-height: 150px;
            background: #2ECC71;
            padding-bottom: 15px;
            
            display: flex;
            justify-content: center;
            align-items: center;
            
        }
           
            .en_tete {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
           }
           
            .en_tete_1 {
            font-size: 20px;
            font-weight: 500;
            color: white;
            
            line-height: 30px;
        }
           
            .en_tete_2 {
            font-size: 70px;
            font-weight: 700;
            margin: 0;
            padding: 0;
            color: white;
            
            line-height: 50px;
        }

            .en_tete_barre {
               width: 500px;
               height: 5px;
               background: white;
               margin: 50px;
           }

           .footer_quiz {
                width: 100%;
                min-height: 150px;
                background: #2ECC71;
                padding-bottom: 15px;
                 margin-top: 10px;

                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
               
               color: white;
           }
           
           .indication_quiz {
               display: flex;
               font-size: 1.5em;
           }
           
           .indication-1 {
               margin-bottom: 20px;
           }
           
           .nbr-question {
               color: #f1c40f;
           }
           
           .nbr_reponse_juste {
               color: #f1c40f;
           }
           
           
           .questions_list {
               width: 100%;
               
               display: flex;
               flex-direction: column;
               align-items: center;
           }
           
           .quiz_question {
               width: 100%;
               height: 200px;
               background: #E0E0E0;
               
               margin-top: 10px;
               
               color: #34495E;
               
               display: flex;
               flex-direction: column;
               align-items: flex-start;
           }
           
           .titre_question {
               margin-top: 20px;
               margin-bottom: 30px;
               display: flex;
               justify-content: center;
               align-items: center;
           }
           
           .num_question {
               font-size: 30px;
               font-weight: 700;
           }
           
           .num_et_statut_question {
               width: 70px;
               display: flex;
               align-items: center;
               flex-direction: column;
           }
           
           .separation {
               width: 5px;
               height: 40px;
               background: #34495E;
               margin-right: 25px;
               margin-left: 20px;
           }
           
           .propositions {
               width: 100%;
               display: flex;
               justify-content: center;
           }
           
           .quiz_button {
               
               width: 100%;
               
                display: flex;
                justify-content: center;
                align-items: center;
               
                font-size: 15px;
                padding: 10px;
               
               margin-right: 25px;
               margin-left: 25px;
               
               background: #E0E0E0;
               border: 3px #7F8C8D solid;
               border-radius: 10px;
               color: #7F8C8D;
           }
           
           .quiz_button:hover {
               cursor: pointer;
               background: #7F8C8D;
               color: white;
           }
           
           .quiz_button_locked {
               width: 100%;
               
                display: flex;
                justify-content: center;
                align-items: center;
               
                font-size: 15px;
                padding: 10px;
               
                margin-right: 25px;
                margin-left: 25px;
               
                opacity: 0.25;
               
               background: #E0E0E0;
               border: 3px #7F8C8D solid;
               border-radius: 10px;
               color: #7F8C8D;
           }
           
           .false {
               width: 100%;
               
                display: flex;
                justify-content: center;
                align-items: center;
               
                font-size: 15px;
                padding: 10px;
               
                margin-right: 25px;
                margin-left: 25px;
                 
                border: 3px rgba(231, 76, 60, 0.45) solid;
                border-radius: 10px;
                color: #C0392B;
           }   
           
           .corrected {
               width: 100%;
               
                display: flex;
                justify-content: center;
                align-items: center;
               
                font-size: 15px;
                padding: 10px;
               
                margin-right: 25px;
                margin-left: 25px;
               
                opacity: 1;
               
                border: 3px rgba(46, 204, 113, 0.45) solid;
                border-radius: 10px;
                color: #2ECC71;
           }
           
           .resultat_correct {
               color: #2ECC71;
               font-weight: 700;
           }
           
           .resultat_faux {
               color: #E74C3C;
               font-weight: 700;
           }
           
    
    

Blagnac Énergies

QUIZ

 



 

 

 

 

 

 

 

 

 

 

 

   

 Vous avez répondu a :  0 

 question(s) 

 Vous avez  0 

 réponse(s) correct sur les 

 

 

 

      
        
$(function(){
        
    
        var num_question = 0;
        $('.quiz_question').each(function(){
            num_question++;
            var question = $(this).attr('data-question');
            var reponse_juste = $(this).attr('data-reponse_juste');
            var propositions = '';
            
            for (var i = 1; i < 4; i++) {
                let attr = "data-proposition_"+i;
                if (i == reponse_juste){
                    propositions = propositions + '<button data-reponse="true" class="quiz_button true_button">'+ ($(this).attr(attr)) +'';
                }else {
                    propositions = propositions + '<button data-reponse="false" class="quiz_button">'+ ($(this).attr(attr)) +'';
                }
            }
            
            $(this).html('<div class="titre_question">' +
                                '<div class="num_et_statut_question">' +
                                    '<div class="num_question">Q'+ num_question +'

' + ' - 

'+ '

' + '

' + '' + question + '

' + '

' + ''+ propositions + '

'); }); var quiz_button = $('.quiz_button'); var nbr_question = 0; var reponse_juste = 0; quiz_button.click(function(){ var user_reponse = $(this).attr('data-reponse'); nbr_question++; if (user_reponse == 'true'){ $(this).addClass('corrected').attr("disabled","disabled").removeClass('quiz_button'); $(this).nextAll().attr("disabled","disabled").removeClass('quiz_button').addClass('quiz_button_locked'); $(this).prevAll().attr("disabled","disabled").removeClass('quiz_button').addClass('quiz_button_locked'); $(this).parent().parent().find('.resultat').addClass('resultat_correct').html('c☻rrect'); reponse_juste++; }else { $(this).addClass('false').attr("disabled","disabled").removeClass('quiz_button'); $(this).nextAll().attr("disabled","disabled").removeClass('quiz_button').addClass('quiz_button_locked'); $(this).prevAll().attr("disabled","disabled").removeClass('quiz_button').addClass('quiz_button_locked'); $(this).nextAll('.true_button').removeClass('quiz_button').addClass('corrected').removeClass('quiz_button_locked'); $(this).prevAll('.true_button').removeClass('quiz_button').addClass('corrected').removeClass('quiz_button_locked'); $(this).parent().parent().find('.resultat').addClass('resultat_faux').html('× faux'); } $('.nbr-question').html(nbr_question); $('.nbr_reponse_juste').html(reponse_juste); }); });