-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathc-lieu-de-residence.html
43 lines (37 loc) · 13.4 KB
/
c-lieu-de-residence.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
<!DOCTYPE html><!-- This site was created in Webflow. http://www.webflow.com --><!-- Last Published: Tue Aug 03 2021 08:54:50 GMT+0000 (Coordinated Universal Time) --><html data-wf-domain="xai-interactive-prototype.webflow.io" data-wf-page="60f59699dd44a1611d895a0c" data-wf-site="609296896f4d570e2a691eaa"><head><meta charset="utf-8"/><title>C - Lieu de résidence</title><meta content="C - Lieu de résidence" property="og:title"/><meta content="C - Lieu de résidence" property="twitter:title"/><meta content="width=device-width, initial-scale=1" name="viewport"/><meta content="Webflow" name="generator"/><link href="https://uploads-ssl.webflow.com/609296896f4d570e2a691eaa/css/xai-interactive-prototype.webflow.082014461.css" rel="stylesheet" type="text/css"/><script src="https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js" type="text/javascript"></script><script type="text/javascript">WebFont.load({ google: { families: ["Open Sans:300,300italic,400,400italic,600,600italic,700,700italic,800,800italic"] }});</script><!--[if lt IE 9]><script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js" type="text/javascript"></script><![endif]--><script type="text/javascript">!function(o,c){var n=c.documentElement,t=" w-mod-";n.className+=t+"js",("ontouchstart"in o||o.DocumentTouch&&c instanceof DocumentTouch)&&(n.className+=t+"touch")}(window,document);</script><link href="https://uploads-ssl.webflow.com/img/favicon.ico" rel="shortcut icon" type="image/x-icon"/><link href="https://uploads-ssl.webflow.com/img/webclip.png" rel="apple-touch-icon"/><!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-TJFXFRZ');</script>
<!-- End Google Tag Manager -->
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-9REJMWZGZB"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-9REJMWZGZB');
</script></head><body><div class="columns w-row"><div class="column w-col w-col-3"><h1 class="heading">Découvrez <br/>votre prime</h1><p class="paragraph-2">Sur la base de vos informations personnelles et de vos besoins de couverture, nous avons calculé le prix de votre prime pour votre assurance automobile.</p><h1 class="heading-3">Intermédiaire +</h1><div class="div-block-2"><div class="div-block-6"><div class="text-block-8">187.22 €</div><div class="text-block-9">/an</div></div><div class="text-block-3">Paiement annuel</div></div><div class="div-block"><div class="div-block-5"><img src="https://uploads-ssl.webflow.com/609296896f4d570e2a691eaa/6092a4bc250e9e73e7bbb334_check_icon.svg" loading="lazy" alt="check icon" class="image-13"/><div class="list-item risks">Dommages causés à autrui</div></div><div class="div-block-5"><img src="https://uploads-ssl.webflow.com/609296896f4d570e2a691eaa/6092a4bc250e9e73e7bbb334_check_icon.svg" loading="lazy" alt="check icon" class="image-13"/><div class="list-item risks">Dommages tous accidents</div></div><div class="div-block-5"><img src="https://uploads-ssl.webflow.com/609296896f4d570e2a691eaa/6092a4bc250e9e73e7bbb334_check_icon.svg" loading="lazy" alt="check icon" class="image-13"/><div class="list-item risks">Vol & tentative de vol</div></div><div class="div-block-5"><img src="https://uploads-ssl.webflow.com/609296896f4d570e2a691eaa/6092a4bc250e9e73e7bbb334_check_icon.svg" loading="lazy" alt="check icon" class="image-13"/><div class="list-item risks">Bris de glace</div></div><div class="div-block-5"><img src="https://uploads-ssl.webflow.com/609296896f4d570e2a691eaa/6092a4bc250e9e73e7bbb334_check_icon.svg" loading="lazy" alt="check icon" class="image-13"/><div class="list-item risks">Incendies & explosions</div></div><div class="div-block-5"><img src="https://uploads-ssl.webflow.com/609296896f4d570e2a691eaa/6092a4bc49211e44979c976c_cross_icon.svg" loading="lazy" alt="crossed icon" class="image-13"/><div class="list-item risks non-included">Catastrophes technologiques</div></div><div class="div-block-5"><img src="https://uploads-ssl.webflow.com/609296896f4d570e2a691eaa/6092a4bc49211e44979c976c_cross_icon.svg" loading="lazy" alt="crossed icon" class="image-13"/><div class="list-item risks non-included">Tempêtes et événements climatiques exceptionnels</div></div><div class="div-block-5"><img src="https://uploads-ssl.webflow.com/609296896f4d570e2a691eaa/6092a4bc49211e44979c976c_cross_icon.svg" loading="lazy" alt="crossed icon" class="image-13"/><div class="list-item risks non-included">Catastrophes naturelles</div></div></div></div><div class="column-2 w-col w-col-9"><div class="section wf-section"><a href="c-comprendre-votre-prix.html" class="w-inline-block w-clearfix"><img src="https://uploads-ssl.webflow.com/609296896f4d570e2a691eaa/6098e13dafd44b362d2c90ad_arrow-left.svg" loading="lazy" alt="go back icon" class="image-11"/><div class="text-block-7">retour</div></a></div><div class="div-block-3"><h2 class="heading-6">Votre lieu de résidence</h2></div><div class="div-block-11"><h4>Votre prix par rapport à la marque et au modèle de votre véhicule</h4></div><div class="div-block-11"><div class="columns-2 w-row"><div class="column-4 w-clearfix w-col w-col-6"><div class="text-block-20">Pour <strong>votre lieu de résidence</strong><br/><strong></strong></div><div class="legende-prix">Votre prix<br/><strong></strong></div><div class="feature-value-categorical-data">Bourg la Reine<strong></strong></div><div class="feature-price-value"><strong>187.22</strong> €</div></div><div class="column-5 w-col w-col-6"><div class="w-form"><form id="email-form" name="email-form" data-name="Email Form" method="get" class="form w-clearfix"><div class="text-block-20 price-example">Pour un <strong>autre lieu de résidence</strong>, votre prix serait de :</div><select data-name="selection-field" name="selection-field" id="field" class="selection-field w-select"></select><div class="text-block-20 price-search"><strong class="bold-text-2 selection-price"> </strong>€</div></form><div class="w-form-done"><div>Thank you! Your submission has been received!</div></div><div class="w-form-fail"><div>Oops! Something went wrong while submitting the form.</div></div></div></div></div></div><div class="div-block-12"><h4 class="heading-9">Exemples de prix pour des lieux de résidence dans d'autres zones (pour votre profil)</h4></div><div class="div-block-11"><div class="columns-3 w-row"><div class="w-col w-col-7"><div class="text-block-20-copy price-example">Le lieu de résidence qui vous donne un prix au<strong> plus bas</strong></div><div class="text-block-20 price-example text-block-20-copy">Un lieu de résidence qui vous donne un <strong>prix similaire</strong> </div><div class="text-block-20 price-example text-block-20-copy">Le lieu de résidence qui vous donne un prix au<strong> plus haut</strong></div></div><div class="w-col w-col-4"><div class="text-block-20 price-example text-block-20-copy">Limoges..........................................</div><div class="text-block-20 price-example text-block-20-copy">Bordeaux.........................................</div><div class="text-block-20 price-example text-block-20-copy">Nantes.............................................</div></div><div class="w-col w-col-1"><div class="text-block-20 price-example text-block-20-copy">131.39 €</div><div class="text-block-20 price-example text-block-20-copy">187.22 €</div><div class="text-block-20 price-example text-block-20-copy">207.16 €</div></div></div></div><div class="w-dyn-list"><div role="list" class="w-dyn-items"><div role="listitem" class="w-dyn-item"><div class="selection-item">Sélectionner....</div><div class="selected-color">808080</div><div class="selected-price">0.00</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Angers</div><div class="selected-color">808080</div><div class="selected-price">187.22</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Bordeaux</div><div class="selected-color">808080</div><div class="selected-price">187.22</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Boulogne-Billancourt</div><div class="selected-color">FF0000</div><div class="selected-price">207.16</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Brest</div><div class="selected-color">008000</div><div class="selected-price">160.86</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Caen</div><div class="selected-color">008000</div><div class="selected-price">177.98</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Dijon</div><div class="selected-color">808080</div><div class="selected-price">187.22</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Grenoble</div><div class="selected-color">FF0000</div><div class="selected-price">196.94</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Le Havre</div><div class="selected-color">FF0000</div><div class="selected-price">207.16</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Le Mans</div><div class="selected-color">008000</div><div class="selected-price">169.20</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Lille</div><div class="selected-color">008000</div><div class="selected-price">177.98</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Limoges</div><div class="selected-color">008000</div><div class="selected-price">131.39</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Metz</div><div class="selected-color">FF0000</div><div class="selected-price">207.16</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Montpellier</div><div class="selected-color">FF0000</div><div class="selected-price">207.16</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Mulhouse</div><div class="selected-color">FF0000</div><div class="selected-price">196.94</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Nantes</div><div class="selected-color">FF0000</div><div class="selected-price">207.16</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Niort</div><div class="selected-color">008000</div><div class="selected-price">145.38</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Paris</div><div class="selected-color">FF0000</div><div class="selected-price">196.94</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Perpignan</div><div class="selected-color">008000</div><div class="selected-price">169.20</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Reims</div><div class="selected-color">808080</div><div class="selected-price">187.22</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Rennes</div><div class="selected-color">FF0000</div><div class="selected-price">196.94</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Saint-Etienne</div><div class="selected-color">008000</div><div class="selected-price">169.20</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Strasbourg</div><div class="selected-color">FF0000</div><div class="selected-price">207.16</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Toulon</div><div class="selected-color">808080</div><div class="selected-price">187.22</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Toulouse</div><div class="selected-color">008000</div><div class="selected-price">177.98</div></div><div role="listitem" class="w-dyn-item"><div class="selection-item">Tours</div><div class="selected-color">008000</div><div class="selected-price">177.98</div></div></div></div></div></div><script src="https://d3e54v103j8qbb.cloudfront.net/js/jquery-3.5.1.min.dc5e7f18c8.js?site=609296896f4d570e2a691eaa" type="text/javascript" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script><script src="https://uploads-ssl.webflow.com/609296896f4d570e2a691eaa/js/webflow.4ec7e4ccd.js" type="text/javascript"></script><!--[if lte IE 9]><script src="//cdnjs.cloudflare.com/ajax/libs/placeholders/3.0.2/placeholders.min.js"></script><![endif]--><!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-TJFXFRZ"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) --><script>
$('.selection-item').each(function(index){
var s = $(this).text();
var price = $('.selected-price').get(index).innerText;
$('.selection-field').append('<option value="'+price+'">'+s+'</option>');
})
$( '.selection-field').change(function() {
var str = "";
var color = "";
$( "select option:selected" ).each(function(index) {
color = "#" + $('.selected-color').get($(this).get(0).index).innerText;
console.log($(this).get(0).index)
console.log(color)
str += $(this).text() + " ";
});
$('.selection-price').text($('.selection-field').val());
$('.selection-price').css('color', color);
})
.change();
</script></body></html>