Toutes les sorties et tous les événements du Québec, un seul endroit — 7 connecteurs, fiches SSR, design Groupe KA.
HTML 82.9%
Python 15.2%
TypeScript 0.9%
JavaScript 0.7%
1 2<!doctype html>3<html lang="fr">4<head>5 <!-- Google Tag Manager -->6 <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':7 new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],8 j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=9 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);10 })(window,document,'script','dataLayer','GTM-TS2PTHZ');</script>11 <!-- End Google Tag Manager -->12 <meta charset="utf-8">13 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">14 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0">15 16 <link rel="shortcut icon" type="image/x-icon" href="/media/rleliurn/favicon.ico">17 <title>Fragments de carnets</title>18 <link rel="stylesheet" crossorigin="anonymous" href="https://use.typekit.net/qax2fzj.css">19 2021 <meta property="og:image" content="https://animee.ville.quebec.qc.ca/media/4mzlofxm/tdl-fragments.png?cc=0.11405529953917039,0,0,0&width=769&height=434&v=1dd154ef5a1b1b0">22 <meta property="og:image:type" content="image/jpeg">23 <meta property="og:image:width" content="769">24 <meta property="og:image:height" content="434">25 <meta property="og:type" content="article">26 27 <meta property="og:title" content="Fragments de carnets — Atelier découverte — Québec animée">2829 <meta property="og:description" content="Plusieurs dates, Maison Tessier-Dit-Laplante">30 <meta name="twitter:description" content="Plusieurs dates, Maison Tessier-Dit-Laplante">31 <meta name="description" content="Plusieurs dates, Maison Tessier-Dit-Laplante">32 <meta name="twitter:card" content="summary" />33 <meta name="twitter:url" content="https://animee.ville.quebec.qc.ca/activites/atelier-decouverte-fragments-de-carnets/">34 <meta name="twitter:title" content="Fragments de carnets — Québec animée">35 <meta name="twitter:image" content="https://animee.ville.quebec.qc.ca/media/4mzlofxm/tdl-fragments.png?cc=0.11405529953917039,0,0,0&width=769&height=434&v=1dd154ef5a1b1b0">36 <meta name="twitter:site" content="@villequebec">37 38 <link rel="stylesheet" href="https://unpkg.com/flickity@2/dist/flickity.min.css">39 <link rel="stylesheet" href="https://js.arcgis.com/4.32/esri/themes/light/main.css">404142 43 <link rel="stylesheet" href="/css/quebec-animee/styles.css">44 <link rel="stylesheet" href="/css/quebec-animee/print.css">45 46<script type="text/javascript">!function(T,l,y){var S=T.location,k="script",D="instrumentationKey",C="ingestionendpoint",I="disableExceptionTracking",E="ai.device.",b="toLowerCase",w="crossOrigin",N="POST",e="appInsightsSDK",t=y.name||"appInsights";(y.name||T[e])&&(T[e]=t);var n=T[t]||function(d){var g=!1,f=!1,m={initialize:!0,queue:[],sv:"5",version:2,config:d};function v(e,t){var n={},a="Browser";return n[E+"id"]=a[b](),n[E+"type"]=a,n["ai.operation.name"]=S&&S.pathname||"_unknown_",n["ai.internal.sdkVersion"]="javascript:snippet_"+(m.sv||m.version),{time:function(){var e=new Date;function t(e){var t=""+e;return 1===t.length&&(t="0"+t),t}return e.getUTCFullYear()+"-"+t(1+e.getUTCMonth())+"-"+t(e.getUTCDate())+"T"+t(e.getUTCHours())+":"+t(e.getUTCMinutes())+":"+t(e.getUTCSeconds())+"."+((e.getUTCMilliseconds()/1e3).toFixed(3)+"").slice(2,5)+"Z"}(),iKey:e,name:"Microsoft.ApplicationInsights."+e.replace(/-/g,"")+"."+t,sampleRate:100,tags:n,data:{baseData:{ver:2}}}}var h=d.url||y.src;if(h){function a(e){var t,n,a,i,r,o,s,c,u,p,l;g=!0,m.queue=[],f||(f=!0,t=h,s=function(){var e={},t=d.connectionString;if(t)for(var n=t.split(";"),a=0;a<n.length;a++){var i=n[a].split("=");2===i.length&&(e[i[0][b]()]=i[1])}if(!e[C]){var r=e.endpointsuffix,o=r?e.location:null;e[C]="https://"+(o?o+".":"")+"dc."+(r||"services.visualstudio.com")}return e}(),c=s[D]||d[D]||"",u=s[C],p=u?u+"/v2/track":d.endpointUrl,(l=[]).push((n="SDK LOAD Failure: Failed to load Application Insights SDK script (See stack for details)",a=t,i=p,(o=(r=v(c,"Exception")).data).baseType="ExceptionData",o.baseData.exceptions=[{typeName:"SDKLoadFailed",message:n.replace(/\./g,"-"),hasFullStack:!1,stack:n+"\nSnippet failed to load ["+a+"] -- Telemetry is disabled\nHelp Link: https://go.microsoft.com/fwlink/?linkid=2128109\nHost: "+(S&&S.pathname||"_unknown_")+"\nEndpoint: "+i,parsedStack:[]}],r)),l.push(function(e,t,n,a){var i=v(c,"Message"),r=i.data;r.baseType="MessageData";var o=r.baseData;return o.message='AI (Internal): 99 message:"'+("SDK LOAD Failure: Failed to load Application Insights SDK script (See stack for details) ("+n+")").replace(/\"/g,"")+'"',o.properties={endpoint:a},i}(0,0,t,p)),function(e,t){if(JSON){var n=T.fetch;if(n&&!y.useXhr)n(t,{method:N,body:JSON.stringify(e),mode:"cors"});else if(XMLHttpRequest){var a=new XMLHttpRequest;a.open(N,t),a.setRequestHeader("Content-type","application/json"),a.send(JSON.stringify(e))}}}(l,p))}function i(e,t){f||setTimeout(function(){!t&&m.core||a()},500)}var e=function(){var n=l.createElement(k);n.src=h;var e=y[w];return!e&&""!==e||"undefined"==n[w]||(n[w]=e),n.onload=i,n.onerror=a,n.onreadystatechange=function(e,t){"loaded"!==n.readyState&&"complete"!==n.readyState||i(0,t)},n}();y.ld<0?l.getElementsByTagName("head")[0].appendChild(e):setTimeout(function(){l.getElementsByTagName(k)[0].parentNode.appendChild(e)},y.ld||0)}try{m.cookie=l.cookie}catch(p){}function t(e){for(;e.length;)!function(t){m[t]=function(){var e=arguments;g||m.queue.push(function(){m[t].apply(m,e)})}}(e.pop())}var n="track",r="TrackPage",o="TrackEvent";t([n+"Event",n+"PageView",n+"Exception",n+"Trace",n+"DependencyData",n+"Metric",n+"PageViewPerformance","start"+r,"stop"+r,"start"+o,"stop"+o,"addTelemetryInitializer","setAuthenticatedUserContext","clearAuthenticatedUserContext","flush"]),m.SeverityLevel={Verbose:0,Information:1,Warning:2,Error:3,Critical:4};var s=(d.extensionConfig||{}).ApplicationInsightsAnalytics||{};if(!0!==d[I]&&!0!==s[I]){var c="onerror";t(["_"+c]);var u=T[c];T[c]=function(e,t,n,a,i){var r=u&&u(e,t,n,a,i);return!0!==r&&m["_"+c]({message:e,url:t,lineNumber:n,columnNumber:a,error:i}),r},d.autoExceptionInstrumented=!0}return m}(y.cfg);function a(){y.onInit&&y.onInit(n)}(T[t]=n).queue&&0===n.queue.length?(n.queue.push(a),n.trackPageView({})):a()}(window,document,{47src: "https://js.monitor.azure.com/scripts/b/ai.2.min.js", // The SDK URL Source48crossOrigin: "anonymous", 49cfg: { // Application Insights Configuration50 connectionString: 'InstrumentationKey=a1d4132b-49f3-4300-810a-b7f45ce17405;IngestionEndpoint=https://canadacentral-1.in.applicationinsights.azure.com/;LiveEndpoint=https://canadacentral.livediagnostics.monitor.azure.com/;ApplicationId=6026a485-4743-40e2-ba32-6f032f513db1'51}});</script></head>5253<body>54 <!-- Google Tag Manager (noscript) -->55 <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-TS2PTHZ"56 height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>57 <!-- End Google Tag Manager (noscript) -->58 <a id="btn-passer-au-contenu" class="sr-only sr-only-focusable" href="#contenu">Passer au contenu</a>59 60<header id="bandeau-ville">61 <div>62 <a href="/" id="logo-vdq" style="background-image: url('/media/ynyhps4u/logo-ville-quebec-accent.svg')">63 <span class="sr-only">Ville de Québec</span>64 </a>65 </div>66 <button id="mobile-menu-btn" aria-expanded="false">67 <span class="sr-only">Menu</span>68 <svg aria-hidden="true" focusable="false" viewBox="0 0 48 32" width="40" height="40">69 <line id="ligne-1" x1="40" transform="translate(4 4)" stroke="#ffffff" stroke-linecap="round" stroke-width="4"/>70 <line id="ligne-2" x1="40" transform="translate(4 12)" stroke="#ffffff" stroke-linecap="round" stroke-width="4"/>71 <line id="ligne-3" x1="40" transform="translate(4 20)" stroke="#ffffff" stroke-linecap="round" stroke-width="4"/>72 </svg> 73 </button>74</header>75<nav class="menu-principal" aria-label="Menu principal">76 <ul>77 <li class="menu-accueil"><a href="/"><span>Accueil</a></span></li>78 <li class="menu-activites"><a href="/activites/"><span>Activités</a></span></li>79 <li class="menu-lieux dropdown">80 <button81 type="button"82 class="dropdown-btn"83 aria-haspopup="true"84 aria-expanded="false"85 aria-controls="menu-lieux-sub"86 >87 <span>Lieux</span></a>88 </button>89 <ul id="menu-lieux-sub" class="dropdown-menu" hidden>90 <li><a href="/lieux/">Liste des lieux</a></li>91 <li><a href="/carte/">Carte des lieux</a></li>92 </ul>93 </li>94 <li class="menu-mes-activites"><a href="/mon-horaire/"><span>Mon horaire</span></a></li>95 <li class="btn-recherche">96 <button id="btn-recherche"><span><span class="sr-only">Recherche</span></span></button>97 <div id="recherche">98 <form id="searchForm" class="search-form" action="/recherche/" method="get" autocomplete="off">99 <label for="searchQuery" class="sr-only">Recherche</label>100 <input type="search" id="searchQuery" class="form-control" name="query" maxlength="50" value="" placeholder="Que cherchez-vous?">101 <button type="submit"><img src="/media/q1spit1k/picto-recherche-2.svg" alt="Lancer la recherche" width="30" height="30"></button>102 </form>103 </div>104 </li>105 </ul>106</nav>107 108 109<section class="header-banner jaune page-activite">110 <div class="container">111 <div class="logo logo-quebec-animee">112 <img src="/media/mywhttln/logo-quebec-animee.svg" alt="Québec animée">113 </div>114 </div>115</section>116117<main id="contenu" class="page-activite">118 119 120 <section class="entete-image">121 <figure class="image-vedette">122 <img src="/media/4mzlofxm/tdl-fragments.png?cc=0.11405529953917039,0,0,0&width=769&height=434&v=1dd154ef5a1b1b0" alt="">123 124 </figure>125 </section>126 <section class="entete-intro">127 <h1>Fragments de carnets</h1>128 <h2 class="activite-soustitre">Atelier découverte</h2>129<p><span>Avec l’aide de nos guides, vous serez amené.es à explorer plusieurs différentes techniques et thématiques artistiques qui traversent l’exposition. Quatre activités vous seront proposées au mois de juillet et au mois d’août afin que vous puissiez créer les différentes pages de votre carnet : Fragment texturé, Fragment végétal, Fragment transparent et Fragment de collage. Enfin, une activité de reliure vous sera proposée afin de rassembler toutes vos œuvres en un seul carnet.</span></p> </section>130 131 <section class="section-contenu">132 <p class="sr-only">Catégorie(s)</p>133 <ul class="liste-categories">134 <li class="categorie etiquette">Animation</li>135 <li class="categorie etiquette">Art</li>136 <li class="categorie etiquette">Exposition</li>137 </ul>138 139 <div class="grille">140 <div class="grille-tarif">141 <span class="sr-only">Coût : </span>142 <span>Gratuit</span>143 </div>144 <div class="sites-web-externes-wrapper">145 <ul class="sites-web-externes">146147<li><a href="https://sahb.ca/calendrier/6753/" target="_blank" class="site-web-externe">Détails de l'activité</a></li> </ul>148 </div>149 150 </div>151 </section>152 153 154 <section class="section-representations"> 155 156 <div class="grille-date">157 <div class="grille-date-principal">158 <span class="sr-only">Date : </span>Plusieurs dates159 </div>160 </div>161 162 <ul class="liste-representations">163 <li class="">164 <span class="col-date">16530 août 2026 </span>166 <span class="col-heure">16713 h 30 168à 15 h </span> 169 <span class="col-lieu">170 171<a href="/lieux/maison-tessier-dit-laplante/">Maison Tessier-Dit-Laplante</a> </span>172 <span class="col-btn">173 <button class="btn-ajout-favoris btn-ajout-rep" 174 data-activity-id="9149" 175 data-date="2026-08-30" 176 data-heure="13:30"177 data-representation-id="9149__20260830__1330__maison-tessier-dit-laplante">178 Ajouter<span> à mon horaire</span>179 </button>180 </span>181 </li>182 </ul>183 </section>184185 186 187 188 189 <section class="section-meteo">190 191 192 193 <div class="encadre encadre-meteo">194 <p class="info-supp-pluie">L’activité a lieu beau temps comme mauvais temps, sauf si le climat compromet la sécurité des artisans ou du public (orages, vents violents, fortes pluies, etc.)</p>195 </div>196197198 </section>199 200 201 <section class="section-lieu">202 <div class="section-lieu-info">203 <h2 class="sr-only">Lieu</h2>204 205 206 <p class="lieu-nom">Maison Tessier-Dit-Laplante</p>207 <p class="lieu-adresse">2328, avenue Royale</p>208 <p class="lieu-arrondissement">Arrondissement de Beauport</p>209 <div class="section-lieu-info-liens">210 211 <p class="lieu-itineraire"><a href="https://maps.app.goo.gl/XqDuBCSde42Np9j48" target="_blank">Itinéraire</a></p>212 <p class="lieu-accessibilite"><a href="/lieux/maison-tessier-dit-laplante/#accessibilite">Accessibilité du lieu</a></p>213 <p class="lieu-fiche"><a href="/lieux/maison-tessier-dit-laplante/">En savoir plus</a></p>214 </div>215 </div>216 <div class="section-lieu-carte">217 <div id="divMapContainer">218 <div id="map" class="carte-interactive"></div>219 </div>220 </div>221 222 </section>223224 225 226 227 <section class="autres-activites section-separateur">228 <h2 id="titre-autres-activites">Vous aimerez peut-être aussi...</h2>229 <div id="slider-autres-activites" class="carousel">230 <a class="carousel-cell" href="/activites/les-briques-2026/" target="_self">231 <div class="carousel-img">232 <img src="/media/fx4bzogp/les-briques-lise-breton-1f4.jpg?width=320&height=180&v=1dceead869c10c0" alt="" width="320" height="180">233 </div>234 235 236 237 <div class="item-lieu">Parc de la Pointe-aux-Lièvres</div>238 <div class="carousel-titre">239 <h3>Les Briques</h3>240 <p class="item-soustitre">Pique-nique animé : spectacle grand public</p>241 </div>242 <div class="carousel-info">243Plusieurs dates </div>244 245 246 </a>247 <a class="carousel-cell" href="/activites/racine-au-coeur-des-arts-2026/" target="_self">248 <div class="carousel-img">249 <img src="/media/aeye1ogi/racine_arts_web_v2.jpg?width=320&height=180&v=1dd1527c2811450" alt="Affiche « Racine au cœur des arts », événement gratuit les 29 et 30 août 2026 sur la rue Racine, activités artistiques pour toute la famille." width="320" height="180">250 </div>251 252 253 254 <div class="item-lieu">Promenade de la rue Racine</div>255 <div class="carousel-titre">256 <h3>Racine au coeur des arts</h3>257 </div>258 <div class="carousel-info">259Les 29 et 30 août 2026 </div>260 261 262 </a>263 <a class="carousel-cell" href="/activites/marche-public-saint-sauveur/" target="_self">264 <div class="carousel-img">265 <img src="/media/zgnfngcs/marche_saint-sauveur.png?width=320&height=180&v=1dcd1b553ee8aa0" alt="" width="320" height="180">266 </div>267 268 269 270 <div class="item-lieu">Parc Durocher</div>271 <div class="carousel-titre">272 <h3>Marché public Saint-Sauveur</h3>273 </div>274 <div class="carousel-info">275Du 4 juillet au 19 septembre 2026 </div>276 277 278 </a>279 <a class="carousel-cell" href="/activites/journee-portes-ouvertes-des-jardins-du-bassin-louise/" target="_self">280 <div class="carousel-img">281 <img src="/media/qmel5o22/2026-08-21_image_couleursdujardin.jpg?width=320&height=180&v=1dd25d5916107e0" alt="" width="320" height="180">282 </div>283 284 285 286 <div class="item-lieu">Jardins du bassin Louise</div>287 <div class="carousel-titre">288 <h3>Journée portes ouvertes des Jardins du bassin Louise</h3>289 </div>290 <div class="carousel-info">291Plusieurs dates </div>292 293 294 </a>295 <a class="carousel-cell" href="/activites/montcalm-en-fete-2026/" target="_self">296 <div class="carousel-img">297 <img src="/media/3ojfcbza/montcalm_en_fete.jpg?cc=0,0.002450979119553923,0,0.000602016272151086&width=320&height=180&v=1dd04e5bed0f4d0" alt="" width="320" height="180">298 </div>299 300 301 302 <div class="item-lieu">Parc du Musée</div>303 <div class="carousel-titre">304 <h3>Montcalm en fête</h3>305 </div>306 <div class="carousel-info">30729 août 2016 — 10 h </div>308 309 310 </a>311 <a class="carousel-cell" href="/activites/la-petite-fete-interculturelle-de-st-rodrigue/" target="_self">312 <div class="carousel-img">313 <img src="/media/ys0norux/fête-fin-de-saison_québec-animée.png?cc=0,0.002450979119553923,0,0.000602016272151086&width=320&height=180&v=1dd33f0fd80d7b0" alt="" width="320" height="180">314 </div>315 316 317 318 <div class="item-lieu">Parc Henri-Casault</div>319 <div class="carousel-titre">320 <h3>La petite fête interculturelle de St-Rodrigue</h3>321 </div>322 <div class="carousel-info">32329 août 2026 — 10 h </div>324 325 326 </a>327 <a class="carousel-cell" href="/activites/creation-d-un-cyanotype-avec-melina-vera-jaramillo/" target="_self">328 <div class="carousel-img">329 <img src="/media/1r1coxbj/sahb-cyanotype.png?cc=0.09722222222222222,0,0.013888888888888888,0&width=320&height=180&v=1dd33f7eae619b0" alt="Création d'un cyanotype 29 août 2026 10 h à 13 h 30 Activité pour adulte Places limités payantes sur réservation" width="320" height="180">330 </div>331 332 333 334 <div class="item-lieu">Maison Girardin</div>335 <div class="carousel-titre">336 <h3>Création d’un cyanotype avec Melina Vera-Jaramillo</h3>337 </div>338 <div class="carousel-info">33929 août 2026 — 10 h </div>340 341 342 </a>343 <a class="carousel-cell" href="/activites/soiree-multigenerationelle-2026/" target="_self">344 <div class="carousel-img">345 <img src="/media/llcckrc5/fete_sb_2026.png?width=320&height=180&v=1dd24497c46a500" alt="Affiche de fête multigénérationnelle au parc Saint‑Benoît le 29 août, avec projection cinéma dès 20 h et activités familiales." width="320" height="180">346 </div>347 348 349 350 <div class="item-lieu">Parc Saint-Benoît</div>351 <div class="carousel-titre">352 <h3>Soirée Multigénérationelle</h3>353 </div>354 <div class="carousel-info">35529 août 2026 — 17 h </div>356 357 358 </a>359 <a class="carousel-cell" href="/activites/les-dejeuners-animes/" target="_self">360 <div class="carousel-img">361 <img src="/media/tm0cfqcr/déjeuners-animés.png?cc=0.03314659197012142,0.03314659197012138,0.03314659197012142,0.03314659197012146&width=320&height=180&v=1dd193d9f855dc0" alt="" width="320" height="180">362 </div>363 364 365 366 <div class="item-lieu">Parc Maria-Goretti</div>367 <div class="carousel-titre">368 <h3>Les déjeuners animés</h3>369 <p class="item-soustitre">Loisirs du Trait-Carré</p>370 </div>371 <div class="carousel-info">372Plusieurs dates </div>373 374 375 </a>376 <a class="carousel-cell" href="/activites/marche-limoilou-1/" target="_self">377 <div class="carousel-img">378 <img src="/media/3k0neq4o/marche-limoilou2026.jpg?width=320&height=180&v=1dcd267d4f913b0" alt="" width="320" height="180">379 </div>380 381 382 383 <div class="item-lieu">3e Avenue</div>384 <div class="carousel-titre">385 <h3>Marché Limoilou</h3>386 </div>387 <div class="carousel-info">388Du 12 juillet au 20 septembre </div>389 390 391 </a>392 <a class="carousel-cell" href="/activites/matinees-musicales/" target="_self">393 <div class="carousel-img">394 <img src="/media/l4zazljg/festival-4.jpg?width=320&height=180&v=1dc5d64559d7ed0" alt="" width="320" height="180">395 </div>396 397 398 399 <div class="item-lieu">Domaine de Maizerets</div>400 <div class="carousel-titre">401 <h3>Matinées musicales</h3>402 </div>403 <div class="carousel-info">404Plusieurs dates </div>405 406 407 </a>408 <a class="carousel-cell" href="https://www.nuitdesgaleries.com/" target="_blank">409 <div class="carousel-img">410 <img src="/media/dupi4qoo/ndg-2025.jpg?width=320&height=180&v=1dd04e6ad6d6600" alt="" width="320" height="180">411 </div>412 413 414 415 <div class="item-lieu">Place Royale</div>416 <div class="carousel-titre">417 <h3>Nuit des Galeries</h3>418 </div>419 <div class="carousel-info">420Du 3 au 6 septembre 2026 </div>421 422 423 </a>424 <a class="carousel-cell" href="https://fiertedequebec.ca/" target="_blank">425 <div class="carousel-img">426 <img src="/media/jtpkkz4f/festival-3.jpg?width=320&height=180&v=1dc5d645598eaf0" alt="" width="320" height="180">427 </div>428 429 430 431 <div class="item-lieu">Place D'Youville</div>432 <div class="carousel-titre">433 <h3>Fierté de Québec</h3>434 </div>435 <div class="carousel-info">436Du 4 au 6 septembre </div>437 438 439 </a>440 <a class="carousel-cell" href="https://festivalmarocaindequebec.com/" target="_blank">441 <div class="carousel-img">442 <img src="/media/2h0pqyta/photo-défilé-fmq-2026.jpg?width=320&height=180&v=1dd33ffbd399ed0" alt="Festival marocain de Québec" width="320" height="180">443 </div>444 445 446 447 <div class="item-lieu">Parc Roland-Beaudin</div>448 <div class="carousel-titre">449 <h3>Festival marocain de Québec</h3>450 </div>451 <div class="carousel-info">452Du 4 au 6 septembre 2026 </div>453 454 455 </a>456 <a class="carousel-cell" href="/activites/videoprojection-sur-la-bibliotheque-gabrielle-roy-avec-irina-gonzalez/" target="_self">457 <div class="carousel-img">458 <img src="/media/zpmo3k2f/lueursmemoire_irina_16x9-22.jpg?width=320&height=180&v=1dd30aedc55b4b0" alt="" width="320" height="180">459 </div>460 461 462 463 <div class="item-lieu">Place Jacques-Cartier</div>464 <div class="carousel-titre">465 <h3>Vidéoprojection sur la bibliothèque Gabrielle-Roy avec Irina González</h3>466 </div>467 <div class="carousel-info">4684 septembre 2026 — 19 h 45 </div>469 470 471 </a>472 <a class="carousel-cell" href="https://fcvq.ca/" target="_blank">473 <div class="carousel-img">474 <img src="/media/dacpmwet/festival-de-cinéma_2026.jpg?width=320&height=180&v=1dd04e81fc9de30" alt="" width="320" height="180">475 </div>476 477 478 479 <div class="item-lieu">Place D'Youville</div>480 <div class="carousel-titre">481 <h3>Festival de cinéma de la Ville de Québec</h3>482 </div>483 <div class="carousel-info">484Du 9 au 13 septembre 2026 </div>485 486 487 </a>488 <a class="carousel-cell" href="/activites/pop-up-brio/" target="_self">489 <div class="carousel-img">490 <img src="/media/dtrl5suk/711774812_1000810315622126_4778391780647702927_n.jpg?cc=0,0.15283203125,0,0.28466796875&width=320&height=180&v=1dcfffc144d6450" alt="" width="320" height="180">491 </div>492 493 494 495 <div class="item-lieu">Parc Gracia-Boivin</div>496 <div class="carousel-titre">497 <h3>Pop-up Brio</h3>498 </div>499 <div class="carousel-info">500Plusieurs dates </div>501 502 503 </a>504 <a class="carousel-cell" href="/activites/fete-du-quartier-saint-jean-baptiste/" target="_self">505 <div class="carousel-img">506 <img src="/media/pbqbslhf/photo-fe-te-de-quartier.jpg?width=320&height=180&v=1dce9f72fb29960" alt="" width="320" height="180">507 </div>508 509 510 511 <div class="item-lieu">Rue Saint-Jean (Quartier Saint-Jean-Baptiste)</div>512 <div class="carousel-titre">513 <h3>Fête du quartier Saint-Jean-Baptiste</h3>514 </div>515 <div class="carousel-info">516Les 12 et 13 septembre 2026 </div>517 518 519 </a>520 <a class="carousel-cell" href="/activites/journee-sportive-de-24h-chronosports/" target="_self">521 <div class="carousel-img">522 <img src="/media/5n4hthn3/affiche-js-dde-1-1.png?width=320&height=180&v=1dd1918d83def30" alt="" width="320" height="180">523 </div>524 525 526 527 <div class="item-lieu">Parc Victoria</div>528 <div class="carousel-titre">529 <h3>Journée sportive de 24h ChronoSports </h3>530 </div>531 <div class="carousel-info">53212 septembre 2026 — 8 h </div>533 534 535 </a>536 <a class="carousel-cell" href="/activites/marche-des-frimousses/" target="_self">537 <div class="carousel-img">538 <img src="/media/tz4fyrnx/jeunesse-4.jpg?width=320&height=180&v=1dc5d6455840360" alt="" width="320" height="180">539 </div>540 541 542 543 <div class="item-lieu">Parc Jean-Guyon</div>544 <div class="carousel-titre">545 <h3>Marché des Frimousses </h3>546 </div>547 <div class="carousel-info">54812 septembre 2026 — 9 h </div>549 550 551 </a>552 </div>553 <p class="aligne-droite"><a href="/activites/" class="btn btn-suivant">Voir toutes les activités</a></p>554 </section>555556557 558</main>559560561562 563 <footer>564 <div id="footer-content-wrapper">565 566 <div id="logo-footer-ville" class="logo">567 <a href="https://www.ville.quebec.qc.ca/" target="_blank">568 <img src="/media/a5ofpcvc/logo-ville-quebec-accent.svg" alt="Ville de Québec, l'accent d'amérique">569 </a>570 </div>571 572 <nav aria-label="Lien partenaires">573 <ul>574 <li><a href="https://www.bibliothequedequebec.qc.ca/" rel="noopener" target="_blank">Bibliothèque de Québec</a></li>575 <li><a href="https://www.quebec-cite.com/fr" rel="noopener" target="_blank">Destination Québec cité</a></li>576 <li><a href="https://expocite.com/" rel="noopener" target="_blank">ExpoCité</a></li>577 <li><a href="https://tourismewendake.ca/" rel="noopener" target="_blank">Wendake</a></li>578 </ul>579 </nav>580 <nav aria-label="Menu secondaire">581 <ul>582 <li><a href="https://www.ville.quebec.qc.ca/" rel="noopener" target="_blank">Site Web de la Ville de Québec</a></li>583 <li><a href="https://www.ville.quebec.qc.ca/apropos/confidentialite/" rel="noopener" target="_blank">Politique de confidentialité</a></li>584 <li><a href="https://www.ville.quebec.qc.ca/nous_joindre/" rel="noopener" target="_blank">Joindre la Ville de Québec</a></li>585 </ul>586 587 <ul class="btn-medias-sociaux" aria-label="Réseaux sociaux">588 <li>589 <a href="https://www.facebook.com/QuebecVille/"590 class="btn-medias-sociaux__lien picto-facebook blanc"591 aria-label="Ville de Québec sur Facebook" rel="noopener" target="_blank">592 <span class="btn-medias-sociaux__etiquette" aria-hidden="true">593 Facebook594 </span>595 </a>596 </li>597 598 <li>599 <a href="https://twitter.com/villequebec"600 class="btn-medias-sociaux__lien picto-twitter-2 blanc"601 aria-label="Ville de Québec sur X" rel="noopener" target="_blank">602 <span class="btn-medias-sociaux__etiquette" aria-hidden="true">603 X604 </span>605 </a>606 </li>607 608 <li>609 <a href="https://www.youtube.com/user/QuebecVille"610 class="btn-medias-sociaux__lien picto-youtube blanc"611 aria-label="Ville de Québec sur YouTube" rel="noopener" target="_blank">612 <span class="btn-medias-sociaux__etiquette" aria-hidden="true">613 YouTube614 </span>615 </a>616 </li>617 618 <li>619 <a href="https://www.instagram.com/villequebec/"620 class="btn-medias-sociaux__lien picto-instagram blanc"621 aria-label="Ville de Québec sur Instagram" rel="noopener" target="_blank">622 <span class="btn-medias-sociaux__etiquette" aria-hidden="true">623 Instagram624 </span>625 </a>626 </li>627 628 <li>629 <a href="https://www.linkedin.com/company/ville-de-quebec/"630 class="btn-medias-sociaux__lien picto-linkedin blanc"631 aria-label="Ville de Québec sur LinkedIn" rel="noopener" target="_blank">632 <span class="btn-medias-sociaux__etiquette" aria-hidden="true">633 LinkedIn634 </span>635 </a>636 </li>637 638 <li>639 <a href="https://www.ville.quebec.qc.ca/apropos/espace-presse/abonnement/infolettres.aspx"640 class="btn-medias-sociaux__lien picto-courriel blanc"641 aria-label="S’abonner aux infolettres" rel="noopener" target="_blank">642 <span class="btn-medias-sociaux__etiquette" aria-hidden="true">643 Infolettres644 </span>645 </a>646 </li>647 </ul>648 </nav>649 </div>650 <div id="footer-copyright">651 © Ville de Québec, 2026. Tous droits réservés.652 </div>653</footer>654 655 <script src="/sc/d93a9f58.js.vfbcb1968996e615c45c0e9ee66984412a5f873dc"></script>656 657 <script src="https://unpkg.com/flickity@2/dist/flickity.pkgd.min.js"></script>658 <script>659 // Variables pour les carrousels et leurs paramètres660 let sliderAutresActivites;661 let wrapAroundAutresActivites;662 663 // Calculer les valeurs de wrapAround pour chaque carrousel lors du chargement664 function calculateWrapAround() {665 // wrapAround est toujours false pour les écrans à partir de 1024px666 if (window.matchMedia("(min-width: 1024px)").matches) {667 wrapAroundAutresActivites = false;668 } else {669 // Sinon, on évalue le nombre d'éléments pour les écrans plus petits670 wrapAroundAutresActivites = shouldWrapAround('#slider-autres-activites', 4, 3);671 }672 }673674 // Ajuster Flickity pour chaque carrousel675 function adjustFlickity() {676 initializeOrAdjustCarousel('#slider-autres-activites', wrapAroundAutresActivites, sliderAutresActivites, 'Vous aimerez peut-être aussi...', 'titre-autres-activites');677 }678 679 // Initialiser les carrousels au chargement de la page680 calculateWrapAround();681 adjustFlickity();682 683 // Ajuster Flickity lorsque la fenêtre est redimensionnée684 window.addEventListener('resize', adjustFlickity);685686 687 688 /* ==========================================================================689 Gestion de l'ajout à Mon horaire690 ========================================================================== */691 692 document.addEventListener("DOMContentLoaded", function () {693 // Fonction pour lire un cookie694 function getCookie(name) {695 const value = `; ${document.cookie}`;696 const parts = value.split(`; ${name}=`);697 if (parts.length === 2) return decodeURIComponent(parts.pop().split(";").shift());698 }699 700 // Fonction pour écrire un cookie701 function setCookie(name, value, days) {702 const date = new Date();703 date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);704 const expires = `expires=${date.toUTCString()}`;705 document.cookie = `${name}=${encodeURIComponent(value)}; ${expires}; path=/; domain=${window.location.hostname}`;706 }707 708 // Fonction pour valider que myActivities est bien un tableau709 function isValidActivitiesArray(value) {710 try {711 const parsed = JSON.parse(value);712 return Array.isArray(parsed) && parsed.every((id) => typeof id === "string");713 } catch (e) {714 return false;715 }716 }717 718 // Initialiser le cookie myActivities719 let myActivities = isValidActivitiesArray(getCookie("QuebecAnimeeActivites"))720 ? JSON.parse(getCookie("QuebecAnimeeActivites"))721 : [];722 723 // Récupère l'ID de l'activité actuelle724 const activityId = "9149"; // Remplacé par Razor lors du rendu725 726 // Si l'ID de l'activité actuelle est dans myActivities, mettre le bouton en mode "Ajouté"727 const mainButton = document.getElementById("addToMyActivities");728 if (mainButton && myActivities.includes(activityId)) {729 mainButton.innerHTML = "Ajoutée<span> à mon horaire</span>";730 mainButton.classList.add("is-ajoute");731 }732 733 // Gestionnaire d'événement pour le bouton de l'activité principale734 if (mainButton) {735 mainButton.addEventListener("click", function (event) {736 event.preventDefault();737 738 if (!myActivities.includes(activityId)) {739 // Ajouter l'activité et mettre à jour le cookie740 myActivities.push(activityId);741 setCookie("QuebecAnimeeActivites", JSON.stringify(myActivities), 365);742 743 // Mettre à jour l'interface du bouton744 this.innerHTML = "Ajoutée<span> à mon horaire</span>";745 this.classList.add("is-ajoute");746 } else {747 // Redirection vers "Mon horaire" si l'activité est déjà ajoutée748 window.location.href = "/mon-horaire";749 }750 });751 }752 753 // Mise à jour et gestion des boutons pour les représentations multiples754 document.querySelectorAll(".btn-ajout-rep").forEach((button) => {755 // Récupérer le representationId depuis le dataset756 const uniqueRepresentationId = button.dataset.representationId;757 758 // Vérifier si l'ID unique est déjà présent dans myActivities759 if (myActivities.includes(uniqueRepresentationId)) {760 button.innerHTML = "Ajoutée<span> à mon horaire</span>";761 button.classList.add("is-ajoute");762 }763 764 // Ajouter un gestionnaire d'événement pour chaque bouton765 button.addEventListener("click", function (event) {766 event.preventDefault();767 768 if (!myActivities.includes(uniqueRepresentationId)) {769 // Ajouter l'ID unique de la représentation et mettre à jour le cookie770 myActivities.push(uniqueRepresentationId);771 setCookie("QuebecAnimeeActivites", JSON.stringify(myActivities), 365);772 773 // Mettre à jour l'interface du bouton774 this.innerHTML = "Ajoutée<span> à mon horaire</span>";775 this.classList.add("is-ajoute");776 } else {777 // Redirection vers "Mon horaire" si l'élément est déjà ajouté778 window.location.href = "/mon-horaire";779 }780 });781 });782 });783784 785 786 document.querySelectorAll('.menu-activites a').forEach(function(anchor) {787 anchor.classList.add('hover');788 });789 </script>790 791 <script>792 /* ==========================================================================793 Affichage de la carte interactive avec un marqueur sur le lieu794 ========================================================================== */795 (function () {796 797 const longitude = parseFloat("-71.1577132");798 const latitude = parseFloat("46.8848201");799 const arcgisUrl = "https://js.arcgis.com/4.32/";800 801 function initMap() {802 require([803 "esri/WebMap",804 "esri/views/MapView",805 "esri/geometry/Extent",806 "esri/geometry/Point",807 "esri/Graphic",808 "esri/layers/GraphicsLayer",809 "esri/symbols/PictureMarkerSymbol"810 ], function (WebMap, MapView, Extent, Point, Graphic, GraphicsLayer, PictureMarkerSymbol) {811 812 const extentLimite = new Extent({813 xmin: -71.50,814 ymin: 46.7139,815 xmax: -71.00,816 ymax: 46.9639,817 spatialReference: 4326818 });819 820 const webmap = new WebMap({821 portalItem: { id: "62833c4f7e9c43bbb455bea5c1d23733" }822 });823 824 const view = new MapView({825 container: "map",826 map: webmap,827 center: [longitude, latitude],828 zoom: 7,829 constraints: {830 geometry: extentLimite, // Limite de la navigation (pan)831 minZoom: 1, // Zoom minimal832 maxZoom: 9, // Zoom maximal833 snapToZoom: false // Permet un zoom fluide834 }835 });836 837 const layer = new GraphicsLayer();838 webmap.add(layer);839 840 const marker = new Graphic({841 geometry: new Point({ longitude, latitude }),842 symbol: new PictureMarkerSymbol({843 url: "data:image/png;base64,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",844 width: "43px",845 height: "43px",846 xoffset: 1,847 yoffset: 12848 })849 });850 851 layer.add(marker);852 });853 }854 if (window.require) {855 // API déjà chargée856 initMap();857 } else {858 // Charger dynamiquement le script si non chargé859 const script = document.createElement("script");860 script.src = arcgisUrl;861 script.onload = initMap;862 document.head.appendChild(script);863 }864 })();865 </script>866867</body>868</html>