templates/home/index.html.twig line 1

Open in your IDE?
  1. <!DOCTYPE html>
  2. <html lang="fr">
  3. {% block head %}
  5.     <title>Références Equinoxes - Agence de communication à Reims & Soissons</title>
  6.     <meta charset="%UTF-8">
  7.     <meta name="viewport" content="width=device-width">
  8.     <link rel="stylesheet" type="text/css" href="/assets/css/normalize.css">
  9.     <link rel="stylesheet" type="text/css" href="/assets/css/style.css">
  10.     <link href="https://fonts.googleapis.com/css?family=Lato:300,400,700&display=swap" rel="stylesheet">
  11.     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  12.     <link rel="shortcut icon" type="image/x-icon" href="favicon.ico"/>
  13. {% endblock %}
  18. {% block body %}
  19. <body id="portal">
  20. <main>
  21.  <section id="wrap-main">
  22.         <div class="logo">
  23.           <img src="/assets/img/logo.svg" class="scale-in-center">
  24.         </div><!-- /logo -->
  25.         <a class="bloc bloc1" href="/rea_print/"><h2 class="fade-in">Studio de<br><strong>Création</strong></h2></a>
  26.         <a class="bloc bloc2" href="/rea_studycase/"><h2 class="fade-in">Étude<br><strong>de cas</strong></h2></a>
  27.         <a class="bloc bloc3" href="/rea_digital/"><h2 class="fade-in"><strong>Digital</strong></h2></a>
  28.         <a class="bloc bloc4" href="/rea_video/"><h2 class="fade-in"><strong>Audiovisuel</strong></h2></a>
  29.           
  31.             </section><!-- /wrap-main -->
  32.   </main>
  33.     <script>
  34.       $(document).ready(function(){
  35.         $('.bloc1').mouseover(function(){
  36.           $('.bloc2').css('opacity','.5');
  37.           $('.bloc3').css('opacity','.5');
  38.           $('.bloc4').css('opacity','.5');
  39.         });
  40.         $('.bloc1').mouseout(function(){
  41.           $('.bloc2').css('opacity','1');
  42.           $('.bloc3').css('opacity','1');
  43.           $('.bloc4').css('opacity','1');
  44.         });
  45.         $('.bloc2').mouseover(function(){
  46.           $('.bloc1').css('opacity','.5');
  47.           $('.bloc3').css('opacity','.5');
  48.           $('.bloc4').css('opacity','.5');
  49.         });
  50.         $('.bloc2').mouseout(function(){
  51.           $('.bloc1').css('opacity','1');
  52.           $('.bloc3').css('opacity','1');
  53.           $('.bloc4').css('opacity','1');
  54.         });
  55.         $('.bloc3').mouseover(function(){
  56.           $('.bloc1').css('opacity','.5');
  57.           $('.bloc2').css('opacity','.5');
  58.           $('.bloc4').css('opacity','.5');
  59.         });
  60.         $('.bloc3').mouseout(function(){
  61.           $('.bloc1').css('opacity','1');
  62.           $('.bloc2').css('opacity','1');
  63.           $('.bloc4').css('opacity','1');
  64.         });
  65.         $('.bloc4').mouseover(function(){
  66.           $('.bloc1').css('opacity','.5');
  67.           $('.bloc2').css('opacity','.5');
  68.           $('.bloc3').css('opacity','.5');
  69.         });
  70.         $('.bloc4').mouseout(function(){
  71.           $('.bloc1').css('opacity','1');
  72.           $('.bloc2').css('opacity','1');
  73.           $('.bloc3').css('opacity','1');
  74.         });
  75.     });
  76.     </script>
  80.      
  81.  
  86. </body>
  87. {% endblock %}
  88. </html>