
<!DOCTYPE html>
<html class="no-js" lang="fr">
<head>
<title>
                                [Résolu] Titre avec image de fond  par NassNassim   - OpenClassrooms
                    </title>
<script type="text/javascript">
            var App = {};
            App.startTime = (new Date()).getTime();

            var _sf_startpt = App.startTime;
        </script>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta charset="utf-8" /><script type="text/javascript">(window.NREUM||(NREUM={})).init={privacy:{cookies_enabled:false},ajax:{deny_list:[]}};(window.NREUM||(NREUM={})).loader_config={xpid:"Vg8PUV5WABABUVdaBgQBUVc=",licenseKey:"NRJS-5b58725ce0d442079d0",applicationID:"156815673"};window.NREUM||(NREUM={}),__nr_require=function(t,e,n){function r(n){if(!e[n]){var i=e[n]={exports:{}};t[n][0].call(i.exports,function(e){var i=t[n][1][e];return r(i||e)},i,i.exports)}return e[n].exports}if("function"==typeof __nr_require)return __nr_require;for(var i=0;i<n.length;i++)r(n[i]);return r}({1:[function(t,e,n){function r(t){try{s.console&&console.log(t)}catch(e){}}var i,o=t("ee"),a=t(27),s={};try{i=localStorage.getItem("__nr_flags").split(","),console&&"function"==typeof console.log&&(s.console=!0,i.indexOf("dev")!==-1&&(s.dev=!0),i.indexOf("nr_dev")!==-1&&(s.nrDev=!0))}catch(c){}s.nrDev&&o.on("internal-error",function(t){r(t.stack)}),s.dev&&o.on("fn-err",function(t,e,n){r(n.stack)}),s.dev&&(r("NR AGENT IN DEVELOPMENT MODE"),r("flags: "+a(s,function(t,e){return t}).join(", ")))},{}],2:[function(t,e,n){function r(t,e,n,r,s){try{p?p-=1:i(s||new UncaughtException(t,e,n),!0)}catch(f){try{o("ierr",[f,c.now(),!0])}catch(d){}}return"function"==typeof u&&u.apply(this,a(arguments))}function UncaughtException(t,e,n){this.message=t||"Uncaught error with no additional information",this.sourceURL=e,this.line=n}function i(t,e){var n=e?null:c.now();o("err",[t,n])}var o=t("handle"),a=t(28),s=t("ee"),c=t("loader"),f=t("gos"),u=window.onerror,d=!1,l="nr@seenError";if(!c.disabled){var p=0;c.features.err=!0,t(1),window.onerror=r;try{throw new Error}catch(h){"stack"in h&&(t(10),t(9),"addEventListener"in window&&t(6),c.xhrWrappable&&t(11),d=!0)}s.on("fn-start",function(t,e,n){d&&(p+=1)}),s.on("fn-err",function(t,e,n){d&&!n[l]&&(f(n,l,function(){return!0}),this.thrown=!0,i(n))}),s.on("fn-end",function(){d&&!this.thrown&&p>0&&(p-=1)}),s.on("internal-error",function(t){o("ierr",[t,c.now(),!0])})}},{}],3:[function(t,e,n){var r=t("loader");r.disabled||(r.features.ins=!0)},{}],4:[function(t,e,n){function r(){var t=new PerformanceObserver(function(t,e){var n=t.getEntries();s(v,[n])});try{t.observe({entryTypes:["resource"]})}catch(e){}}function i(t){if(s(v,[window.performance.getEntriesByType(w)]),window.performance["c"+l])try{window.performance[h](m,i,!1)}catch(t){}else try{window.performance[h]("webkit"+m,i,!1)}catch(t){}}function o(t){}if(window.performance&&window.performance.timing&&window.performance.getEntriesByType){var a=t("ee"),s=t("handle"),c=t(10),f=t(9),u=t(5),d=t(19),l="learResourceTimings",p="addEventListener",h="removeEventListener",m="resourcetimingbufferfull",v="bstResource",w="resource",g="-start",y="-end",x="fn"+g,b="fn"+y,E="bstTimer",R="pushState",S=t("loader");if(!S.disabled){S.features.stn=!0,t(8),"addEventListener"in window&&t(6);var O=NREUM.o.EV;a.on(x,function(t,e){var n=t[0];n instanceof O&&(this.bstStart=S.now())}),a.on(b,function(t,e){var n=t[0];n instanceof O&&s("bst",[n,e,this.bstStart,S.now()])}),c.on(x,function(t,e,n){this.bstStart=S.now(),this.bstType=n}),c.on(b,function(t,e){s(E,[e,this.bstStart,S.now(),this.bstType])}),f.on(x,function(){this.bstStart=S.now()}),f.on(b,function(t,e){s(E,[e,this.bstStart,S.now(),"requestAnimationFrame"])}),a.on(R+g,function(t){this.time=S.now(),this.startPath=location.pathname+location.hash}),a.on(R+y,function(t){s("bstHist",[location.pathname+location.hash,this.startPath,this.time])}),u()?(s(v,[window.performance.getEntriesByType("resource")]),r()):p in window.performance&&(window.performance["c"+l]?window.performance[p](m,i,d(!1)):window.performance[p]("webkit"+m,i,d(!1))),document[p]("scroll",o,d(!1)),document[p]("keypress",o,d(!1)),document[p]("click",o,d(!1))}}},{}],5:[function(t,e,n){e.exports=function(){return"PerformanceObserver"in window&&"function"==typeof window.PerformanceObserver}},{}],6:[function(t,e,n){function r(t){for(var e=t;e&&!e.hasOwnProperty(u);)e=Object.getPrototypeOf(e);e&&i(e)}function i(t){s.inPlace(t,[u,d],"-",o)}function o(t,e){return t[1]}var a=t("ee").get("events"),s=t("wrap-function")(a,!0),c=t("gos"),f=XMLHttpRequest,u="addEventListener",d="removeEventListener";e.exports=a,"getPrototypeOf"in Object?(r(document),r(window),r(f.prototype)):f.prototype.hasOwnProperty(u)&&(i(window),i(f.prototype)),a.on(u+"-start",function(t,e){var n=t[1];if(null!==n&&("function"==typeof n||"object"==typeof n)){var r=c(n,"nr@wrapped",function(){function t(){if("function"==typeof n.handleEvent)return n.handleEvent.apply(n,arguments)}var e={object:t,"function":n}[typeof n];return e?s(e,"fn-",null,e.name||"anonymous"):n});this.wrapped=t[1]=r}}),a.on(d+"-start",function(t){t[1]=this.wrapped||t[1]})},{}],7:[function(t,e,n){function r(t,e,n){var r=t[e];"function"==typeof r&&(t[e]=function(){var t=o(arguments),e={};i.emit(n+"before-start",[t],e);var a;e[m]&&e[m].dt&&(a=e[m].dt);var s=r.apply(this,t);return i.emit(n+"start",[t,a],s),s.then(function(t){return i.emit(n+"end",[null,t],s),t},function(t){throw i.emit(n+"end",[t],s),t})})}var i=t("ee").get("fetch"),o=t(28),a=t(27);e.exports=i;var s=window,c="fetch-",f=c+"body-",u=["arrayBuffer","blob","json","text","formData"],d=s.Request,l=s.Response,p=s.fetch,h="prototype",m="nr@context";d&&l&&p&&(a(u,function(t,e){r(d[h],e,f),r(l[h],e,f)}),r(s,"fetch",c),i.on(c+"end",function(t,e){var n=this;if(e){var r=e.headers.get("content-length");null!==r&&(n.rxSize=r),i.emit(c+"done",[null,e],n)}else i.emit(c+"done",[t],n)}))},{}],8:[function(t,e,n){var r=t("ee").get("history"),i=t("wrap-function")(r);e.exports=r;var o=window.history&&window.history.constructor&&window.history.constructor.prototype,a=window.history;o&&o.pushState&&o.replaceState&&(a=o),i.inPlace(a,["pushState","replaceState"],"-")},{}],9:[function(t,e,n){var r=t("ee").get("raf"),i=t("wrap-function")(r),o="equestAnimationFrame";e.exports=r,i.inPlace(window,["r"+o,"mozR"+o,"webkitR"+o,"msR"+o],"raf-"),r.on("raf-start",function(t){t[0]=i(t[0],"fn-")})},{}],10:[function(t,e,n){function r(t,e,n){t[0]=a(t[0],"fn-",null,n)}function i(t,e,n){this.method=n,this.timerDuration=isNaN(t[1])?0:+t[1],t[0]=a(t[0],"fn-",this,n)}var o=t("ee").get("timer"),a=t("wrap-function")(o),s="setTimeout",c="setInterval",f="clearTimeout",u="-start",d="-";e.exports=o,a.inPlace(window,[s,"setImmediate"],s+d),a.inPlace(window,[c],c+d),a.inPlace(window,[f,"clearImmediate"],f+d),o.on(c+u,r),o.on(s+u,i)},{}],11:[function(t,e,n){function r(t,e){d.inPlace(e,["onreadystatechange"],"fn-",s)}function i(){var t=this,e=u.context(t);t.readyState>3&&!e.resolved&&(e.resolved=!0,u.emit("xhr-resolved",[],t)),d.inPlace(t,y,"fn-",s)}function o(t){x.push(t),m&&(E?E.then(a):w?w(a):(R=-R,S.data=R))}function a(){for(var t=0;t<x.length;t++)r([],x[t]);x.length&&(x=[])}function s(t,e){return e}function c(t,e){for(var n in t)e[n]=t[n];return e}t(6);var f=t("ee"),u=f.get("xhr"),d=t("wrap-function")(u),l=t(19),p=NREUM.o,h=p.XHR,m=p.MO,v=p.PR,w=p.SI,g="readystatechange",y=["onload","onerror","onabort","onloadstart","onloadend","onprogress","ontimeout"],x=[];e.exports=u;var b=window.XMLHttpRequest=function(t){var e=new h(t);try{u.emit("new-xhr",[e],e),e.addEventListener(g,i,l(!1))}catch(n){try{u.emit("internal-error",[n])}catch(r){}}return e};if(c(h,b),b.prototype=h.prototype,d.inPlace(b.prototype,["open","send"],"-xhr-",s),u.on("send-xhr-start",function(t,e){r(t,e),o(e)}),u.on("open-xhr-start",r),m){var E=v&&v.resolve();if(!w&&!v){var R=1,S=document.createTextNode(R);new m(a).observe(S,{characterData:!0})}}else f.on("fn-end",function(t){t[0]&&t[0].type===g||a()})},{}],12:[function(t,e,n){function r(t){if(!s(t))return null;var e=window.NREUM;if(!e.loader_config)return null;var n=(e.loader_config.accountID||"").toString()||null,r=(e.loader_config.agentID||"").toString()||null,f=(e.loader_config.trustKey||"").toString()||null;if(!n||!r)return null;var h=p.generateSpanId(),m=p.generateTraceId(),v=Date.now(),w={spanId:h,traceId:m,timestamp:v};return(t.sameOrigin||c(t)&&l())&&(w.traceContextParentHeader=i(h,m),w.traceContextStateHeader=o(h,v,n,r,f)),(t.sameOrigin&&!u()||!t.sameOrigin&&c(t)&&d())&&(w.newrelicHeader=a(h,m,v,n,r,f)),w}function i(t,e){return"00-"+e+"-"+t+"-01"}function o(t,e,n,r,i){var o=0,a="",s=1,c="",f="";return i+"@nr="+o+"-"+s+"-"+n+"-"+r+"-"+t+"-"+a+"-"+c+"-"+f+"-"+e}function a(t,e,n,r,i,o){var a="btoa"in window&&"function"==typeof window.btoa;if(!a)return null;var s={v:[0,1],d:{ty:"Browser",ac:r,ap:i,id:t,tr:e,ti:n}};return o&&r!==o&&(s.d.tk=o),btoa(JSON.stringify(s))}function s(t){return f()&&c(t)}function c(t){var e=!1,n={};if("init"in NREUM&&"distributed_tracing"in NREUM.init&&(n=NREUM.init.distributed_tracing),t.sameOrigin)e=!0;else if(n.allowed_origins instanceof Array)for(var r=0;r<n.allowed_origins.length;r++){var i=h(n.allowed_origins[r]);if(t.hostname===i.hostname&&t.protocol===i.protocol&&t.port===i.port){e=!0;break}}return e}function f(){return"init"in NREUM&&"distributed_tracing"in NREUM.init&&!!NREUM.init.distributed_tracing.enabled}function u(){return"init"in NREUM&&"distributed_tracing"in NREUM.init&&!!NREUM.init.distributed_tracing.exclude_newrelic_header}function d(){return"init"in NREUM&&"distributed_tracing"in NREUM.init&&NREUM.init.distributed_tracing.cors_use_newrelic_header!==!1}function l(){return"init"in NREUM&&"distributed_tracing"in NREUM.init&&!!NREUM.init.distributed_tracing.cors_use_tracecontext_headers}var p=t(24),h=t(14);e.exports={generateTracePayload:r,shouldGenerateTrace:s}},{}],13:[function(t,e,n){function r(t){var e=this.params,n=this.metrics;if(!this.ended){this.ended=!0;for(var r=0;r<l;r++)t.removeEventListener(d[r],this.listener,!1);return e.protocol&&"data"===e.protocol?void g("Ajax/DataUrl/Excluded"):void(e.aborted||(n.duration=a.now()-this.startTime,this.loadCaptureCalled||4!==t.readyState?null==e.status&&(e.status=0):o(this,t),n.cbTime=this.cbTime,s("xhr",[e,n,this.startTime,this.endTime,"xhr"],this)))}}function i(t,e){var n=c(e),r=t.params;r.hostname=n.hostname,r.port=n.port,r.protocol=n.protocol,r.host=n.hostname+":"+n.port,r.pathname=n.pathname,t.parsedOrigin=n,t.sameOrigin=n.sameOrigin}function o(t,e){t.params.status=e.status;var n=v(e,t.lastSize);if(n&&(t.metrics.rxSize=n),t.sameOrigin){var r=e.getResponseHeader("X-NewRelic-App-Data");r&&(t.params.cat=r.split(", ").pop())}t.loadCaptureCalled=!0}var a=t("loader");if(a.xhrWrappable&&!a.disabled){var s=t("handle"),c=t(14),f=t(12).generateTracePayload,u=t("ee"),d=["load","error","abort","timeout"],l=d.length,p=t("id"),h=t(20),m=t(18),v=t(15),w=t(19),g=t(21).recordSupportability,y=NREUM.o.REQ,x=window.XMLHttpRequest;a.features.xhr=!0,t(11),t(7),u.on("new-xhr",function(t){var e=this;e.totalCbs=0,e.called=0,e.cbTime=0,e.end=r,e.ended=!1,e.xhrGuids={},e.lastSize=null,e.loadCaptureCalled=!1,e.params=this.params||{},e.metrics=this.metrics||{},t.addEventListener("load",function(n){o(e,t)},w(!1)),h&&(h>34||h<10)||t.addEventListener("progress",function(t){e.lastSize=t.loaded},w(!1))}),u.on("open-xhr-start",function(t){this.params={method:t[0]},i(this,t[1]),this.metrics={}}),u.on("open-xhr-end",function(t,e){"loader_config"in NREUM&&"xpid"in NREUM.loader_config&&this.sameOrigin&&e.setRequestHeader("X-NewRelic-ID",NREUM.loader_config.xpid);var n=f(this.parsedOrigin);if(n){var r=!1;n.newrelicHeader&&(e.setRequestHeader("newrelic",n.newrelicHeader),r=!0),n.traceContextParentHeader&&(e.setRequestHeader("traceparent",n.traceContextParentHeader),n.traceContextStateHeader&&e.setRequestHeader("tracestate",n.traceContextStateHeader),r=!0),r&&(this.dt=n)}}),u.on("send-xhr-start",function(t,e){var n=this.metrics,r=t[0],i=this;if(n&&r){var o=m(r);o&&(n.txSize=o)}this.startTime=a.now(),this.listener=function(t){try{"abort"!==t.type||i.loadCaptureCalled||(i.params.aborted=!0),("load"!==t.type||i.called===i.totalCbs&&(i.onloadCalled||"function"!=typeof e.onload))&&i.end(e)}catch(n){try{u.emit("internal-error",[n])}catch(r){}}};for(var s=0;s<l;s++)e.addEventListener(d[s],this.listener,w(!1))}),u.on("xhr-cb-time",function(t,e,n){this.cbTime+=t,e?this.onloadCalled=!0:this.called+=1,this.called!==this.totalCbs||!this.onloadCalled&&"function"==typeof n.onload||this.end(n)}),u.on("xhr-load-added",function(t,e){var n=""+p(t)+!!e;this.xhrGuids&&!this.xhrGuids[n]&&(this.xhrGuids[n]=!0,this.totalCbs+=1)}),u.on("xhr-load-removed",function(t,e){var n=""+p(t)+!!e;this.xhrGuids&&this.xhrGuids[n]&&(delete this.xhrGuids[n],this.totalCbs-=1)}),u.on("xhr-resolved",function(){this.endTime=a.now()}),u.on("addEventListener-end",function(t,e){e instanceof x&&"load"===t[0]&&u.emit("xhr-load-added",[t[1],t[2]],e)}),u.on("removeEventListener-end",function(t,e){e instanceof x&&"load"===t[0]&&u.emit("xhr-load-removed",[t[1],t[2]],e)}),u.on("fn-start",function(t,e,n){e instanceof x&&("onload"===n&&(this.onload=!0),("load"===(t[0]&&t[0].type)||this.onload)&&(this.xhrCbStart=a.now()))}),u.on("fn-end",function(t,e){this.xhrCbStart&&u.emit("xhr-cb-time",[a.now()-this.xhrCbStart,this.onload,e],e)}),u.on("fetch-before-start",function(t){function e(t,e){var n=!1;return e.newrelicHeader&&(t.set("newrelic",e.newrelicHeader),n=!0),e.traceContextParentHeader&&(t.set("traceparent",e.traceContextParentHeader),e.traceContextStateHeader&&t.set("tracestate",e.traceContextStateHeader),n=!0),n}var n,r=t[1]||{};"string"==typeof t[0]?n=t[0]:t[0]&&t[0].url?n=t[0].url:window.URL&&t[0]&&t[0]instanceof URL&&(n=t[0].href),n&&(this.parsedOrigin=c(n),this.sameOrigin=this.parsedOrigin.sameOrigin);var i=f(this.parsedOrigin);if(i&&(i.newrelicHeader||i.traceContextParentHeader))if("string"==typeof t[0]||window.URL&&t[0]&&t[0]instanceof URL){var o={};for(var a in r)o[a]=r[a];o.headers=new Headers(r.headers||{}),e(o.headers,i)&&(this.dt=i),t.length>1?t[1]=o:t.push(o)}else t[0]&&t[0].headers&&e(t[0].headers,i)&&(this.dt=i)}),u.on("fetch-start",function(t,e){this.params={},this.metrics={},this.startTime=a.now(),this.dt=e,t.length>=1&&(this.target=t[0]),t.length>=2&&(this.opts=t[1]);var n,r=this.opts||{},o=this.target;if("string"==typeof o?n=o:"object"==typeof o&&o instanceof y?n=o.url:window.URL&&"object"==typeof o&&o instanceof URL&&(n=o.href),i(this,n),"data"!==this.params.protocol){var s=(""+(o&&o instanceof y&&o.method||r.method||"GET")).toUpperCase();this.params.method=s,this.txSize=m(r.body)||0}}),u.on("fetch-done",function(t,e){if(this.endTime=a.now(),this.params||(this.params={}),"data"===this.params.protocol)return void g("Ajax/DataUrl/Excluded");this.params.status=e?e.status:0;var n;"string"==typeof this.rxSize&&this.rxSize.length>0&&(n=+this.rxSize);var r={txSize:this.txSize,rxSize:n,duration:a.now()-this.startTime};s("xhr",[this.params,r,this.startTime,this.endTime,"fetch"],this)})}},{}],14:[function(t,e,n){var r={};e.exports=function(t){if(t in r)return r[t];if(0===(t||"").indexOf("data:"))return{protocol:"data"};var e=document.createElement("a"),n=window.location,i={};e.href=t,i.port=e.port;var o=e.href.split("://");!i.port&&o[1]&&(i.port=o[1].split("/")[0].split("@").pop().split(":")[1]),i.port&&"0"!==i.port||(i.port="https"===o[0]?"443":"80"),i.hostname=e.hostname||n.hostname,i.pathname=e.pathname,i.protocol=o[0],"/"!==i.pathname.charAt(0)&&(i.pathname="/"+i.pathname);var a=!e.protocol||":"===e.protocol||e.protocol===n.protocol,s=e.hostname===document.domain&&e.port===n.port;return i.sameOrigin=a&&(!e.hostname||s),"/"===i.pathname&&(r[t]=i),i}},{}],15:[function(t,e,n){function r(t,e){var n=t.responseType;return"json"===n&&null!==e?e:"arraybuffer"===n||"blob"===n||"json"===n?i(t.response):"text"===n||""===n||void 0===n?i(t.responseText):void 0}var i=t(18);e.exports=r},{}],16:[function(t,e,n){function r(){}function i(t,e,n,r){return function(){return u.recordSupportability("API/"+e+"/called"),o(t+e,[f.now()].concat(s(arguments)),n?null:this,r),n?void 0:this}}var o=t("handle"),a=t(27),s=t(28),c=t("ee").get("tracer"),f=t("loader"),u=t(21),d=NREUM;"undefined"==typeof window.newrelic&&(newrelic=d);var l=["setPageViewName","setCustomAttribute","setErrorHandler","finished","addToTrace","inlineHit","addRelease"],p="api-",h=p+"ixn-";a(l,function(t,e){d[e]=i(p,e,!0,"api")}),d.addPageAction=i(p,"addPageAction",!0),d.setCurrentRouteName=i(p,"routeName",!0),e.exports=newrelic,d.interaction=function(){return(new r).get()};var m=r.prototype={createTracer:function(t,e){var n={},r=this,i="function"==typeof e;return o(h+"tracer",[f.now(),t,n],r),function(){if(c.emit((i?"":"no-")+"fn-start",[f.now(),r,i],n),i)try{return e.apply(this,arguments)}catch(t){throw c.emit("fn-err",[arguments,this,t],n),t}finally{c.emit("fn-end",[f.now()],n)}}}};a("actionText,setName,setAttribute,save,ignore,onEnd,getContext,end,get".split(","),function(t,e){m[e]=i(h,e)}),newrelic.noticeError=function(t,e){"string"==typeof t&&(t=new Error(t)),u.recordSupportability("API/noticeError/called"),o("err",[t,f.now(),!1,e])}},{}],17:[function(t,e,n){function r(t){if(NREUM.init){for(var e=NREUM.init,n=t.split("."),r=0;r<n.length-1;r++)if(e=e[n[r]],"object"!=typeof e)return;return e=e[n[n.length-1]]}}e.exports={getConfiguration:r}},{}],18:[function(t,e,n){e.exports=function(t){if("string"==typeof t&&t.length)return t.length;if("object"==typeof t){if("undefined"!=typeof ArrayBuffer&&t instanceof ArrayBuffer&&t.byteLength)return t.byteLength;if("undefined"!=typeof Blob&&t instanceof Blob&&t.size)return t.size;if(!("undefined"!=typeof FormData&&t instanceof FormData))try{return JSON.stringify(t).length}catch(e){return}}}},{}],19:[function(t,e,n){var r=!1;try{var i=Object.defineProperty({},"passive",{get:function(){r=!0}});window.addEventListener("testPassive",null,i),window.removeEventListener("testPassive",null,i)}catch(o){}e.exports=function(t){return r?{passive:!0,capture:!!t}:!!t}},{}],20:[function(t,e,n){var r=0,i=navigator.userAgent.match(/Firefox[\/\s](\d+\.\d+)/);i&&(r=+i[1]),e.exports=r},{}],21:[function(t,e,n){function r(t,e){var n=[a,t,{name:t},e];return o("storeMetric",n,null,"api"),n}function i(t,e){var n=[s,t,{name:t},e];return o("storeEventMetrics",n,null,"api"),n}var o=t("handle"),a="sm",s="cm";e.exports={constants:{SUPPORTABILITY_METRIC:a,CUSTOM_METRIC:s},recordSupportability:r,recordCustom:i}},{}],22:[function(t,e,n){function r(){return s.exists&&performance.now?Math.round(performance.now()):(o=Math.max((new Date).getTime(),o))-a}function i(){return o}var o=(new Date).getTime(),a=o,s=t(29);e.exports=r,e.exports.offset=a,e.exports.getLastTimestamp=i},{}],23:[function(t,e,n){function r(t,e){var n=t.getEntries();n.forEach(function(t){"first-paint"===t.name?p("timing",["fp",Math.floor(t.startTime)]):"first-contentful-paint"===t.name&&p("timing",["fcp",Math.floor(t.startTime)])})}function i(t,e){var n=t.getEntries();if(n.length>0){var r=n[n.length-1];if(f&&f<r.startTime)return;var i=[r],o=a({});o&&i.push(o),p("lcp",i)}}function o(t){t.getEntries().forEach(function(t){t.hadRecentInput||p("cls",[t])})}function a(t){var e=navigator.connection||navigator.mozConnection||navigator.webkitConnection;if(e)return e.type&&(t["net-type"]=e.type),e.effectiveType&&(t["net-etype"]=e.effectiveType),e.rtt&&(t["net-rtt"]=e.rtt),e.downlink&&(t["net-dlink"]=e.downlink),t}function s(t){if(t instanceof w&&!y){var e=Math.round(t.timeStamp),n={type:t.type};a(n),e<=h.now()?n.fid=h.now()-e:e>h.offset&&e<=Date.now()?(e-=h.offset,n.fid=h.now()-e):e=h.now(),y=!0,p("timing",["fi",e,n])}}function c(t){"hidden"===t&&(f=h.now(),p("pageHide",[f]))}if(!("init"in NREUM&&"page_view_timing"in NREUM.init&&"enabled"in NREUM.init.page_view_timing&&NREUM.init.page_view_timing.enabled===!1)){var f,u,d,l,p=t("handle"),h=t("loader"),m=t(26),v=t(19),w=NREUM.o.EV;if("PerformanceObserver"in window&&"function"==typeof window.PerformanceObserver){u=new PerformanceObserver(r);try{u.observe({entryTypes:["paint"]})}catch(g){}d=new PerformanceObserver(i);try{d.observe({entryTypes:["largest-contentful-paint"]})}catch(g){}l=new PerformanceObserver(o);try{l.observe({type:"layout-shift",buffered:!0})}catch(g){}}if("addEventListener"in document){var y=!1,x=["click","keydown","mousedown","pointerdown","touchstart"];x.forEach(function(t){document.addEventListener(t,s,v(!1))})}m(c)}},{}],24:[function(t,e,n){function r(){function t(){return e?15&e[n++]:16*Math.random()|0}var e=null,n=0,r=window.crypto||window.msCrypto;r&&r.getRandomValues&&(e=r.getRandomValues(new Uint8Array(31)));for(var i,o="xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx",a="",s=0;s<o.length;s++)i=o[s],"x"===i?a+=t().toString(16):"y"===i?(i=3&t()|8,a+=i.toString(16)):a+=i;return a}function i(){return a(16)}function o(){return a(32)}function a(t){function e(){return n?15&n[r++]:16*Math.random()|0}var n=null,r=0,i=window.crypto||window.msCrypto;i&&i.getRandomValues&&Uint8Array&&(n=i.getRandomValues(new Uint8Array(t)));for(var o=[],a=0;a<t;a++)o.push(e().toString(16));return o.join("")}e.exports={generateUuid:r,generateSpanId:i,generateTraceId:o}},{}],25:[function(t,e,n){function r(t,e){if(!i)return!1;if(t!==i)return!1;if(!e)return!0;if(!o)return!1;for(var n=o.split("."),r=e.split("."),a=0;a<r.length;a++)if(r[a]!==n[a])return!1;return!0}var i=null,o=null,a=/Version\/(\S+)\s+Safari/;if(navigator.userAgent){var s=navigator.userAgent,c=s.match(a);c&&s.indexOf("Chrome")===-1&&s.indexOf("Chromium")===-1&&(i="Safari",o=c[1])}e.exports={agent:i,version:o,match:r}},{}],26:[function(t,e,n){function r(t){function e(){t(s&&document[s]?document[s]:document[o]?"hidden":"visible")}"addEventListener"in document&&a&&document.addEventListener(a,e,i(!1))}var i=t(19);e.exports=r;var o,a,s;"undefined"!=typeof document.hidden?(o="hidden",a="visibilitychange",s="visibilityState"):"undefined"!=typeof document.msHidden?(o="msHidden",a="msvisibilitychange"):"undefined"!=typeof document.webkitHidden&&(o="webkitHidden",a="webkitvisibilitychange",s="webkitVisibilityState")},{}],27:[function(t,e,n){function r(t,e){var n=[],r="",o=0;for(r in t)i.call(t,r)&&(n[o]=e(r,t[r]),o+=1);return n}var i=Object.prototype.hasOwnProperty;e.exports=r},{}],28:[function(t,e,n){function r(t,e,n){e||(e=0),"undefined"==typeof n&&(n=t?t.length:0);for(var r=-1,i=n-e||0,o=Array(i<0?0:i);++r<i;)o[r]=t[e+r];return o}e.exports=r},{}],29:[function(t,e,n){e.exports={exists:"undefined"!=typeof window.performance&&window.performance.timing&&"undefined"!=typeof window.performance.timing.navigationStart}},{}],ee:[function(t,e,n){function r(){}function i(t){function e(t){return t&&t instanceof r?t:t?f(t,c,a):a()}function n(n,r,i,o,a){if(a!==!1&&(a=!0),!p.aborted||o){t&&a&&t(n,r,i);for(var s=e(i),c=m(n),f=c.length,u=0;u<f;u++)c[u].apply(s,r);var l=d[y[n]];return l&&l.push([x,n,r,s]),s}}function o(t,e){g[t]=m(t).concat(e)}function h(t,e){var n=g[t];if(n)for(var r=0;r<n.length;r++)n[r]===e&&n.splice(r,1)}function m(t){return g[t]||[]}function v(t){return l[t]=l[t]||i(n)}function w(t,e){p.aborted||u(t,function(t,n){e=e||"feature",y[n]=e,e in d||(d[e]=[])})}var g={},y={},x={on:o,addEventListener:o,removeEventListener:h,emit:n,get:v,listeners:m,context:e,buffer:w,abort:s,aborted:!1};return x}function o(t){return f(t,c,a)}function a(){return new r}function s(){(d.api||d.feature)&&(p.aborted=!0,d=p.backlog={})}var c="nr@context",f=t("gos"),u=t(27),d={},l={},p=e.exports=i();e.exports.getOrSetContext=o,p.backlog=d},{}],gos:[function(t,e,n){function r(t,e,n){if(i.call(t,e))return t[e];var r=n();if(Object.defineProperty&&Object.keys)try{return Object.defineProperty(t,e,{value:r,writable:!0,enumerable:!1}),r}catch(o){}return t[e]=r,r}var i=Object.prototype.hasOwnProperty;e.exports=r},{}],handle:[function(t,e,n){function r(t,e,n,r){i.buffer([t],r),i.emit(t,e,n)}var i=t("ee").get("handle");e.exports=r,r.ee=i},{}],id:[function(t,e,n){function r(t){var e=typeof t;return!t||"object"!==e&&"function"!==e?-1:t===window?0:a(t,o,function(){return i++})}var i=1,o="nr@id",a=t("gos");e.exports=r},{}],loader:[function(t,e,n){function r(){if(!O++){var t=S.info=NREUM.info,e=m.getElementsByTagName("script")[0];if(setTimeout(f.abort,3e4),!(t&&t.licenseKey&&t.applicationID&&e))return f.abort();c(E,function(e,n){t[e]||(t[e]=n)});var n=a();s("mark",["onload",n+S.offset],null,"api"),s("timing",["load",n]);var r=m.createElement("script");0===t.agent.indexOf("http://")||0===t.agent.indexOf("https://")?r.src=t.agent:r.src=p+"://"+t.agent,e.parentNode.insertBefore(r,e)}}function i(){"complete"===m.readyState&&o()}function o(){s("mark",["domContent",a()+S.offset],null,"api")}var a=t(22),s=t("handle"),c=t(27),f=t("ee"),u=t(25),d=t(17),l=t(19),p=d.getConfiguration("ssl")===!1?"http":"https",h=window,m=h.document,v="addEventListener",w="attachEvent",g=h.XMLHttpRequest,y=g&&g.prototype,x=!1;NREUM.o={ST:setTimeout,SI:h.setImmediate,CT:clearTimeout,XHR:g,REQ:h.Request,EV:h.Event,PR:h.Promise,MO:h.MutationObserver};var b=""+location,E={beacon:"bam.nr-data.net",errorBeacon:"bam.nr-data.net",agent:"js-agent.newrelic.com/nr-1216.min.js"},R=g&&y&&y[v]&&!/CriOS/.test(navigator.userAgent),S=e.exports={offset:a.getLastTimestamp(),now:a,origin:b,features:{},xhrWrappable:R,userAgent:u,disabled:x};if(!x){t(16),t(23),m[v]?(m[v]("DOMContentLoaded",o,l(!1)),h[v]("load",r,l(!1))):(m[w]("onreadystatechange",i),h[w]("onload",r)),s("mark",["firstbyte",a.getLastTimestamp()],null,"api");var O=0}},{}],"wrap-function":[function(t,e,n){function r(t,e){function n(e,n,r,c,f){function nrWrapper(){var o,a,u,l;try{a=this,o=d(arguments),u="function"==typeof r?r(o,a):r||{}}catch(p){i([p,"",[o,a,c],u],t)}s(n+"start",[o,a,c],u,f);try{return l=e.apply(a,o)}catch(h){throw s(n+"err",[o,a,h],u,f),h}finally{s(n+"end",[o,a,l],u,f)}}return a(e)?e:(n||(n=""),nrWrapper[l]=e,o(e,nrWrapper,t),nrWrapper)}function r(t,e,r,i,o){r||(r="");var s,c,f,u="-"===r.charAt(0);for(f=0;f<e.length;f++)c=e[f],s=t[c],a(s)||(t[c]=n(s,u?c+r:r,i,c,o))}function s(n,r,o,a){if(!h||e){var s=h;h=!0;try{t.emit(n,r,o,e,a)}catch(c){i([c,n,r,o],t)}h=s}}return t||(t=u),n.inPlace=r,n.flag=l,n}function i(t,e){e||(e=u);try{e.emit("internal-error",t)}catch(n){}}function o(t,e,n){if(Object.defineProperty&&Object.keys)try{var r=Object.keys(t);return r.forEach(function(n){Object.defineProperty(e,n,{get:function(){return t[n]},set:function(e){return t[n]=e,e}})}),e}catch(o){i([o],n)}for(var a in t)p.call(t,a)&&(e[a]=t[a]);return e}function a(t){return!(t&&t instanceof Function&&t.apply&&!t[l])}function s(t,e){var n=e(t);return n[l]=t,o(t,n,u),n}function c(t,e,n){var r=t[e];t[e]=s(r,n)}function f(){for(var t=arguments.length,e=new Array(t),n=0;n<t;++n)e[n]=arguments[n];return e}var u=t("ee"),d=t(28),l="nr@original",p=Object.prototype.hasOwnProperty,h=!1;e.exports=r,e.exports.wrapFunction=s,e.exports.wrapInPlace=c,e.exports.argsToArray=f},{}]},{},["loader",2,13,4,3]);</script>
<meta name="msapplication-TileImage" content="/bundles/common/images/928bd40a-9507-4495-977d-ace7d554190b.png" />
<meta name="application-name" content="OpenClassrooms" />
<meta name="msapplication-TileColor" content="#7451eb" />
<meta name="msapplication-TileImage" content="/bundles/common/images/928bd40a-9507-4495-977d-ace7d554190b.png" />
<meta name="theme-color" content="#7451eb">
<meta property="og:locale" content="fr_FR" />
<link href="/legacy/css/common_jqueryui-47cbf8fc.css" type="text/css" rel="stylesheet" media="all" />
<link href="/legacy/css/common_oc-274fe3a8.css" type="text/css" rel="stylesheet" media="all" />
<link href="/legacy/css/common_oc_hacks-24a05c2d.css" type="text/css" rel="stylesheet" media="all" />
<link href="/legacy/css/common_syntaxhl-fb83473f.css" type="text/css" rel="stylesheet" media="all" />
<link href="/legacy/css/common-21bd8334.css" type="text/css" rel="stylesheet" media="all" />
<link href="/legacy/css/thread-a26a30f5.css" type="text/css" rel="stylesheet" media="all" />
<script>
    /*! modernizr 3.3.1 (Custom Build) | MIT *
    * https://modernizr.com/download/?-cssfilters-touchevents-setclasses !*/
    !function(e,n,t){function o(e,n){return typeof e===n}function r(){var e,n,t,r,s,i,a;for(var l in C)if(C.hasOwnProperty(l)){if(e=[],n=C[l],n.name&&(e.push(n.name.toLowerCase()),n.options&&n.options.aliases&&n.options.aliases.length))for(t=0;t<n.options.aliases.length;t++)e.push(n.options.aliases[t].toLowerCase());for(r=o(n.fn,"function")?n.fn():n.fn,s=0;s<e.length;s++)i=e[s],a=i.split("."),1===a.length?Modernizr[a[0]]=r:(!Modernizr[a[0]]||Modernizr[a[0]]instanceof Boolean||(Modernizr[a[0]]=new Boolean(Modernizr[a[0]])),Modernizr[a[0]][a[1]]=r),g.push((r?"":"no-")+a.join("-"))}}function s(e){var n=w.className,t=Modernizr._config.classPrefix||"";if(x&&(n=n.baseVal),Modernizr._config.enableJSClass){var o=new RegExp("(^|\\s)"+t+"no-js(\\s|$)");n=n.replace(o,"$1"+t+"js$2")}Modernizr._config.enableClasses&&(n+=" "+t+e.join(" "+t),x?w.className.baseVal=n:w.className=n)}function i(){return"function"!=typeof n.createElement?n.createElement(arguments[0]):x?n.createElementNS.call(n,"http://www.w3.org/2000/svg",arguments[0]):n.createElement.apply(n,arguments)}function a(){var e=n.body;return e||(e=i(x?"svg":"body"),e.fake=!0),e}function l(e,t,o,r){var s,l,u,f,p="modernizr",c=i("div"),d=a();if(parseInt(o,10))for(;o--;)u=i("div"),u.id=r?r[o]:p+(o+1),c.appendChild(u);return s=i("style"),s.type="text/css",s.id="s"+p,(d.fake?d:c).appendChild(s),d.appendChild(c),s.styleSheet?s.styleSheet.cssText=e:s.appendChild(n.createTextNode(e)),c.id=p,d.fake&&(d.style.background="",d.style.overflow="hidden",f=w.style.overflow,w.style.overflow="hidden",w.appendChild(d)),l=t(c,e),d.fake?(d.parentNode.removeChild(d),w.style.overflow=f,w.offsetHeight):c.parentNode.removeChild(c),!!l}function u(e,n){return!!~(""+e).indexOf(n)}function f(e){return e.replace(/([a-z])-([a-z])/g,function(e,n,t){return n+t.toUpperCase()}).replace(/^-/,"")}function p(e,n){return function(){return e.apply(n,arguments)}}function c(e,n,t){var r;for(var s in e)if(e[s]in n)return t===!1?e[s]:(r=n[e[s]],o(r,"function")?p(r,t||n):r);return!1}function d(e){return e.replace(/([A-Z])/g,function(e,n){return"-"+n.toLowerCase()}).replace(/^ms-/,"-ms-")}function m(n,o){var r=n.length;if("CSS"in e&&"supports"in e.CSS){for(;r--;)if(e.CSS.supports(d(n[r]),o))return!0;return!1}if("CSSSupportsRule"in e){for(var s=[];r--;)s.push("("+d(n[r])+":"+o+")");return s=s.join(" or "),l("@supports ("+s+") { #modernizr { position: absolute; } }",function(e){return"absolute"==getComputedStyle(e,null).position})}return t}function h(e,n,r,s){function a(){p&&(delete k.style,delete k.modElem)}if(s=o(s,"undefined")?!1:s,!o(r,"undefined")){var l=m(e,r);if(!o(l,"undefined"))return l}for(var p,c,d,h,v,y=["modernizr","tspan","samp"];!k.style&&y.length;)p=!0,k.modElem=i(y.shift()),k.style=k.modElem.style;for(d=e.length,c=0;d>c;c++)if(h=e[c],v=k.style[h],u(h,"-")&&(h=f(h)),k.style[h]!==t){if(s||o(r,"undefined"))return a(),"pfx"==n?h:!0;try{k.style[h]=r}catch(g){}if(k.style[h]!=v)return a(),"pfx"==n?h:!0}return a(),!1}function v(e,n,t,r,s){var i=e.charAt(0).toUpperCase()+e.slice(1),a=(e+" "+j.join(i+" ")+i).split(" ");return o(n,"string")||o(n,"undefined")?h(a,n,r,s):(a=(e+" "+E.join(i+" ")+i).split(" "),c(a,n,t))}function y(e,n,o){return v(e,t,t,n,o)}var g=[],C=[],S={_version:"3.3.1",_config:{classPrefix:"",enableClasses:!0,enableJSClass:!0,usePrefixes:!0},_q:[],on:function(e,n){var t=this;setTimeout(function(){n(t[e])},0)},addTest:function(e,n,t){C.push({name:e,fn:n,options:t})},addAsyncTest:function(e){C.push({name:null,fn:e})}},Modernizr=function(){};Modernizr.prototype=S,Modernizr=new Modernizr;var w=n.documentElement,x="svg"===w.nodeName.toLowerCase(),_=S._config.usePrefixes?" -webkit- -moz- -o- -ms- ".split(" "):["",""];S._prefixes=_;var b="CSS"in e&&"supports"in e.CSS,T="supportsCSS"in e;Modernizr.addTest("supports",b||T);var z=S.testStyles=l;Modernizr.addTest("touchevents",function(){var t;if("ontouchstart"in e||e.DocumentTouch&&n instanceof DocumentTouch)t=!0;else{var o=["@media (",_.join("touch-enabled),("),"heartz",")","{#modernizr{top:9px;position:absolute}}"].join("");z(o,function(e){t=9===e.offsetTop})}return t});var P="Moz O ms Webkit",j=S._config.usePrefixes?P.split(" "):[];S._cssomPrefixes=j;var E=S._config.usePrefixes?P.toLowerCase().split(" "):[];S._domPrefixes=E;var N={elem:i("modernizr")};Modernizr._q.push(function(){delete N.elem});var k={style:N.elem.style};Modernizr._q.unshift(function(){delete k.style}),S.testAllProps=v,S.testAllProps=y,Modernizr.addTest("cssfilters",function(){if(Modernizr.supports)return y("filter","blur(2px)");var e=i("a");return e.style.cssText=_.join("filter:blur(2px); "),!!e.style.length&&(n.documentMode===t||n.documentMode>9)}),r(),s(g),delete S.addTest,delete S.addAsyncTest;for(var A=0;A<Modernizr._q.length;A++)Modernizr._q[A]();e.Modernizr=Modernizr}(window,document);
    </script>
<link rel="icon" sizes="144x144" href="/icon-white-trans.png?v=2">
<link rel="shortcut icon" href="/favicon.ico?da8e5da1" />

<script type="text/javascript">
    var App = {
        startTime: (new Date()).getTime(),
        pageGenerationDate: 1652852604000
    };

    App.user = {
                    locale: 'fr',
            language: 'fr',
            country: 'US',
            isPremium: false,
            isMentor: false,
            anonymous: true
            };

    App.preferences = {
        debug: false,
        assetVersion: 'da8e5da1',
        contactPhone: '\u002B1\u0020929\u002D376\u002D0101',
        adyenPublicKey: '10001\u007C889EBFD4D434B82683E21DCA26E77C3E20E0EE09A5ECE3830B0ED51F2FA721A2F7E9EC871C6AB9A1E12C4492F4717673047757E02C5256D8E265CD51E413E5EFCCFEAC41B39C662A424ADC13EE187C38C372A7FCCEC1EA5DF841989437D78B252A8EB51008E60BB55B1E55A7A80DE1A9D60D998C128A576BFAE1DDB97D514AF0A073AEDDE84CEE40D1F8F6ECE85D0FFA50C95C06DB274021C1371376C6EB16561FD65C5E2704B570A7504D617D0F3820F176A0609F6162BDF5890533289FDC3DA7DB03B50BB3BD60A613E1FF72060F22987627E8F1A29F0128A94EC4C8FF7CF6B7AB9558D8433BF86D7A388AB927641CD6C02689139CEE3AAC9ACBFFE83806CB',
        application: {
            form: {
              funnelUrl: 'https\u003A\/\/www.tfaforms.com\/responses\/processor',
              fields: {"firstname":"tfa_6","lastname":"tfa_4","email":"tfa_2","path_id":"tfa_138","source_name":"tfa_165","record_type_id":"tfa_217","utm_medium":"tfa_203","utm_source":"tfa_201","utm_term":"tfa_207","utm_campaign":"tfa_205","utm_content":"tfa_225","gclid":"tfa_209","fbclid":"tfa_211","dclid":"tfa_233","msclkid":"tfa_231","ttclid":"tfa_232","referrerId":"tfa_229","placement":"tfa_228","consent":"tfa_150","user_locale":"tfa_125","userId":"tfa_3","gender":"tfa_10","user_study_motivation":"tfa_171","diploma_level":"tfa_30","user_diploma":"tfa_173","language_proficiency_fr":"tfa_40","language_proficiency_en":"tfa_42","language_certificate":"tfa_224","ha_addressline_1":"tfa_16","ha_city":"tfa_18","ha_zip_code":"tfa_24","ha_state":"tfa_163","ha_country":"tfa_22","professional_status":"tfa_94","public_employment_agency_id":"tfa_159","user_public_employment_agency_certificate":"tfa_167","user_pe_advisor_email":"tfa_199","disabled_worker":"tfa_67","veteran":"tfa_73","athlete":"tfa_79","refugee":"tfa_85","rsa":"tfa_91","are":"tfa_175","api":"tfa_177","cui":"tfa_179","aah":"tfa_222","other_allocs":"tfa_223","can_work_in_france":"tfa_142","user_resume":"tfa_1","online_cv":"tfa_157","user_has_mobility":"tfa_193","user_mobility_departamental":"tfa_187","user_mobility_national":"tfa_189","user_mobility_regional":"tfa_191","user_mobility_cities":"tfa_195","work_location_1":"tfa_128","work_location_2":"tfa_130","work_location_3":"tfa_132","work_location_4":"tfa_134","work_location_5":"tfa_136","career_motivation":"tfa_123","has_computer":"tfa_43","has_mic":"tfa_49","has_webcam":"tfa_169","has_fast_internet_connection":"tfa_55","has_quiet_space":"tfa_61","has_online_courses_xp":"tfa_118","has_online_courses_xp_text":"tfa_121","found_a_company":"tfa_146","date_of_birth":"tfa_9","phone_number":"tfa_126","user_desired_start_date":"tfa_161","video_link":"tfa_213","tfa_dbFormId":"tfa_dbFormId","tfa_dbControl":"tfa_dbControl","experiment_id":"tfa_219","full_time_available":"tfa_220","with_prerequisite":"tfa_221","student_application_id":"tfa_226","company_name":"tfa_227","opportunity_id":"tfa_230"}
            },
        },
        routes: {
            COURSE_EVENT: '/components/courses/:courseId',
            COURSE_PART_EVENT: '/components/courses/:courseId/parts/:partId',

            ACCEPT_COOKIE: '\/ajax\/components\/user\u002Daccept\u002Dconsent\u002Dcookie'
        },

                    };

    App.preferences.navigationPreference = {
            };

    App.preferences.modules = {
        'smiley': {
            basePath: '/bundles/common/images/smiley/'
        }
    };

    App.notifications = {};
    App.scripts = [];

    if (App.user.id) {
        (function(){
            var userData = { userId: App.user.id };

            if (App.user.premiumType) {
                userData.status = (App.user.premiumType === 'Premium Solo') ? 'premium solo student' : 'path student';
            } else {
                userData.status = 'free student';
            }

            if (App.user.isMentor) {
                userData.status = App.user.premiumType ? (userData.status + '|mentor') : 'mentor';
            }

            if (!window.dataLayer) {
              return;
            }
            window.dataLayer.push(userData);
        })();
    }
</script>

</head>
<body class="oc-body oldsdz  forum ">
<ul class="skipLink">
<li>
<a class="skipLink__item" href="#mainContent">Aller au contenu</a>
</li>
<li>
<a class="skipLink__item" href="#footerChangeLanguage">Choisir la langue</a>
 </li>
<li id="skipLink_search">
<a class="skipLink__item" href="#algolia-search-input">Aller à la recherche</a>
</li>
</ul>
<script id="_EVENTS-IDENTIFY" type="application/json">
        </script>
<script id="_EVENTS-PAGE" type="application/json">
        {"type":"page","integrations":{"Blueshift":false,"HubSpot":false},"properties":{"pageCategory":"forum"}}
    </script>
<script id="fundingMechanisms" type="application/json">
    {
        "fundingMechanisms": [{"country":"US","eligibleCountries":["US"],"id":29,"name":"Apprenticeship contract","shortName":"Apprenticeship","type":"apprenticeship"}]
    }
</script>
<div id="oc-header">
<div class="oc-mainHeader oc-mainHeader--notLogged oc-mainHeader--skeleton">
<div class="grid-wrapper">
<div class="grid-inner">
<div style="display: flex;">
<div class="oc-mainHeaderLogo oc-mainHeaderLogo--skeleton">
<a href="/fr/" class="oc-mainHeaderLogo__link">
<svg fill="none" height="51" width="668" viewBox="0 0 668 51" xmlns="http://www.w3.org/2000/svg">
<title>OpenClassrooms.com</title>
<path d="M406.011 35.018c0 2.82-.71 5.641-2.368 7.991-1.659 2.35-3.79 4.23-6.87 5.64-3.079 1.41-6.869 2.116-11.37 2.116-3.79 0-7.343-.47-10.897-1.41-3.553-.94-6.395-2.35-8.527-3.996l7.106-8.46c1.421.705 2.843 1.175 4.501 1.88 2.842.94 5.448 1.41 8.054 1.41 4.974 0 7.58-1.41 7.58-3.995 0-1.41-.711-2.35-2.132-3.056-1.421-.705-3.79-1.41-6.87-2.115-3.553-.705-6.395-1.645-8.764-2.585s-4.264-2.35-6.159-4.23c-1.658-1.88-2.606-4.701-2.606-7.991 0-3.056.711-5.641 2.369-7.991 1.658-2.35 3.79-4.23 6.87-5.64 3.079-1.41 6.869-2.116 11.37-2.116 3.079 0 6.159.47 9.001 1.175 3.08.705 5.685 1.88 7.817 3.055l-7.343 8.696c-3.316-1.41-6.633-2.115-9.712-2.115-2.606 0-4.501.47-5.685 1.175-1.185.705-1.895 1.88-1.895 3.056 0 1.41.711 2.35 2.132 2.82 1.421.705 3.79 1.41 6.869 2.115a49.4 49.4 0 0 1 8.765 2.585c2.369.94 4.264 2.35 6.159 4.23 1.658 1.646 2.605 4.466 2.605 7.756zm261.989 0c0 2.82-.711 5.641-2.369 7.991s-3.79 4.23-6.869 5.64c-3.08 1.41-6.87 2.116-11.371 2.116-3.79 0-7.343-.47-10.896-1.41s-6.396-2.35-8.528-3.996l7.107-8.46c1.421.705 2.842 1.175 4.501 1.88 2.842.94 5.448 1.41 8.053 1.41 4.975 0 7.581-1.41 7.581-3.995 0-1.41-.711-2.35-2.132-3.056-1.422-.705-3.791-1.41-6.87-2.115a49.361 49.361 0 0 1-8.764-2.585c-2.369-.94-4.264-2.35-6.159-4.23-1.658-1.88-2.606-4.701-2.606-7.991 0-3.056.711-5.641 2.369-7.991 1.658-2.35 3.79-4.23 6.869-5.64 3.08-1.41 6.87-2.116 11.371-2.116 3.079 0 6.158.47 9.001 1.175 3.079.705 5.685 1.88 7.817 3.055l-7.343 8.696c-3.317-1.41-6.633-2.115-9.712-2.115-2.606 0-4.501.47-5.685 1.175-1.185.705-1.896 1.88-1.896 3.056 0 1.41.711 2.35 2.132 2.82 1.422.705 3.791 1.41 6.87 2.115a49.361 49.361 0 0 1 8.764 2.585c2.369.94 4.264 2.35 6.159 4.23 1.895 1.646 2.606 4.466 2.606 7.756zM87.882 19.037c0 3.76-.947 6.816-2.605 9.4-1.659 2.586-4.027 4.701-7.107 6.111s-6.87 2.116-10.896 2.116H59.22v12.69H45.955V.706h21.319c4.264 0 7.817.705 10.896 2.115 3.08 1.41 5.448 3.526 7.107 6.346 1.895 3.055 2.605 6.346 2.605 9.87zm-13.265 0c0-2.35-.71-3.995-2.132-5.17s-3.316-1.88-6.159-1.88h-7.343v14.336h7.343c2.606 0 4.738-.706 6.16-1.88s2.131-3.056 2.131-5.406zm55.904 20.212v10.576h-37.19V1.175h36.242v10.576h-23.214v8.226h18.476v10.341h-18.476v8.93zm50.218-38.074v48.65h-10.896l-20.609-25.853v25.853h-13.028V1.175h10.896l20.609 25.853V1.175zm84.092 37.604v10.81h-32.926V.94h13.265v37.604h19.661zm56.851 11.046h-13.739l-3.553-9.401h-19.661l-3.553 9.4h-13.502l20.608-48.649h13.029zM300.6 30.083l-5.922-15.512-5.922 15.512zm62.536 4.935c0 2.82-.71 5.641-2.369 7.991-1.658 2.35-3.79 4.23-6.869 5.64-3.08 1.41-6.87 2.116-11.37 2.116-3.79 0-7.344-.47-10.897-1.41s-6.396-2.35-8.527-3.996l7.106-8.46c1.421.705 2.842 1.175 4.501 1.88 2.842.94 5.448 1.41 8.054 1.41 4.974 0 7.58-1.41 7.58-3.995 0-1.41-.711-2.35-2.132-3.056-1.421-.705-3.79-1.41-6.87-2.115-3.553-.705-6.395-1.645-8.764-2.585s-4.264-2.35-6.159-4.23c-1.658-1.88-2.606-4.701-2.606-7.991 0-3.056.711-5.641 2.369-7.991 1.658-2.35 3.79-4.23 6.87-5.64 3.079-1.41 6.869-2.116 11.37-2.116 3.079 0 6.159.47 9.001 1.175 3.08.705 5.448 1.88 7.817 3.055l-7.343 8.696c-3.316-1.41-6.633-2.115-9.712-2.115-2.606 0-4.501.47-5.685 1.175-1.185.705-1.895 1.88-1.895 3.056 0 1.41.71 2.35 2.132 2.82 1.421.705 3.79 1.41 6.869 2.115a49.4 49.4 0 0 1 8.765 2.585c2.368.94 4.263 2.35 6.158 4.23 1.659 1.646 2.606 4.466 2.606 7.756zm-322.63-9.636c0 13.867-11.37 25.383-25.583 25.383-5.685 0-10.66-1.88-14.923-4.936l8.528-10.105c1.895 1.175 4.027 1.88 6.395 1.88 6.633 0 12.081-5.406 12.081-11.986 0-6.581-5.448-11.987-12.08-11.987-2.37 0-4.501.705-6.396 1.88L0 5.407C4.264 2.35 9.475.47 14.923.47 29.136.235 40.506 11.516 40.506 25.383zm177.66 10.341l8.528 10.107c-4.264 3.055-9.476 4.935-14.924 4.935-13.976 0-25.583-11.281-25.583-25.383C186.187 11.517 197.557 0 211.77 0c5.685 0 10.66 1.88 14.924 4.936l-8.528 10.105c-1.895-1.175-4.027-1.88-6.396-1.88-6.632 0-12.081 5.406-12.081 11.986 0 6.581 5.449 11.987 12.081 11.987 2.369.47 4.501-.235 6.396-1.41zm236.169 14.102l-10.423-15.042c3.079-1.41 5.211-3.525 6.87-6.11 1.658-2.585 2.605-5.876 2.605-9.401 0-3.76-.947-6.816-2.605-9.636-1.659-2.82-4.027-4.7-7.107-6.346-3.079-1.41-6.869-2.115-10.896-2.115H411.46v48.65h13.028V37.134h6.159l8.764 12.69zm-29.847-37.839h7.58c2.606 0 4.738.705 6.159 1.88s2.132 3.056 2.132 5.17c0 2.351-.711 3.996-2.132 5.171s-3.316 1.88-6.159 1.88h-7.58zM483.945.235c13.976 0 25.583 11.281 25.583 25.382S498.157 51 483.945 51c-13.976 0-25.583-11.281-25.583-25.383S469.732.235 483.945.235zm-13.029 25.147c0 7.051 5.685 12.692 12.792 12.692 7.106 0 12.791-5.64 12.791-12.692s-5.685-12.69-12.791-12.69c-6.87 0-12.792 5.64-12.792 12.69zM538.901.235c13.976 0 25.583 11.281 25.583 25.382S553.114 51 538.901 51c-13.976 0-25.583-11.281-25.583-25.383S524.925.235 538.901.235zm-12.792 25.147c0 7.051 5.685 12.692 12.792 12.692 7.106 0 12.791-5.64 12.791-12.692s-5.685-12.69-12.791-12.69c-7.107 0-12.792 5.64-12.792 12.69zm70.353 6.816L580.828 1.175h-10.896v48.65h11.607V28.438l11.607 21.387h6.87l11.607-21.387v21.387h11.607V1.175h-10.897z" />
</svg>
</a>
</div>
<nav class="oc-mainHeader__navWrapper" role="navigation" aria-label="Menu principal">
<div class="oc-mainHeader__linksWrapper">
<div class="oc-mainHeader__navLinkWrapper"><a class="oc-mainHeader__navLink" data-event="click|Header|Trainings" href="/fr/paths">Formations</a></div>
<div class="oc-mainHeader__navLinkWrapper"><a class="oc-mainHeader__navLink" data-event="click|Header|Apprenticeship" href="/fr/apprenticeship">Alternance</a></div>
<div class="oc-mainHeader__navLinkWrapper--separator"></div>
<div class="oc-mainHeader__navLinkWrapper"><a class="oc-mainHeader__navLink" data-event="click|Header|Business" href="/fr/business">Pour les entreprises</a></div>
</div>
</nav>
</div>
</div>
</div>
</div>
</div>
<div id="disclaimers-container" style="display:none;">
<!--[if lt IE 10]>
        <div class="alertMessage">
        <span class="bullet bullet--small bullet--orange alertMessage__icon"> <i class="icon-exclamation"></i></span>
        <p class="alertMessage__text">
            Vous utilisez un navigateur obsolète, veuillez le <a href="https://browser-update.org/update.html">mettre à jour</a>.
        </p>
    </div>
    <![endif]-->

<div id="modern-ie-disclaimer" style="display:none">
<div class="alertMessage">
<span class="bullet bullet--small bullet--orange alertMessage__icon"> <i class="icon-exclamation"></i></span>
<p class="alertMessage__text">
Vous utilisez un navigateur obsolète, veuillez le <a href="https://browser-update.org/update.html">mettre à jour</a>.
</p>
</div>
</div>
<script id="webapp-ie-disclaimer" type="application/json">{"message":"Vous utilisez un navigateur obsol\u00e8te, veuillez le <a href=\"https:\/\/browser-update.org\/update.html\">mettre \u00e0 jour<\/a>."}</script>
<script>
      var isModernIE =  document.documentMode === 10 || document.documentMode === 11;
      var isEdgeLegacy = navigator.userAgent.indexOf('Edge') > -1; // Luckily for us, Edge Chromium uses string "Edg" without final "e"

      if (isModernIE || isEdgeLegacy) {
        document.getElementById('modern-ie-disclaimer').style.display = 'block';
        document.getElementById('webapp-ie-disclaimer').setAttribute('data-role', 'disclaimer-message-data');
      }
    </script>
<noscript>
        <div class="alertMessage">
            <span class="bullet bullet--small bullet--orange alertMessage__icon"> <i class="icon-exclamation"></i></span>
            <p class="alertMessage__text">
                Veuillez utiliser un <a href="https://browser-update.org/update.html">navigateur internet moderne</a> avec JavaScript activé pour naviguer sur OpenClassrooms.com
            </p>
        </div>
    </noscript>
</div>
<div id="mainContentWithHeader">
<header id="mainHeader">
<div style="clear: both;"></div>
<section id="headerMiddle">
<section class="containerSdz">
<a href="/forum/"><div class="titlePicture forumSdz"></div></a>
<h1> <a href="/forum/">Forums des <strong>Zéros</strong></a> </h1>
<p>Une question ? Pas de panique, on va vous aider !</p>
</section>
</section>
<section class="breadcrumb  inset no-padding">
<div class="grid-wrapper">
<div class="grid-inner">
<nav class="breadcrumb__wrapper" role="navigation" aria-label="Fil d&#039;Ariane">
<ul class="breadcrumb__trail">
<li class="breadcrumb__item" itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a class="breadcrumb__link" href="../../fr/" itemprop="url">
<span itemprop="title">Accueil</span
                                    ></a>
<span class="breadcrumb__separator"> > </span>
</li>
<li class="breadcrumb__item" itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a class="breadcrumb__link" href="../" itemprop="url">
<span itemprop="title">Forum</span
                                    ></a>
<span class="breadcrumb__separator"> > </span>
</li>
<li class="breadcrumb__item" itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a class="breadcrumb__link" href="https://openclassrooms.com/forum/categorie/site-web" itemprop="url">
<span itemprop="title">Site Web</span
                                    ></a>
<span class="breadcrumb__separator"> > </span>
</li>
<li class="breadcrumb__item" itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a class="breadcrumb__link" href="https://openclassrooms.com/forum/categorie/html-css" itemprop="url">
<span itemprop="title">HTML / CSS</span
                                    ></a>
<span class="breadcrumb__separator"> > </span>
</li>
<li class="breadcrumb__item" itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
Titre avec image de fond
</li>
</ul>
</nav>
</div>
</div>
</section>
<div id="mainSearch" class="mainSearch search-content"></div>
<section class="alt-section no-padding no-border">
<div class="grid-wrapper">
<div class="grid-inner" id="submenuWrapper">
<ul id="secondMenu" class="nav-tabs nav-tabs--navHorizontal">
<li><a href="/forum/">Liste des forums</a></li>
<li class="nav-tabs--searchField  text-right  hidden-xs">
<form class="oc-form   hidden-xs" action="/fr/recherche/" method="get">
<div class="oc-form__widget  inputGroup  inputGroup--medium">
<input type="search" class="oc-form__control inputGroup__input" placeholder="Rechercher sur le forum" name="search" aria-label="Barre de recherche" />
<button class="button button--iconOnly  inputGroup__button" type="submit" title="Rechercher dans le forum">
<span class="accessibility-hidden">Rechercher dans le forum</span>
<i class="inputGroup__icon icon-search"></i>
</button>
</div>
</form>
</li>
</ul>
</div>
</div>
</section>
</header>
<section id="mainContent" class="spacer" role="main">
<section id="mainSection" class="">
<div class="grid-wrapper">
<div class="grid-inner">
<div class="grid-inner-content  u--positionRelative">
<div class="soc_hello_ials ">
<span class="shared">Partage</span>
<ul class="addthis_buttons addthis_share">
<li>
<a class="addthis_button_facebook" title="Partager sur Facebook" data-addthis-title="Titre avec image de fond via @openclassrooms" data-addthis-description="Titre avec image de fond via @openclassrooms" data-addthis-url="https://openclassrooms.com/forum/sujet/titre-avec-image-de-fond"><img src="/bundles/common/images/ico_addthis_facebook.png?da8e5da1" alt="Partager sur Facebook" /></a>
</li>
<li>
<a class="addthis_button_twitter" title="Partager sur Twitter" data-addthis-url="https://openclassrooms.com/forum/sujet/titre-avec-image-de-fond" data-addthis-title="Titre avec image de fond via @openclassrooms"><img src="/bundles/common/images/ico_addthis_twitter.png?da8e5da1" alt="Partager sur Twitter" /></a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="grid-wrapper">
<div class="grid-inner">
<div class="grid-inner-content  u--positionRelative  forum__content">
<h1><a href="/forum/sujet/titre-avec-image-de-fond">Titre avec image de fond</a></h1>
<div class='spacer resolved' style="">
<div class='iconResolved'></div>
<div>Sujet résolu</div>
</div>
<section class='comments'>
<div class="row
                                ">
<div class="userInfos">
<div class="avatar-oc">
<div class="author">
<a href="/fr/members/7fch93xf1js6" rel="nofollow" title="Profil de NassNassim">
NassNassim
</a>
</div>
<a href="/fr/members/7fch93xf1js6" rel="nofollow" title="Profil de NassNassim">
<img src="https://openclassrooms.com/bundles/common/images/avatar_defaut.png" alt="" width="80px">
</a>
</div>
<ul class="skills">
<li class="skill" data-original-title="Intermédiaire">
<img src="//sdz-upload.s3.amazonaws.com/prod/categories/icons/icon_forum_html-css.png" alt="HTML / CSS" class="badgeSdz" />
<ul class="levels">
<li class="full"></li>
<li class="full"></li>
<li class="empty"></li>
</ul>
</li>
</ul>
</div>
<div class="span10 comment" id="message-93489988">
<ul class="actions"></ul> <div class="content">
<a href="#message-93489988" class="date">28 octobre 2019 à 18:56:12</a>
<br />
<br />
<div class="message markdown-body" role="article">
<p>Bonjour,</p>
<p>J'ai besoin de créer un bandeau pour mes titres  comme sur l'image ci-dessous :</p>
<p><img src="//user.oc-static.com/upload/2019/10/28/15722850045777_bandeau-titre.png" alt="" width="444" height="136" /></p>
<p>J'ai essayer avec un background image mais l'image est plus petite que titre. J'ai essayé avec des position relative/absolute mais cette fois il y a un problème au niveau de la taille (si le titre est plus long ou plus court, ça ne s'adapte pas bien).</p>
<p>Quelqu'un aurait-il une idée de comment faire pour que le titre soit placé au centre du bandeau et que le bandeau soit toujours un peu plus large et plus grand que le titre ?</p>
<p>Merci pour votre aide.</p>
</div>
<span class='commentVote'>
</span>
<ul class="addthis_buttons addthis_share">
<li>
<a class="addthis_button_facebook" title="Partager sur Facebook" data-addthis-title="Titre avec image de fond via @openclassrooms" data-addthis-description="Titre avec image de fond via @openclassrooms" data-addthis-url="https://openclassrooms.com/forum/sujet/titre-avec-image-de-fond/93489988"><img src="/bundles/common/images/ico_addthis_facebook.png?da8e5da1" alt="Partager sur Facebook" /></a>
</li>
<li>
<a class="addthis_button_twitter" title="Partager sur Twitter" data-addthis-url="https://openclassrooms.com/forum/sujet/titre-avec-image-de-fond/93489988" data-addthis-title="Titre avec image de fond via @openclassrooms"><img src="/bundles/common/images/ico_addthis_twitter.png?da8e5da1" alt="Partager sur Twitter" /></a>
</li>
</ul>
</div>
</div>
<div class="span12">
</div>
</div>
<div class="row
                                ">
<div class="userInfos">
<div class="avatar-oc">
<div class="author">
<a href="/fr/members/k2m174l61v99" rel="nofollow" title="Profil de bxdfr">
bxdfr
</a>
</div>
<a href="/fr/members/k2m174l61v99" rel="nofollow" title="Profil de bxdfr">
<img src="https://user.oc-static.com/files/376001_377000/376252.png" alt="" width="80px">
</a>
</div>
<ul class="skills">
<li class="skill" data-original-title="Intermédiaire">
<img src="//sdz-upload.s3.amazonaws.com/prod/categories/icons/icon_forum_html-css.png" alt="HTML / CSS" class="badgeSdz" />
<ul class="levels">
<li class="full"></li>
<li class="full"></li>
<li class="empty"></li>
</ul>
</li>
</ul>
</div>
<div class="span10 comment" id="message-93490124">
<ul class="actions"></ul> <div class="content">
<a href="#message-93490124" class="date">28 octobre 2019 à 20:31:28</a>
<br />
<br />
<div class="message markdown-body" role="article">
<p>Bonjour,</p>
<p>je dirais, jouer avec la propriété css, border-image en stretch.</p>
<p>exemple ici: <a title="https://www.w3schools.com/css/tryit.asp?filename=trycss3_border-image2" href="https://www.w3schools.com/css/tryit.asp?filename=trycss3_border-image2" rel="nofollow">https://www.w3schools.com/css/tryit.asp?filename=trycss3_border-image2</a></p>
</div>
<span class='commentVote'>
</span>
<ul class="addthis_buttons addthis_share">
<li>
<a class="addthis_button_facebook" title="Partager sur Facebook" data-addthis-title="Titre avec image de fond via @openclassrooms" data-addthis-description="Titre avec image de fond via @openclassrooms" data-addthis-url="https://openclassrooms.com/forum/sujet/titre-avec-image-de-fond/93490124"><img src="/bundles/common/images/ico_addthis_facebook.png?da8e5da1" alt="Partager sur Facebook" /></a>
</li>
<li>
<a class="addthis_button_twitter" title="Partager sur Twitter" data-addthis-url="https://openclassrooms.com/forum/sujet/titre-avec-image-de-fond/93490124" data-addthis-title="Titre avec image de fond via @openclassrooms"><img src="/bundles/common/images/ico_addthis_twitter.png?da8e5da1" alt="Partager sur Twitter" /></a>
</li>
</ul>
</div>
</div>
<div class="span12">
</div>
</div>
<div class="row
                                ">
<div class="userInfos">
<div class="avatar-oc">
<div class="author">
<a href="/fr/members/qgsz89bplcg6" rel="nofollow" title="Profil de Frogweb">
Frogweb
</a>
</div>
<a href="/fr/members/qgsz89bplcg6" rel="nofollow" title="Profil de Frogweb">
<img src="https://sdz-upload.s3.amazonaws.com/prod/users/avatars/logofrogweb-petit2.png" alt="" width="80px">
</a>
</div>
<ul class="skills">
<li class="skill" data-original-title="Confirmé">
<img src="//sdz-upload.s3.amazonaws.com/prod/categories/icons/icon_forum_html-css.png" alt="HTML / CSS" class="badgeSdz" />
<ul class="levels">
<li class="full"></li>
<li class="full"></li>
<li class="full"></li>
</ul>
</li>
</ul>
</div>
<div class="span10 comment" id="message-93491078">
<ul class="actions"></ul> <div class="content">
<a href="#message-93491078" class="date">29 octobre 2019 à 10:40:53</a>
<br />
<br />
<div class="message markdown-body" role="article">
<p>Salut,</p>
<p>avec background-size:cover ou 100% ça devrait fonctionner aussi.</p>
</div>
<span class='commentVote'>
</span>
<ul class="addthis_buttons addthis_share">
<li>
<a class="addthis_button_facebook" title="Partager sur Facebook" data-addthis-title="Titre avec image de fond via @openclassrooms" data-addthis-description="Titre avec image de fond via @openclassrooms" data-addthis-url="https://openclassrooms.com/forum/sujet/titre-avec-image-de-fond/93491078"><img src="/bundles/common/images/ico_addthis_facebook.png?da8e5da1" alt="Partager sur Facebook" /></a>
</li>
<li>
<a class="addthis_button_twitter" title="Partager sur Twitter" data-addthis-url="https://openclassrooms.com/forum/sujet/titre-avec-image-de-fond/93491078" data-addthis-title="Titre avec image de fond via @openclassrooms"><img src="/bundles/common/images/ico_addthis_twitter.png?da8e5da1" alt="Partager sur Twitter" /></a>
</li>
</ul>
<div class="signature">
<em>Vous cherchez à faire un </em><strong>menu déroulant</strong> ? <em>Visitez </em><strong><a href="http://www.frogweb.fr/" rel="nofollow">www.frogweb.fr</a></strong> !<em> frogweb le site qu'il vous faut !</em>
</div>
</div>
</div>
<div class="span12">
</div>
</div>
<div class="row
                                ">
<div class="userInfos">
<div class="avatar-oc">
<div class="author">
<a href="/fr/members/6gch4l8lmvq1" rel="nofollow" title="Profil de AliasDmc">
AliasDmc
</a>
</div>
<a href="/fr/members/6gch4l8lmvq1" rel="nofollow" title="Profil de AliasDmc">
<img src="https://openclassrooms.com/bundles/common/images/avatar_defaut.png" alt="" width="80px">
</a>
</div>
<ul class="skills">
<li class="skill" data-original-title="Intermédiaire">
<img src="//sdz-upload.s3.amazonaws.com/prod/categories/icons/icon_forum_html-css.png" alt="HTML / CSS" class="badgeSdz" />
<ul class="levels">
<li class="full"></li>
<li class="full"></li>
<li class="empty"></li>
</ul>
</li>
</ul>
</div>
<div class="span10 comment" id="message-93492070">
<ul class="actions"></ul> <div class="content">
<a href="#message-93492070" class="date">29 octobre 2019 à 18:30:41</a>
<br />
<br />
<div class="message markdown-body" role="article">
<p>Bonjour NassNassim,</p>
<p>autre possibilité</p>
<p><a href="https://codepen.io/Zonecss/pen/zYYdmjN" rel="nofollow">https://codepen.io/Zonecss/pen/zYYdmjN</a></p>
</div>
<span class='commentVote'>
</span>
<ul class="addthis_buttons addthis_share">
<li>
<a class="addthis_button_facebook" title="Partager sur Facebook" data-addthis-title="Titre avec image de fond via @openclassrooms" data-addthis-description="Titre avec image de fond via @openclassrooms" data-addthis-url="https://openclassrooms.com/forum/sujet/titre-avec-image-de-fond/93492070"><img src="/bundles/common/images/ico_addthis_facebook.png?da8e5da1" alt="Partager sur Facebook" /></a>
</li>
<li>
<a class="addthis_button_twitter" title="Partager sur Twitter" data-addthis-url="https://openclassrooms.com/forum/sujet/titre-avec-image-de-fond/93492070" data-addthis-title="Titre avec image de fond via @openclassrooms"><img src="/bundles/common/images/ico_addthis_twitter.png?da8e5da1" alt="Partager sur Twitter" /></a>
</li>
</ul>
<div class="signature">
Découvrez les Css avec la <a href="http://www.zonecss.fr" title="Glossaire css" rel="nofollow">zonecss.fr</a>
</div>
</div>
</div>
<div class="span12">
</div>
</div>
<div class="row
                                ">
<div class="userInfos">
<div class="avatar-oc">
<div class="author">
<a href="/fr/members/7fch93xf1js6" rel="nofollow" title="Profil de NassNassim">
NassNassim
</a>
</div>
<a href="/fr/members/7fch93xf1js6" rel="nofollow" title="Profil de NassNassim">
<img src="https://openclassrooms.com/bundles/common/images/avatar_defaut.png" alt="" width="80px">
</a>
</div>
<ul class="skills">
<li class="skill" data-original-title="Intermédiaire">
<img src="//sdz-upload.s3.amazonaws.com/prod/categories/icons/icon_forum_html-css.png" alt="HTML / CSS" class="badgeSdz" />
<ul class="levels">
<li class="full"></li>
<li class="full"></li>
<li class="empty"></li>
</ul>
</li>
</ul>
</div>
<div class="span10 comment" id="message-93493659">
<ul class="actions"></ul> <div class="content">
<a href="#message-93493659" class="date">30 octobre 2019 à 16:11:04</a>
<br />
<br />
<div class="message markdown-body" role="article">
<p>Merci à tous pour vos réponse.</p>
<p>J'ai essayé toutes vos solution. Alors, je ne sais pas si c'est moi qui ne sais pas utiliser correctement vos techniques, mais la seule qui à fonctionné après essaie et adaptation à mon cas c'est celle de AliasDmc.</p>
<p>En tous cas encore merci j'ai appris de nouvelle grâce à vous. </p>
</div>
<span class='commentVote'>
</span>
<ul class="addthis_buttons addthis_share">
<li>
<a class="addthis_button_facebook" title="Partager sur Facebook" data-addthis-title="Titre avec image de fond via @openclassrooms" data-addthis-description="Titre avec image de fond via @openclassrooms" data-addthis-url="https://openclassrooms.com/forum/sujet/titre-avec-image-de-fond/93493659"><img src="/bundles/common/images/ico_addthis_facebook.png?da8e5da1" alt="Partager sur Facebook" /></a>
</li>
<li>
<a class="addthis_button_twitter" title="Partager sur Twitter" data-addthis-url="https://openclassrooms.com/forum/sujet/titre-avec-image-de-fond/93493659" data-addthis-title="Titre avec image de fond via @openclassrooms"><img src="/bundles/common/images/ico_addthis_twitter.png?da8e5da1" alt="Partager sur Twitter" /></a>
</li>
</ul>
</div>
</div>
<div class="span12">
</div>
</div>
</section>
<div id="newComment" class="message">
<h2>Titre avec image de fond</h2>
<div class="alert alert-info ">
<a data-dismiss="alert" class="close">×</a> Après avoir cliqué sur &quot;Répondre&quot; vous serez invité à vous connecter pour que votre message soit publié.
</div>
<div class="alert alert-danger ">
<a data-dismiss="alert" class="close">×</a> Attention, ce sujet est très ancien. Le déterrer n&#039;est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
</div>
<form action="/fr/message/creer/titre-avec-image-de-fond" method="post">
<div class="js-wysiwyg-content wysiwyg-content wysiwygContent"><textarea id="Comment_wysiwyg_message" name="Comment[wysiwyg][message]" required="required" class="tinymce" data-theme="simple" placeholder="Rédigez votre message ici"></textarea><input type="hidden" id="Comment_wysiwyg" name="Comment[wysiwyg][writingType]" class="writingType" value="editor" /><ul class="writingTypeSwitch"><li class="switchEditeur">Editeur<span class="ball" style="font-size:5px"> ● </span></li><li class="switchMarkdown inactive">Markdown</li></ul><p class="information infoMarkdown" style="display: none;float:left;">
Vous pouvez rédiger votre message en <a href="/fr/courses/1304236-redigez-en-markdown" target="_blank">Markdown</a> ou en HTML uniquement.
</p></div>
<input type="hidden" id="Comment__token" name="Comment[_token]" value="EID7JD-EfmWeGFqpOCDeweFXTP5f2uXpTz1dxhJTTXk" />
<input name="submit_comment" type="submit" class="btn btn-primary" value="Répondre" />
<input type="button" class="btn showMarkdownOverview" value="Aperçu" />
</form>
</div>
<div class="modal" id="deleteActionModal" style="display:none;">
<div class="modal-header">
<a class="close" data-dismiss="modal">×</a>
<span class="actionIcon iconModerer">×</span>
<h2>Supprimer</h2>
</div>
<div class="modal-body modal-body-hidden modal-delete">
<p class="messageDelete"></p>
<div class="modal-footer">
<p>Vous n'avez pas les droits suffisant pour supprimer ce sujet !</p>
</div>
</div>
</div>
<div class="modal" id="moderateActionModal" style="display:none;">
<div class="modal-header">
<a class="close" data-dismiss="modal">×</a>
<span class="actionIcon iconModerer">×</span>
<h2>Modérer</h2>
</div>
<div class="modal-body">
<ul>
</ul>
</div>
</div>
<div class="modal" id="alertActionModal" style="display:none;">
<div class="modal-header">
<a class="close" data-dismiss="modal">×</a>
<h2>Signaler le message aux modérateurs</h2>
</div>
<div class="modal-body modal-alert">
<form action="#" method="post">
<div><label for="alert_reason" class="required">Raison : </label><input type="text" id="alert_reason" name="alert[reason]" required="required" /></div><input type="hidden" id="alert__token" name="alert[_token]" value="aIwBEgeg0Hbeg-WzVJGJOioh7bVsDvpQoYrVk62lYqM" />
<div class="error"></div>
<div class="modal-footer">
<input type="submit" class="btn btn-primary" value="Valider" />
<input type="button" data-dismiss="modal" class="btn" value="Annuler" />
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</section>
</section>
</div>
<div id="footerWrapper">
<footer id="footer" class="oc-footerSkeleton">
<hr style="margin-bottom: 8px" />
<div class="grid-wrapper">
<div class="grid-inner">
<div class="oc-footerSkeleton__container">
<div class="oc-footerSkeleton__item">
<div class="oc-footerSkeleton__itemTitle"><span class="skeleton" style="height: 20px; width: 80%"></span></div>
<ul class="oc-footerSkeleton__linksList">
<li class="oc-footerSkeleton__linksListItem">
<p><a tabindex="inherit"><span class="skeleton" style="height: 14px; width: 70%"></span></a></p>
</li>
<li class="oc-footerSkeleton__linksListItem">
<p><a tabindex="inherit"><span class="skeleton" style="height: 14px; width: 60%"></span></a></p>
</li>
<li class="oc-footerSkeleton__linksListItem">
<p><a tabindex="inherit"><span class="skeleton" style="height: 14px; width: 65%"></span></a></p>
</li>
<li class="oc-footerSkeleton__linksListItem">
<p><a tabindex="inherit"><span class="skeleton" style="height: 14px; width: 40%"></span></a></p>
</li>
</ul>
</div>
<div class="oc-footerSkeleton__item">
<div class="oc-footerSkeleton__itemTitle"><span class="skeleton" style="height: 20px; width: 85%"></span></div>
<ul class="oc-footerSkeleton__linksList">
<li class="oc-footerSkeleton__linksListItem">
<p><a tabindex="inherit"><span class="skeleton" style="height: 14px; width: 40%"></span></a></p>
</li>
<li class="oc-footerSkeleton__linksListItem">
<p><a tabindex="inherit"><span class="skeleton" style="height: 14px; width: 60%"></span></a></p>
 </li>
</ul>
</div>
<div class="oc-footerSkeleton__item">
<div class="oc-footerSkeleton__itemTitle"><span class="skeleton" style="height: 20px; width: 75%"></span></div>
<ul class="oc-footerSkeleton__linksList">
<li class="oc-footerSkeleton__linksListItem">
<p><a tabindex="inherit"><span class="skeleton" style="height: 14px; width: 65%"></span></a></p>
</li>
<li class="oc-footerSkeleton__linksListItem">
<p><a tabindex="inherit"><span class="skeleton" style="height: 14px; width: 40%"></span></a></p>
</li>
<li class="oc-footerSkeleton__linksListItem">
<p><a tabindex="inherit"><span class="skeleton" style="height: 14px; width: 50%"></span></a></p>
</li>
<li class="oc-footerSkeleton__linksListItem">
<p><a tabindex="inherit"><span class="skeleton" style="height: 14px; width: 40%"></span></a></p>
</li>
</ul>
</div>
<div class="oc-footerSkeleton__item">
<span class="skeleton" style="height: 25px; width: 65%"></span>
<div class="oc-footerSkeleton__socialButtonWrapper">
<div><span class="skeleton skeleton--round" style="width: 40px; height: 40px"></span></div>
<div><span class="skeleton skeleton--round" style="width: 40px; height: 40px;"></span></div>
<div><span class="skeleton skeleton--round" style="width: 40px; height: 40px;"></span></div>
<div><span class="skeleton skeleton--round" style="width: 40px; height: 40px;"></span></div>
<div><span class="skeleton skeleton--round" style="width: 40px; height: 40px;"></span></div>
</div>
<div><span class="skeleton skeleton--width50" style="height: 40px;"></span></div>
</div>
</div>
</div>
</div>
</footer>
</div>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.0/MathJax.js?config=TeX-AMS_HTML"></script>
<script type="text/x-mathjax-config">
            MathJax.Hub.Config({
                tex2jax: {
                    inlineMath: [['\\(','\\)']],
                    displayMath: [['$$','$$'], ['\\[','\\]']],
                    skipTags: ["script","noscript","style","textarea","code"]
                }
            });
        </script>
<script type="text/javascript" src="/legacy/js/legacy-v4.js?v=4"></script>
<script type="text/javascript" src="/bundles/tinymce/vendor/tiny_mce/tiny_mce.js?da8e5da1"></script>
<script type="text/javascript" src="/bundles/tinymce/js/ready.min.js?da8e5da1"></script>
<script type="text/javascript" src="/bundles/tinymce/js/init.standard.js?da8e5da1"></script>
<script type="text/javascript">
//<![CDATA[
    initTinyMCE({"include_jquery":false,"textarea_class":"tinymce","theme":{"tiny":{"theme":"advanced","skin":"sdz","valid_elements":"strong\/b,em\/i,a[href|target|title]","theme_advanced_buttons1":"bold,italic,link","theme_advanced_buttons2":"","theme_advanced_buttons3":"","theme_advanced_toolbar_location":"top","theme_advanced_toolbar_align":"left","theme_advanced_statusbar_location":"bottom","theme_advanced_blockformats":"p,h1,h2,h3","plugins":"inlinepopups","language":"fr","forced_root_block":false,"force_br_newlines":false,"force_p_newlines":false,"entity_encoding":"raw","gecko_spellcheck":true},"simple":{"theme":"advanced","skin":"sdz","theme_advanced_buttons1":"formatselect,fontsizeselect,bold,italic,forecolor,bullist,link,image,syntaxhl,emotions","theme_advanced_buttons2":"","theme_advanced_buttons3":"","theme_advanced_toolbar_location":"top","theme_advanced_toolbar_align":"left","theme_advanced_statusbar_location":"bottom","theme_advanced_blockformats":"p,h1,h2,h3","plugins":"syntaxhl, emotions, inlinepopups, autolink","language":"fr","forced_root_block":false,"force_br_newlines":false,"force_p_newlines":true,"entity_encoding":"raw","gecko_spellcheck":true},"claire":{"theme":"advanced","skin":"claire","theme_advanced_buttons1":"formatselect,bullist,numlist,elementlist,kbd,syntaxhl,sdzcode,image,table,blockquote,bold,italic,link,sdzinfo,sdzwarning,sdzerror,sdzquestion,abbr,acronym,emotions,code","theme_advanced_buttons2":"","theme_advanced_buttons3":"","theme_advanced_toolbar_location":"top","theme_advanced_toolbar_align":"left","theme_advanced_statusbar_location":"bottom","height":"250","plugins":"resize, syntaxhl, advlink, xhtmlxtras, emotions, inlinepopups, elementlist,  kbd, sdzcode, table, sdzinfo, sdzwarning, sdzerror, sdzquestion","theme_advanced_blockformats":"p,h2,h3","extended_valid_elements":"article,section,figure,aside,pre","language":"fr","force_br_newlines":false,"force_p_newlines":true,"entity_encoding":"raw"},"strict":{"theme":"advanced","valid_styles":"color,font-size,font-weight,font-style,text-decoration","skin":"sdz","theme_advanced_buttons1":"formatselect,fontsizeselect,bold,italic,forecolor,bullist,link,image,syntaxhl,emotions","theme_advanced_buttons2":"","theme_advanced_buttons3":"","theme_advanced_toolbar_location":"top","theme_advanced_toolbar_align":"left","theme_advanced_statusbar_location":"bottom","theme_advanced_blockformats":"p,h1,h2,h3","plugins":"syntaxhl, emotions, inlinepopups","language":"fr","forced_root_block":false,"force_br_newlines":false,"force_p_newlines":true,"entity_encoding":"raw","gecko_spellcheck":true},"advanced":{"theme":"advanced","plugins":"syntaxhl,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template","theme_advanced_buttons1":"syntaxhl,|save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,styleselect,formatselect,fontselect,fontsizeselect","theme_advanced_buttons2":"cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor","theme_advanced_buttons3":"tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen","theme_advanced_buttons4":"insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,pagebreak","theme_advanced_toolbar_location":"top","theme_advanced_toolbar_align":"left","theme_advanced_statusbar_location":"bottom","theme_advanced_resizing":true,"remove_linebreaks":false,"language":"fr","gecko_spellcheck":true}},"tinymce_jquery":false,"jquery_script_url":"\/bundles\/tinymce\/vendor\/tiny_mce\/tiny_mce.js?da8e5da1"});
//]]>
</script>
<script type="text/javascript">
    _old$('.lastUnreadComment').tooltip({title: 'Dernier message non lu', placement: "bottom"});
</script>
<script type="text/javascript">
var contentTmp = new Array();
var lockEdit = false;
textareaContent = _old$('#newComment').find('textarea');
wysiwygContent = _old$('#newComment').find('.wysiwygContent');
currentFocus = {};
if(_old$('.writingType').val() == 'markdown') {
    currentFocus.editorId = null;
}
else {
    currentFocus.editorId = 1;
}

_old$('.tinymce').live('click', function(e){
    _old$(this).focus();
    currentFocus = _old$(this);
    textareaContent = _old$(this);
});

_old$("a.editAction").live('click',function(e){
    // No event
    e.preventDefault();

    if (_old$(this).parents('.comment').find('.message form').length == 0 && lockEdit == false)
    {
        if(_old$(this).closest('#actionsAdmin').length != 0)
        {
            _old$('section.comments div.row:first-child a.editAction').click();
        }
        else
        {
            lockEdit = true;

            var el = _old$(this);
            var divContent = el.parents('.comment').find('.content');
            divContent.find('.addthis_share').hide();
            contentTmp[el.parents('.comment').attr('id')] = el.parents('.comment').find('.content').html();

            ajax(el.attr('href'), 'GET', null, function(result){
                if(el.closest('.badVotes'))
                {
                    el.closest('.badVotes').find('.avatar img').hide();
                }

                divContent.html(result);
                var addThis = divContent.find('.addthis_share');
                addThis.addClass('off').hide();

                el.closest('.row').find('.message').show();
                lockEdit = false;

                // Add wysiwyg or switch to markdown
                updateTextareaDisplay(divContent);
                sendImage();

                if(el.closest('.row').find('.mceEditor').length != 0) {
                  tinyMCE.activeEditor.focus();
                  tinyMCE.activeEditor.selection.setContent('\n');
                  currentFocus = tinyMCE.activeEditor;
                }
                else {
                  el.closest('.row').find('.message form textarea').focus();
                  currentFocus = el.closest('.row').find('.message form textarea');
                }

                wysiwygContent = el.closest('.row').find('.message form .wysiwygContent');
                textareaContent = el.closest('.row').find('.message form textarea');
            });
        }
    }
    else
    {
        if(_old$(this).closest('.row').find('.mceEditor').length != 0) {
          tinyMCE.activeEditor.focus();
          tinyMCE.activeEditor.selection.setContent('');
          currentFocus = tinyMCE.activeEditor;
        }
        else {
          _old$(this).closest('.row').find('.message form textarea').focus();
          currentFocus = _old$(this).closest('.row').find('.message form textarea');
        }

        wysiwygContent = _old$(this).closest('.row').find('.message form .wysiwygContent');
        textareaContent = _old$(this).closest('.row').find('.message form textarea');
    }
});

_old$(".comment .message form input.btn-reset").live('click',function(e){
    e.preventDefault();

    var divContent = _old$(this).closest('.comment').find('.content');

    // Remove wysiwyg
    if(divContent.find('.writingType').val() == 'editor')
    {
        tinyMCE.execCommand('mceRemoveControl', false, divContent.find('textarea.tinymce').attr('id'));
    }

    divContent.html(contentTmp[_old$(this).parents('.comment').attr('id')]);

    _old$("ul.actions").hide();
});

_old$(".comment .message form").live('submit',function(e){
    if(_old$(this).hasClass('markdownWrap'))
    {
        return true;
    }

    e.preventDefault();
    var el = _old$(this);
    var divContent = el.parents('.comment').find('.content');

    ajax(el.attr('action'), 'POST', el.serialize(), function(result){
        var isThread = (_old$('#ThreadForum_title').size() > 0);
        if(isThread && result.substr(0, 1) == '/') {
            window.location = result;
        }
        else {
            divContent.html(result);

            // Add wysiwyg or switch to markdown
            updateTextareaDisplay(divContent);

            applyTooltip();

            //Updates HTML content not hightlighted
            updateContent(divContent.find('.markdown-body'));
            SyntaxHighlighter.highlight();
        }
    });
});

_old$("a.citeAction").live('click',function(e){
    // No event
    e.preventDefault();

    // Find textarea object
    var textarea = textareaContent;
    var divContent = wysiwygContent;

    // Author
    var author = $.trim(_old$(this).parents('.row').find('.author a').html());


    // If wysiwyg is ON / OFF
    if (currentFocus.editorId == null)
    {
        // Replace
        var val = $.trim(_old$(this).parents('.comment').find('.markdown').html());

        val = val.replace(/&amp;/g, "&");
        val = val.replace(/&lt;/g, "<");
        val = val.replace(/&gt;/g, ">");
        val = val.replace(/\n/g, "\n> ");
        val = val.replace(/\r/g, "\r> ");
        var texte = '**'+author+' a écrit:**\n> '+val+'\n\n';

        textarea.val(textarea.val()+((isTextareaEmpty(divContent,false)) ? '' : '\n\n')+texte);
        textarea.focus();
        switchMenuDisplay(textarea.attr('id'));
    }
    else
    {
        // Replace
        var val = $.trim(contents[_old$(this).parents('.comment').attr('id')]);

        var texte = '<p><strong>'+author+' a écrit:</strong></p><blockquote>'+val+'</blockquote>';

        textarea.parents('div').append('<a class="focusWys" href="#" >&nbsp;</a>');
        _old$('.focusWys').click();
        _old$('.focusWys').focus();
        _old$('.focusWys').remove();
        tinyMCE.activeEditor.selection.setContent(texte);
        $content = tinyMCE.activeEditor.getContent();
        tinyMCE.activeEditor.setContent($content+'<br><br>');
        tinyMCE.activeEditor.focus();
    }
});
</script>
<script type="text/javascript">

function hideTooltip()
{
}

function applyTooltip()
{
}

function hideVoteInfo()
{
    _old$('.voteInfo').fadeOut("slow");
}


_old$(document).ready(function() {

    var isVoting = false;
    var nbVotesMin = parseInt('10');

    _old$('section.comments .row').hover(function(){
        _old$(this).find('ul.actions').show();
        if(!_old$(this).find('ul.addthis_share').hasClass('off'))
        {
            _old$(this).find('ul.addthis_share').show();
        }

        _old$(this).find('span.commentVote .noVote').css('visibility','visible');
    },function(){
        _old$(this).find('ul.actions').hide();
        _old$(this).find('ul.addthis_share').hide();
        _old$(this).find('span.commentVote .noVote').css('visibility','hidden');
    });

    _old$('.comment .toggleMessage').live("click",function(e){
       e.preventDefault();

       _old$(this).closest('.content').find('.message').toggle('fast');
       _old$(this).closest('div.row').find('.avatar img').toggle();

       if(_old$(this).hasClass('messageOpen'))
       {
           _old$(this).removeClass('messageOpen');
           _old$(this).html('Lire quand même<span class="toggleArrow"></span>');
       }
       else
       {
           _old$(this).addClass('messageOpen');
           _old$(this).html('Masquer le message<span class="toggleArrow"></span>');
       }
    });

    applyTooltip();

    _old$('a.voteUpAction, a.voteDownAction').live('click',function(e){
        // No event
        e.preventDefault();

        if(!isVoting)
        {
            isVoting = true;
            var element = _old$(this);
            var commentBloc = element.closest('div.row');

            ajax(element.attr('href'), 'GET', null, function(result){
                element.parents('.commentVote').html(result);
                hideTooltip();
                applyTooltip();
                isVoteUtile(commentBloc);
                isVoting = false;
                setTimeout(hideVoteInfo, 5000);
            });
        }

    });



    _old$('a.deleteThread').click(function(){
       if(!confirm("Etes-vous sûr de vouloir supprimer ce MP ?"))
       {
           return false;
       }
    });

    function isVoteUtile(commentBloc)
    {
        var nbVoteUp = (commentBloc.find('.votePlus').html() != '') ? parseInt(commentBloc.find('.votePlus').html()) : 0;
        var nbVoteDown = (commentBloc.find('.voteMoins').html() != '') ? Math.abs(parseInt(commentBloc.find('.voteMoins').html())) : 0;

        if(nbVoteUp > nbVotesMin && nbVoteDown <= (nbVoteUp / 2))
        {
            commentBloc.addClass('topVotes');
        }
        else if(false && nbVoteDown > nbVotesMin && nbVoteUp <= (nbVoteDown / 2))
        {
            commentBloc.addClass('badVotes');
        }
        else
        {
            commentBloc.removeClass('topVotes');
            commentBloc.removeClass('badVotes');
            commentBloc.find('.message').show();
            commentBloc.find('.avatar img').show();
        }
    }


    _old$('p#follow a, p#notFollow a').live('click', function(e){
        // No event
        e.preventDefault();
        var element = _old$(this);

        if(!element.hasClass('loading'))
        {
            _old$('.followInfo').hide();
            element.addClass('loading');
            ajax(element.attr('href'), 'GET', null, function(result){
                element.removeClass('loading');
                element.parent().removeClass('active');
                if(element.parent().attr('id') == 'follow')
                {
                    // remove Follow
                    _old$('p#notFollow').addClass('active');
                }

                if(element.parent().attr('id') == 'notFollow')
                {
                    // add Follow
                    _old$('p#follow').addClass('active');
                }

                _old$('.followInfo').show();
                setTimeout(function(){_old$('.followInfo').fadeOut('slow');},5000);
            });
         }

    });
});


</script>
<script type="text/javascript">

    jQuery.fn.extend({
        insertAtCaret: function(myValue){
        return this.each(function(i) {
            if (document.selection) {
                //For browsers like Internet Explorer
                this.focus();
                sel = document.selection.createRange();
                sel.text = myValue;
                this.focus();
            }
            else if (this.selectionStart || this.selectionStart == '0') {
                //For browsers like Firefox and Webkit based
                var startPos = this.selectionStart;
                var endPos = this.selectionEnd;
                if(startPos == '0'){
                    endPos = startPos = this.value.length;
                }
                var scrollTop = this.scrollTop;
                this.value = this.value.substring(0, startPos)+myValue+this.value.substring(endPos,this.value.length);
                this.focus();
                this.selectionStart = startPos + myValue.length;
                this.selectionEnd = startPos + myValue.length;
                this.scrollTop = scrollTop;
            } else {
                this.value += myValue;
                this.focus();
            }
        })
        }
    });

    function uploadReturn(returnCode, returnTxt){
        var loading = activeTextarea.closest('form').find('span.loading');
        loading.hide();
        var wrapError = activeTextarea.closest('form').find('span.error');
        if(returnCode){
            activeTextarea.insertAtCaret('![]('+returnTxt+')');
            wrapError.html('');
        }
        else{
            wrapError.html(returnTxt);
        }
        _old$('div.uploadMarkdownSource input[type=file]').removeAttr('disabled');
    }

    // Updates switch menu display
    _old$('.writingTypeSwitch').each(function(){
        switchMenuDisplay(_old$(this).closest('.wysiwygContent').find('textarea.tinymce').attr('id'));
    });

    _old$('div.uploadMarkdownSource a').on('click', function(e){
        e.preventDefault();
        _old$(this).next().click();
    });

    var activeTextarea = null;
    function sendImage(){
        _old$('div.uploadMarkdownSource input[type=file]').unbind('change');
        _old$('div.uploadMarkdownSource input[type=file]').change(function(){

            // preparation de l'iframe async si inexistante
            if(_old$('#uploadFrame').length<1)
                _old$('<iframe id="uploadFrame" name="uploadFrame" src="#" style="display:none"></iframe>').appendTo('body');

            var parentForm = _old$(this).closest('form');
            activeTextarea = parentForm.find('textarea');

            var loading = activeTextarea.closest('form').find('span.loading');
            loading.css('display', 'inline-block');

            var wrapError = activeTextarea.closest('form').find('span.error');
            wrapError.html('');

            var parentNode = _old$(this).parent();
            var parentNodeClone = parentNode.clone(true).insertAfter(parentNode);
            parentNodeClone.children('input').val('');

            // deplacement du champ input dans un nouveau form pour upload
            _old$('<form target="uploadFrame" action="/img/upload" method="post" class="markdownWrap" enctype="multipart/form-data" >').append(parentNode).insertAfter(parentForm);
            _old$('form.markdownWrap').submit().remove();

            _old$('div.uploadMarkdownSource input[type=file]').attr('disabled', 'disabled');

        });
    }
    sendImage();

    _old$('.switchMarkdown').on('click',function(){

        var divContent = _old$(this).closest('.wysiwygContent');

        if(isTextareaEmpty(divContent,true) && _old$(this).hasClass('inactive'))
        {
            switchToMarkdown(divContent);

            divContent.find('.writingType').val('markdown');
            // Remove wysiwyg
            tinyMCE.execCommand('mceRemoveControl', false, divContent.find('textarea').attr('id'));

            divContent.find('textarea').focus();
            currentFocus = divContent.find('textarea');
            wysiwygContent = divContent.find('.wysiwygContent');
            textareaContent = divContent.find('textarea');
        }
    });

    _old$('.switchEditeur').on('click',function(){
        var divContent = _old$(this).closest('.wysiwygContent');

        if(isTextareaEmpty(divContent,true) && _old$(this).hasClass('inactive'))
        {
            _old$(this).removeClass('inactive');

            divContent.find('.uploadMarkdownSource').hide();
            divContent.find('.switchMarkdown').addClass('inactive');
            // Hide mardown info, overview button and overview
            divContent.find('.infoMarkdown').hide();
            divContent.parent().find('.showMarkdownOverview').hide();
            if(divContent.parent().find('.markdownOverview').length > 0)
            {
                divContent.parent().find('.markdownOverview').remove();
            }

            divContent.find('.writingType').val('editor');
            // Add wysiwyg
            addWysiwyg(divContent.find('textarea').attr('id'), divContent.find('textarea').hasClass('error'));
            divContent.find('textarea').removeAttr('required');

            wysiwygContent = divContent.find('.wysiwygContent');
            textareaContent = divContent.find('textarea');
        }
    });

    // Display menu update when content changes
    _old$('.wysiwygContent textarea').on('keyup',function(){
        switchMenuDisplay(_old$(this).attr('id'));
    });

    // Mardown overview
    var lockOverview = false;

    _old$('.showMarkdownOverview').on('click',function(){
        var overviewButton = _old$(this);
        var parent = overviewButton.closest('form');
        var textarea = parent.find('.wysiwygContent textarea.tinymce');
        if(lockOverview == false)
        {
            lockOverview = true;
            // Disables textarea and overview button
            textarea.attr('disabled', 'disabled');
            overviewButton.attr('disabled', 'disabled');
            // Gets purified content
            ajax('/fr/apercu', 'POST', {content: textarea.val()}, function(result){
                // Replaces div content if exists or adds div
                if( parent.find('.markdownOverview').length > 0)
                {
                    parent.find('.markdownOverview').html(result);
                }
                else
                {
                    parent.append('<div class="markdownOverview comment">' + result + '</div>');
                }
                // Enables textarea and overview button
                textarea.removeAttr('disabled');
                overviewButton.removeAttr('disabled');
                SyntaxHighlighter.highlight();
                lockOverview = false;
            });
        }
    });

    // Display markdown info, overview button and updates switch classes
    function switchToMarkdown(divContent)
    {
        divContent.find('.infoMarkdown').show();
        divContent.parent().find('.showMarkdownOverview').show();
        divContent.find('.switchEditeur').addClass('inactive');
        divContent.find('.switchMarkdown').removeClass('inactive');
        divContent.find('.uploadMarkdownSource').show();
    }

    // Updates writing type menu display
    function switchMenuDisplay(id)
    {
        var divContent = _old$('#'+id).closest('.wysiwygContent');
        var writingTypeSwitch = divContent.find('.writingTypeSwitch');

        if(writingTypeSwitch.length > 0)
        {
            if(!writingTypeSwitch.is(':hidden') && !isTextareaEmpty(divContent,false))
            {
                writingTypeSwitch.hide();
            }

            if(writingTypeSwitch.is(':hidden') && isTextareaEmpty(divContent,false))
            {
                writingTypeSwitch.show();
            }
        }
        if(writingTypeSwitch.hasClass('prefill'))
        {
            writingTypeSwitch.removeClass('prefill');
            writingTypeSwitch.show();
        }
    }

    // Retrieves if texterea is empty or not, with optionaly an alert message
    function isTextareaEmpty(divContent, withMessage)
    {
        // if wysiwyg
        if(divContent.find('.mceEditor').length > 0)
        {
            tinyMCE.execCommand('mceFocus', false, divContent.find('textarea').attr('id'));

            if(tinyMCE.activeEditor.getContent() == '')
            {
                return true;
            }
        }
        // if markdown
        else if(divContent.find('textarea').val() == "")
        {
            return true;
        }

        if(withMessage)
        {
            alert("Vous ne pouvez plus changer de mode après avoir commencé à rédiger");
        }

        return false;
    }

    // Add wysiwyg or switch to markdown
    function updateTextareaDisplay(divContent)
    {
        if(divContent.find('.writingType').val() == 'editor')
        {
            var textarea = divContent.find('textarea.tinymce');
            tinyMCE.execCommand('mceRemoveControl', false, textarea.attr('id'));
            addWysiwyg(textarea.attr('id'), textarea.hasClass('error'));
        }
        else
        {
            switchToMarkdown(divContent);
        }
    }
</script>
<script type="text/javascript">
_old$(document).ready(function(){

    // Open Modal
    _old$('.moderateAction').click(function(e){

        // Set message
        if (_old$(this).hasClass('moderateActionAll'))
        {
            _old$('.modal-delete .messageDelete').html('Êtes-vous sûr de vouloir supprimer le sujet et TOUTES ses réponses ?')
        }
        else
        {
            _old$('.modal-delete .messageDelete').html('Attention vous allez supprimer définitivement ce message, êtes-vous sûr ?')
        }

        // Set action delete and moderate
        _old$('.modal-delete form').attr('action', _old$(this).attr('data-simpleit-delete'));
        _old$('.modal-moderate form').attr('action', _old$(this).attr('data-simpleit-moderate'));

        // Alert
        if(_old$(this).attr('data-simpleit-alert') == "true")
        {
            _old$('#alertAtClosed').show();
        }
        else
        {
            _old$('#alertAtClosed').hide();
        }

        // Set other reason behavior
        if (_old$('#basicModerateReason select').val() == '8')
        {
            _old$('#otherModerateReason input').show();
        }

        // Open this
        _old$('#moderateActionModal').fadeIn();
    });

    // Fixes anchor
    _old$('.btn-action-desactivate').live('click', function(e){e.preventDefault();});

    // Manage button
    _old$('.btn-action-activate').live('click', function(e){

        e.preventDefault();
        _old$('.btn-action-desactivate').addClass('btn-action-activate');
        _old$('.btn-action-desactivate').removeClass('btn-action-desactivate');
        _old$(this).addClass('btn-action-desactivate');
        _old$(this).removeClass('btn-action-activate');
        _old$('.modal-body-hidden').hide();
        _old$('.'+_old$(this).attr('data-simpleit-show')).fadeIn();

    });

    // Manage field hidden other reason
    _old$('#basicModerateReason select').live('change', function(e){
        _old$('#otherModerateReason input').hide();
        if (_old$(this).val() == '8')
        {
            _old$('#otherModerateReason input').show();
        }
    });
});
</script>
<script type="text/javascript">
    _old$('a.alertAction').click(function(){
        _old$('.modal-alert form').attr('action', _old$(this).attr('data-simpleit-alert'));
    });

    _old$('.modal-alert input[type=submit]').click(function(e){
        var error = "";

        var value = _old$('#alert_reason').val();

        if(value == '')
        {
            error = 'Veuillez indiquer une raison.';
        }
        else if(value.length > 500)
        {
            error = 'La raison ne doit pas dépasser 500 caractères.';
        }

        if(error != '')
        {
            e.preventDefault();
            _old$(this).closest('.modal-alert').find('div.error').html(error);
        }
    });
</script>
<script type="text/javascript">
_old$("a.deplacerAction").live('click', function(e){
    e.preventDefault();
});

</script>
<script type="text/javascript">var addthis_config = {"data_track_addressbar": false};</script>
<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-4fbe47ef2aab77a6"></script>

<script type="text/javascript">
    _old$(document).ready(function(){

        // Open Modal
        _old$('.deleteAction').click(function(e){

            // Set message
            if (_old$(this).hasClass('deleteActionAll'))
            {
                _old$('.modal-delete .messageDelete').html('Êtes-vous sûr de vouloir supprimer le sujet et TOUTES ses réponses ?')
            }
            else
            {
                _old$('.modal-delete .messageDelete').html('Attention vous allez supprimer définitivement ce message, êtes-vous sûr ?')
            }

            // Set action delete
            _old$('.modal-delete form').attr('action', _old$(this).attr('data-simpleit-delete'));

            // Alert
            if(_old$(this).attr('data-simpleit-alert') == "true")
            {
                _old$('#alertAtClosed').show();
            }
            else
            {
                _old$('#alertAtClosed').hide();
            }

            // Open this
            _old$('#deleteActionModal').fadeIn();
        });

        // Fixes anchor
        _old$('.btn-action-desactivate').live('click', function(e){e.preventDefault();});

        // Manage button
        _old$('.btn-action-activate').live('click', function(e){

            e.preventDefault();
            _old$('.btn-action-desactivate').addClass('btn-action-activate');
            _old$('.btn-action-desactivate').removeClass('btn-action-desactivate');
            _old$(this).addClass('btn-action-desactivate');
            _old$(this).removeClass('btn-action-activate');
            _old$('.modal-body-hidden').hide();
            _old$('.'+_old$(this).attr('data-simpleit-show')).fadeIn();

        });
    });
</script>
<script>
  var isPrerender = !!navigator.userAgent.match(/github\.com\/prerender\/prerender/);
  var preRenderBrowserFakeUa = "Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:61.0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/61.0.3163 Safari/537.36";
  var polyfillUrl = "https://cdn.polyfill.io/v3/polyfill.min.js?unknown=polyfill&features=default,es6,IntersectionObserver,Object.values,Array.prototype.includes,Array.prototype.findIndex,Array.prototype.find,Array.from,Promise.prototype.finally,fetch,String.prototype.includes,Object.entries,Array.prototype.entries,Intl.~locale,Array.prototype.flat.fr";

    if (isPrerender) {
    polyfillUrl+= "&ua=" + encodeURIComponent(preRenderBrowserFakeUa);
  }

  App.translations = {};

  App.scripts.push(polyfillUrl);

  App.script = {
      DASHBOARD: 'dashboard',
      MENTORSHIP_STUDENT_DASHBOARD: 'mentorshipStudentdashboard',
      SHOP: 'shop',
      PAYMENT: 'payment',
      PROJECTS: 'projects',
      TEAM: 'team',
      COURSE_EDIT: 'course_edit',
      COURSE_VIEW: 'course_view',
      ADMIN: 'admin',
      ADMIN_STUDENT_CREDENTIAL: 'adminStudentCredential',
      ADMIN_STUDENT_CREDENTIAL_EDIT: 'adminStudentCredentialEdit',
      POST_A_JOB: 'postAJob',
      GIG_WORKERS: 'gigWorkers',
      JOB_SURVEY: 'jobSurvey',
      MCQ_EDIT: 'mcqEdit',
      MCQ_VIEW: 'mcqView',
      MENTOR_EDIT: 'mentorEdit',
    PATHS: 'paths',
    PRIVATE_CONVERSATIONS: 'privateConversations',
    USER_PROFILE: 'userProfile',
    WELCOME: 'welcome',
    APPRENTICESHIP: 'apprenticeship',
    WEBAPP: 'webapp',
    PROJECTS_ADMIN: 'projectsAdmin',
    SECURITY: 'security',
  };

  App.scripts.push("/js/index.3b350da04a1db727a20e.js");
</script>
<script type="text/javascript">
        function getConsentedSegmentIntegrations() {
            // getCookie from https://www.w3schools.com/js/js_cookies.asp
            function getCookie(cname) {
                var name = cname + "=";
                var decodedCookie = decodeURIComponent(document.cookie);

                var ca = decodedCookie.split(';');
                for(var i = 0; i <ca.length; i++) {
                    var c = ca[i];
                    while (c.charAt(0) === ' ') {
                        c = c.substring(1);
                    }
                    if (c.indexOf(name) === 0) {
                        return c.substring(name.length, c.length);
                    }
                }
                return "";
            }

            var consent = getCookie('cmapi_cookie_privacy');

            function isCookieAllowedByConsent(consent, level) {
              return !!consent && consent.search(level) !== -1;
            }

            var isFunctionalCookieAllowed = isCookieAllowedByConsent(consent, 2);
            var isAdvertisingCookieAllowed = isCookieAllowedByConsent(consent, 3);

            var isAppCuesPremiumUser = false;

            var isOnPoleEmploiPage = !!window && window.location.pathname.indexOf('partners/pole-emploi/offers') >= 0;

            return {
                Amplitude: isFunctionalCookieAllowed,
                'Bing Ads': isAdvertisingCookieAllowed,
                'Google Ads': isAdvertisingCookieAllowed,
                'Google Analytics': isFunctionalCookieAllowed,
                'Zendesk': isFunctionalCookieAllowed,
                Appcues: (isAppCuesPremiumUser || isOnPoleEmploiPage) && isFunctionalCookieAllowed,
            };
        }

        var consentedSegmentIntegrations = getConsentedSegmentIntegrations();

        !function(){var analytics=window.analytics=window.analytics||[];if(!analytics.initialize)if(analytics.invoked)window.console&&console.error&&console.error("Segment snippet included twice.");else{analytics.invoked=!0;analytics.methods=["trackSubmit","trackClick","trackLink","trackForm","pageview","identify","reset","group","track","ready","alias","debug","page","once","off","on"];analytics.factory=function(t){return function(){var e=Array.prototype.slice.call(arguments);e.unshift(t);analytics.push(e);return analytics}};for(var t=0;t<analytics.methods.length;t++){var e=analytics.methods[t];analytics[e]=analytics.factory(e)}analytics.load=function(t,e){var n=document.createElement("script");n.type="text/javascript";n.async=!0;n.src="https://cdn.segment.com/analytics.js/v1/"+t+"/analytics.min.js";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(n,a);analytics._loadOptions=e};analytics.SNIPPET_VERSION="4.1.0";
            window.loadAnalytics = function () { window.analytics.load('mou95e6tdn', {integrations: consentedSegmentIntegrations}) };
        }}();
    </script>


<script>
    (function () {
        function loadScripts(cb) {
            App.scripts.forEach(function (src, index) {
                var script = document.createElement('script');
                script.src = src;
                script.async = false;
                document.body.appendChild(script);

                if (cb && index === App.scripts.length - 1) {
                    script.onload = cb;
                }
            });
        }

        function boot() {
            loadScripts(function () {
                if (App.modules) {
                    App.modules.startAll();
                }
            });
        }

        if (window.addEventListener) {
            window.addEventListener('load', boot, false);
        } else if (window.attachEvent) {
            window.attachEvent('onload', boot);
        } else {
            window.onload = boot;
        }
    }());
</script>
<script type="text/javascript">window.NREUM||(NREUM={});NREUM.info={"beacon":"bam.eu01.nr-data.net","licenseKey":"NRJS-5b58725ce0d442079d0","applicationID":"156815673","transactionName":"MhBSZQoZVhJWB0xfDAtac0QLDFcMGBBQRAYEEXZeCg1VPkENXUE=","queueTime":0,"applicationTime":277,"atts":"HldRE0IDRRw=","errorBeacon":"bam.eu01.nr-data.net","agent":""}</script><script defer src="https://static.cloudflareinsights.com/beacon.min.js/v652eace1692a40cfa3763df669d7439c1639079717194" integrity="sha512-Gi7xpJR8tSkrpF7aordPZQlW2DLtzUlZcumS8dMQjwDHEnw9I7ZLyiOj/6tZStRBGtGgN6ceN6cMH8z7etPGlw==" data-cf-beacon='{"rayId":"70d24669a96f15d3","token":"8e698008242e427fae12788d79d12ecf","version":"2021.12.0","si":100}' crossorigin="anonymous"></script>
</body>
</html>
