{"id":11211,"date":"2023-06-27T10:56:31","date_gmt":"2023-06-27T08:56:31","guid":{"rendered":"https:\/\/schedulejs.com\/?p=11211"},"modified":"2024-07-02T09:25:12","modified_gmt":"2024-07-02T07:25:12","slug":"contextual-menu","status":"publish","type":"post","link":"https:\/\/schedulejs.com\/fr\/contextual-menu\/","title":{"rendered":"Menu contextuel"},"content":{"rendered":"<div data-elementor-type=\"wp-post\" data-elementor-id=\"11211\" class=\"elementor elementor-11211\" data-elementor-settings=\"[]\">\n\t\t\t\t\t\t\t<div class=\"elementor-section-wrap\">\n\t\t\t\t\t\t\t<div class=\"elementor-section elementor-top-section elementor-element elementor-element-ae92876 elementor-section-stretched schedulejs-header-menu elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"ae92876\" data-element_type=\"section\" id=\"schedulejs-header-menu\" data-settings=\"{&quot;stretch_section&quot;:&quot;section-stretched&quot;,&quot;background_background&quot;:&quot;classic&quot;,&quot;animation&quot;:&quot;none&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-fee1607\" data-id=\"fee1607\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-a6a075e elementor-widget elementor-widget-image\" data-id=\"a6a075e\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/\">\n\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"900\" height=\"300\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2021\/05\/logo_schedulejs_blue_1500x500-2-1024x341.png\" class=\"attachment-large size-large\" alt=\"ScheduleJS logo with scheduling interface and calendar features.\" srcset=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2021\/05\/logo_schedulejs_blue_1500x500-2-1024x341.png 1024w, https:\/\/schedulejs.com\/wp-content\/uploads\/2021\/05\/logo_schedulejs_blue_1500x500-2-300x100.png 300w, https:\/\/schedulejs.com\/wp-content\/uploads\/2021\/05\/logo_schedulejs_blue_1500x500-2-768x256.png 768w, https:\/\/schedulejs.com\/wp-content\/uploads\/2021\/05\/logo_schedulejs_blue_1500x500-2-730x243.png 730w, https:\/\/schedulejs.com\/wp-content\/uploads\/2021\/05\/logo_schedulejs_blue_1500x500-2.png 1500w\" sizes=\"auto, (max-width: 900px) 100vw, 900px\" \/>\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-87efabb\" data-id=\"87efabb\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-03a8e64 elementor-widget elementor-widget-ekit-nav-menu\" data-id=\"03a8e64\" data-element_type=\"widget\" data-widget_type=\"ekit-nav-menu.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<div class=\"ekit-wid-con ekit_menu_responsive_tablet\" data-hamburger-icon=\"fas fa-bars\" data-hamburger-icon-type=\"icon\" data-responsive-breakpoint=\"1024\">            <button class=\"elementskit-menu-hamburger elementskit-menu-toggler\">\n                <i aria-hidden=\"true\" class=\"ekit-menu-icon fas fa-bars\"><\/i>            <\/button>\n            <div id=\"ekit-megamenu-schedulejs-primary-menu\" class=\"elementskit-menu-container elementskit-menu-offcanvas-elements elementskit-navbar-nav-default elementskit_line_arrow ekit-nav-menu-one-page-\"><ul id=\"main-menu\" class=\"elementskit-navbar-nav elementskit-menu-po-right submenu-click-on-\"><li id=\"menu-item-11511\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-11511 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/blog-javascript-framework\/\" class=\"ekit-menu-nav-link\">Blog<\/a><\/li>\n<li id=\"menu-item-2859\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-2859 nav-item delay-1 nav-item elementskit-dropdown-has relative_position elementskit-dropdown-menu-default_width elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/presentation-angular-gantt-library\/\" class=\"ekit-menu-nav-link ekit-menu-dropdown-toggle\">Produit<i class=\"icon icon-down-arrow1 elementskit-submenu-indicator\"><\/i><\/a>\n<ul class=\"elementskit-dropdown elementskit-submenu-panel\">\n\t<li id=\"menu-item-2860\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-2860 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/presentation-angular-gantt-library\/\" class=\"dropdown-item\">ScheduleJS<\/a>\t<li id=\"menu-item-10522\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-10522 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/schedule-js-viewer-2\/\" class=\"dropdown-item\">ScheduleJS Viewer<\/a>\t<li id=\"menu-item-12063\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-12063 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/api-code-typescript-gantt-library\/\" class=\"dropdown-item\">API &amp; Code<\/a>\t<li id=\"menu-item-2892\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-2892 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/example-gantt-js\/\" class=\"dropdown-item\">Cas pratique<\/a>\t<li id=\"menu-item-2890\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-2890 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/faqs-gantt-js\/\" class=\"dropdown-item\">FAQs<\/a><\/ul>\n<\/li>\n<li id=\"menu-item-11895\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-11895 nav-item delay-1 nav-item elementskit-dropdown-has relative_position elementskit-dropdown-menu-default_width elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/services-gantt-js\/\" class=\"ekit-menu-nav-link ekit-menu-dropdown-toggle\">Services<i class=\"icon icon-down-arrow1 elementskit-submenu-indicator\"><\/i><\/a>\n<ul class=\"elementskit-dropdown elementskit-submenu-panel\">\n\t<li id=\"menu-item-5624\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-5624 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/maintenance-support\/\" class=\"dropdown-item\">Maintenance &amp; Support<\/a>\t<li id=\"menu-item-11589\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-11589 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/training-gantt-js-2\/\" class=\"dropdown-item\">Formations<\/a>\t<li id=\"menu-item-5622\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-5622 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/development\/\" class=\"dropdown-item\">D\u00e9veloppement<\/a>\t<li id=\"menu-item-5626\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-5626 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/ui-ux-design\/\" class=\"dropdown-item\">Design UI \/ UX<\/a>\t<li id=\"menu-item-5623\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-5623 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/flexgantt-migration\/\" class=\"dropdown-item\">Migration FlexGantt<\/a>\t<li id=\"menu-item-5621\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-5621 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/proof-of-concept-gantt-js\/\" class=\"dropdown-item\">Proof of Concept<\/a><\/ul>\n<\/li>\n<li id=\"menu-item-11590\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-11590 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/pricing-js-gantt\/\" class=\"ekit-menu-nav-link\">Tarification<\/a><\/li>\n<li id=\"menu-item-6751\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-6751 nav-item delay-1 nav-item elementskit-dropdown-has relative_position elementskit-dropdown-menu-default_width elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/job-openings\/\" class=\"ekit-menu-nav-link ekit-menu-dropdown-toggle\">Carri\u00e8res<i class=\"icon icon-down-arrow1 elementskit-submenu-indicator\"><\/i><\/a>\n<ul class=\"elementskit-dropdown elementskit-submenu-panel\">\n\t<li id=\"menu-item-7071\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-7071 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/our-work-gantt-js\/\" class=\"dropdown-item\">Notre travail<\/a>\t<li id=\"menu-item-7072\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-7072 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/job-openings\/\" class=\"dropdown-item\">Offres d'emploi<\/a><\/ul>\n<\/li>\n<li id=\"menu-item-2937\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-2937 nav-item delay-1 nav-item elementskit-dropdown-has relative_position elementskit-dropdown-menu-default_width elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/contact-support-schedulejs\/\" class=\"ekit-menu-nav-link ekit-menu-dropdown-toggle\">Support<i class=\"icon icon-down-arrow1 elementskit-submenu-indicator\"><\/i><\/a>\n<ul class=\"elementskit-dropdown elementskit-submenu-panel\">\n\t<li id=\"menu-item-13480\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-13480 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/enterprise-license\/\" class=\"dropdown-item\">Licence Entreprise<\/a>\t<li id=\"menu-item-13481\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-13481 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/internal-development-license\/\" class=\"dropdown-item\">Licence Interne<\/a>\t<li id=\"menu-item-13491\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-13491 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/schedulejs-viewer-license\/\" class=\"dropdown-item\">Licence ScheduleJS Viewer<\/a>\t<li id=\"menu-item-2935\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-2935 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/submit-a-ticket\/\" class=\"dropdown-item\">Cr\u00e9er un ticket<\/a>\t<li id=\"menu-item-3367\" class=\"menu-item menu-item-type-custom menu-item-object-custom menu-item-3367 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a target=\"_blank\" href=\"https:\/\/www.schedulejs.com\/api\/docs\/index.html\" class=\"dropdown-item\">Documentation de l'API<\/a>\t<li id=\"menu-item-7319\" class=\"menu-item menu-item-type-custom menu-item-object-custom menu-item-7319 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a target=\"_blank\" href=\"https:\/\/schedulejs.com\/fr\/manual\/\" class=\"dropdown-item\">Manuel du d\u00e9veloppeur<\/a><\/ul>\n<\/li>\n<li id=\"menu-item-12479\" class=\"contact-menu menu-item menu-item-type-post_type menu-item-object-page menu-item-12479 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/contact-schedulejs\/\" class=\"ekit-menu-nav-link\">Contact<\/a><\/li>\n<li id=\"menu-item-11921\" class=\"trp-language-switcher-container menu-item menu-item-type-post_type menu-item-object-language_switcher menu-item-has-children current-language-menu-item menu-item-11921 nav-item delay-1 nav-item elementskit-dropdown-has relative_position elementskit-dropdown-menu-default_width elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/fr\/wp-json\/wp\/v2\/posts\/11211\" class=\"ekit-menu-nav-link ekit-menu-dropdown-toggle\"><span data-no-translation><img loading=\"lazy\" decoding=\"async\" class=\"trp-flag-image\" src=\"https:\/\/schedulejs.com\/wp-content\/plugins\/translatepress-multilingual\/assets\/images\/flags\/fr_FR.png\" width=\"18\" height=\"12\" alt=\"fr_FR\" title=\"Fran\u00e7ais\"><span class=\"trp-ls-language-name\">Fran\u00e7ais<\/span><\/span><i class=\"icon icon-down-arrow1 elementskit-submenu-indicator\"><\/i><\/a>\n<ul class=\"elementskit-dropdown elementskit-submenu-panel\">\n\t<li id=\"menu-item-11923\" class=\"trp-language-switcher-container menu-item menu-item-type-post_type menu-item-object-language_switcher menu-item-11923 nav-item delay-1 nav-item elementskit-mobile-builder-content\" data-vertical-menu=\"750px\"><a href=\"https:\/\/schedulejs.com\/en\/wp-json\/wp\/v2\/posts\/11211\/\" class=\"dropdown-item\"><span data-no-translation><img loading=\"lazy\" decoding=\"async\" class=\"trp-flag-image\" src=\"https:\/\/schedulejs.com\/wp-content\/plugins\/translatepress-multilingual\/assets\/images\/flags\/en_US.png\" width=\"18\" height=\"12\" alt=\"en_US\" title=\"English\"><span class=\"trp-ls-language-name\">English<\/span><\/span><\/a><\/ul>\n<\/li>\n<\/ul>\n\t\t\t\t<div class=\"elementskit-nav-identity-panel\">\n\t\t\t\t\t<div class=\"elementskit-site-title\">\n\t\t\t\t\t\t<a class=\"elementskit-nav-logo\" href=\"https:\/\/schedulejs.com\/fr\" target=\"_self\" rel=\"\">\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2021\/04\/logo_schedulejs_blue_1128x191-1.png\" alt=\"ScheduleJS logo and scheduling interface for efficient appointment management.\">\n\t\t\t\t\t\t<\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<button class=\"elementskit-menu-close elementskit-menu-toggler\" type=\"button\">X<\/button>\n\t\t\t\t<\/div>\n\t\t\t<\/div><div class=\"elementskit-menu-overlay elementskit-menu-offcanvas-elements elementskit-menu-toggler ekit-nav-menu--overlay\"><\/div><\/div>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-db2e1c4 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"db2e1c4\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-9bf4f10 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"9bf4f10\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;,&quot;shape_divider_top&quot;:&quot;mountains&quot;,&quot;shape_divider_bottom&quot;:&quot;mountains&quot;}\">\n\t\t\t\t\t<div class=\"elementor-shape elementor-shape-top\" data-negative=\"false\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewbox=\"0 0 1000 100\" preserveaspectratio=\"none\">\n\t<path class=\"elementor-shape-fill\" opacity=\"0.33\" d=\"M473,67.3c-203.9,88.3-263.1-34-320.3,0C66,119.1,0,59.7,0,59.7V0h1000v59.7 c0,0-62.1,26.1-94.9,29.3c-32.8,3.3-62.8-12.3-75.8-22.1C806,49.6,745.3,8.7,694.9,4.7S492.4,59,473,67.3z\"\/>\n\t<path class=\"elementor-shape-fill\" opacity=\"0.66\" d=\"M734,67.3c-45.5,0-77.2-23.2-129.1-39.1c-28.6-8.7-150.3-10.1-254,39.1 s-91.7-34.4-149.2,0C115.7,118.3,0,39.8,0,39.8V0h1000v36.5c0,0-28.2-18.5-92.1-18.5C810.2,18.1,775.7,67.3,734,67.3z\"\/>\n\t<path class=\"elementor-shape-fill\" d=\"M766.1,28.9c-200-57.5-266,65.5-395.1,19.5C242,1.8,242,5.4,184.8,20.6C128,35.8,132.3,44.9,89.9,52.5C28.6,63.7,0,0,0,0 h1000c0,0-9.9,40.9-83.6,48.1S829.6,47,766.1,28.9z\"\/>\n<\/svg>\t\t<\/div>\n\t\t\t\t<div class=\"elementor-shape elementor-shape-bottom\" data-negative=\"false\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewbox=\"0 0 1000 100\" preserveaspectratio=\"none\">\n\t<path class=\"elementor-shape-fill\" opacity=\"0.33\" d=\"M473,67.3c-203.9,88.3-263.1-34-320.3,0C66,119.1,0,59.7,0,59.7V0h1000v59.7 c0,0-62.1,26.1-94.9,29.3c-32.8,3.3-62.8-12.3-75.8-22.1C806,49.6,745.3,8.7,694.9,4.7S492.4,59,473,67.3z\"\/>\n\t<path class=\"elementor-shape-fill\" opacity=\"0.66\" d=\"M734,67.3c-45.5,0-77.2-23.2-129.1-39.1c-28.6-8.7-150.3-10.1-254,39.1 s-91.7-34.4-149.2,0C115.7,118.3,0,39.8,0,39.8V0h1000v36.5c0,0-28.2-18.5-92.1-18.5C810.2,18.1,775.7,67.3,734,67.3z\"\/>\n\t<path class=\"elementor-shape-fill\" d=\"M766.1,28.9c-200-57.5-266,65.5-395.1,19.5C242,1.8,242,5.4,184.8,20.6C128,35.8,132.3,44.9,89.9,52.5C28.6,63.7,0,0,0,0 h1000c0,0-9.9,40.9-83.6,48.1S829.6,47,766.1,28.9z\"\/>\n<\/svg>\t\t<\/div>\n\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-b3f9623\" data-id=\"b3f9623\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-230fb91 elementor-invisible elementor-widget elementor-widget-image\" data-id=\"230fb91\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/elementor\/thumbs\/context-menu-rnoid7kj66uxnb519po2r4ulq3hnfkusdnkmqxj15s.png\" title=\"planning board with gantt charts\" alt=\"JS Gantt Screenshot\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-9b38a48 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"9b38a48\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;,&quot;shape_divider_top&quot;:&quot;mountains&quot;}\">\n\t\t\t\t\t<div class=\"elementor-shape elementor-shape-top\" data-negative=\"false\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewbox=\"0 0 1000 100\" preserveaspectratio=\"none\">\n\t<path class=\"elementor-shape-fill\" opacity=\"0.33\" d=\"M473,67.3c-203.9,88.3-263.1-34-320.3,0C66,119.1,0,59.7,0,59.7V0h1000v59.7 c0,0-62.1,26.1-94.9,29.3c-32.8,3.3-62.8-12.3-75.8-22.1C806,49.6,745.3,8.7,694.9,4.7S492.4,59,473,67.3z\"\/>\n\t<path class=\"elementor-shape-fill\" opacity=\"0.66\" d=\"M734,67.3c-45.5,0-77.2-23.2-129.1-39.1c-28.6-8.7-150.3-10.1-254,39.1 s-91.7-34.4-149.2,0C115.7,118.3,0,39.8,0,39.8V0h1000v36.5c0,0-28.2-18.5-92.1-18.5C810.2,18.1,775.7,67.3,734,67.3z\"\/>\n\t<path class=\"elementor-shape-fill\" d=\"M766.1,28.9c-200-57.5-266,65.5-395.1,19.5C242,1.8,242,5.4,184.8,20.6C128,35.8,132.3,44.9,89.9,52.5C28.6,63.7,0,0,0,0 h1000c0,0-9.9,40.9-83.6,48.1S829.6,47,766.1,28.9z\"\/>\n<\/svg>\t\t<\/div>\n\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-693262b\" data-id=\"693262b\" data-element_type=\"column\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;}\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-74339fd elementor-invisible elementor-widget elementor-widget-elementskit-button\" data-id=\"74339fd\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInLeft&quot;}\" data-widget_type=\"elementskit-button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<div class=\"ekit-wid-con\" >\t\t<div class=\"ekit-btn-wraper\">\n\t\t\t\t\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/blog\/\" class=\"elementskit-btn  whitespace--normal\" >\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\tRetour au blog\t\t\t\t<\/a>\n\t\t\t\t\t\t<\/div>\n        <\/div>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6a689bad elementor-invisible elementor-widget elementor-widget-heading\" data-id=\"6a689bad\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInLeft&quot;}\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h1 class=\"elementor-heading-title elementor-size-xl\">Mise en place d'un menu contextuel<\/h1>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-452009b6 elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"452009b6\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInLeft&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<p>G\u00e9n\u00e9rez des raccourcis et des interactions puissantes avec vos graphiques en cr\u00e9ant un menu contextuel. Cet article propose une impl\u00e9mentation en quatre \u00e9tapes d'un syst\u00e8me de menu contextuel \u00e0 partir de z\u00e9ro dans vos graphiques ScheduleJS.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-344eb0c elementor-invisible elementor-widget elementor-widget-heading\" data-id=\"344eb0c\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInRight&quot;,&quot;_animation_delay&quot;:600}\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h6 class=\"elementor-heading-title elementor-size-default\">Tuesday, June 27th, 2023 - 5 minutes read<\/h6>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-13c5fd21 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"13c5fd21\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-1b6ca9da\" data-id=\"1b6ca9da\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-abd97a4 elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"abd97a4\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<h2 style=\"color: #181926; margin-bottom: 25px;\">\u00c9tape 1 : D\u00e9finir la structure de votre menu contextuel \u00e0 l'aide de HTML\u00a0<\/h2><p>La premi\u00e8re \u00e9tape de ce tutoriel consiste \u00e0 d\u00e9clarer votre menu contextuel dans la partie HTML de l'application. La meilleure fa\u00e7on de garder votre code propre est de cr\u00e9er un composant d\u00e9di\u00e9 au rendu du menu contextuel et \u00e0 la d\u00e9finition de vos interactions.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-757c330 elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"757c330\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<p>Le <code>display<\/code> sera utilis\u00e9e pour cacher et afficher le menu contextuel, tandis que nous mettrons \u00e0 jour sa position \u00e0 l'aide de CSS et la ferons passer par la classe enfant Angular <code>[ngStyle]<\/code> propri\u00e9t\u00e9 d'entr\u00e9e.<\/p><p>Ici, nous avons cr\u00e9\u00e9 une mise en page contextuelle simple avec quatre actions :<\/p><ul><li><code>Set started<\/code>: Modifier l'\u00e9tat de l'activit\u00e9 et la d\u00e9finir comme commenc\u00e9e<\/li><li><code>Set completed<\/code>: D\u00e9finir l'activit\u00e9 comme termin\u00e9e<\/li><li><code>Set late<\/code>: D\u00e9finir la s\u00e9quence d'activit\u00e9s comme tardive, \u00e0 partir d'une activit\u00e9 sp\u00e9cifique<\/li><li><code>Set priority<\/code>: D\u00e9finir la priorit\u00e9 comme \u00e9lev\u00e9e ou supprimer ce param\u00e8tre<\/li><\/ul><p>Faisons maintenant un peu de CSS pour rendre le tout plus joli. Nous recommandons d'utiliser SCSS pour cr\u00e9er une port\u00e9e pour les classes de style comme suit :<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-8fa88b4 elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"8fa88b4\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<p>Une fois cela fait, nous pouvons commencer \u00e0 jouer avec Angular pour cr\u00e9er la logique de cet \u00e9l\u00e9ment.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-2d11331 elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"2d11331\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<h2 style=\"color: #181926; margin-bottom: 25px;\">\u00c9tape 2 : Cr\u00e9er une abstraction de superposition<\/h2><p>En utilisant une approche orient\u00e9e objet, nous pouvons d\u00e9finir une abstraction qui sera le point de d\u00e9part de toutes nos superpositions, de sorte que nous puissions la r\u00e9utiliser pour cr\u00e9er des infobulles, des modales, etc.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0a16e30 elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"0a16e30\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<p>Stockons quelques propri\u00e9t\u00e9s qui contiendront l'\u00e9tat de notre abstraction de superposition actuelle :<\/p><ul><li>Le <code>isHidden<\/code> sera utilis\u00e9e pour masquer et afficher le recouvrement.<\/li><li>Le <code>activity<\/code> permet de relier notre superposition \u00e0 une activit\u00e9 sp\u00e9cifique.<\/li><li>Le <code>position<\/code> d\u00e9finira l'endroit o\u00f9 la superposition doit \u00eatre rendue \u00e0 l'aide de notre propri\u00e9t\u00e9 <code>PointerEvent<\/code>.<\/li><\/ul><p>Exposer le <code>GanttChart<\/code> dans la superposition nous aidera \u00e0 cr\u00e9er des actions et \u00e0 interagir avec nos graphiques.<\/p><p>La superposition exposera \u00e9galement trois m\u00e9thodes :<\/p><ul><li>Le <code>onShow<\/code> est utilis\u00e9e pour d\u00e9finir la strat\u00e9gie d'affichage.<\/li><li>Le <code>onHide<\/code> methode.<\/li><li>Le <code>setOverlayElementPosition<\/code> mettra \u00e0 jour le <code>position<\/code> propri\u00e9t\u00e9.\u00a0<\/li><\/ul>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-74969b8 elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"74969b8\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<h2 style=\"color: #181926; margin-bottom: 25px;\">\u00c9tape 3 : Construire la logique du menu contextuel<\/h2><p>En utilisant notre <code>PlanningBoardAbstractOverlay<\/code> nous pouvons maintenant cr\u00e9er une nouvelle classe abstraite <code>PlanningBoardContextMenuOverlay<\/code> qui contiendra la logique de notre menu contextuel.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e079e82 elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"e079e82\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<p>Concevons le <code>onShow<\/code> processus :<\/p><ul><li>Lorsque vous ouvrez le menu avec une activit\u00e9, nous enregistrons cette activit\u00e9 et affichons notre menu contextuel. Utilisons l'activit\u00e9 <code>setOverlayElementPosition<\/code> que nous avons cr\u00e9\u00e9e dans notre classe abstraite et lui donner notre <code>PointerEvent<\/code>.<\/li><li>Si le menu contextuel est ouvert sans activit\u00e9 contextuelle, nous d\u00e9clenchons la fonction <code>onHide<\/code> methode.<\/li><\/ul><p>Nos quatre actions mettront \u00e0 jour les donn\u00e9es d'activit\u00e9 et d\u00e9clencheront un <code>redraw<\/code>, letting our underlying <code>ActivityRenderer<\/code> mettre \u00e0 jour les graphiques avec ces nouvelles informations.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c9b9988 elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"c9b9988\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<h2 style=\"color: #181926; margin-bottom: 25px;\">\u00c9tape 4 : D\u00e9clencher le menu contextuel<\/h2><p>ScheduleJS propose un large \u00e9ventail de m\u00e9thodes \u00e9v\u00e9nementielles que vous pouvez enregistrer dans l'objet principal : la m\u00e9thode <code>GanttChart<\/code>. Une fa\u00e7on simple d'organiser le code est de cr\u00e9er un fichier <code>GanttChart<\/code> class that extends the default <code>GanttChart<\/code>.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c14f162 elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"c14f162\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<p>En tant que <code>GanttChart<\/code> est au c\u0153ur de ScheduleJS, sa classe est un endroit id\u00e9al pour enregistrer les moteurs de rendu par d\u00e9faut, les couches du syst\u00e8me et les gestionnaires d'\u00e9v\u00e9nements. Notez que l'API ScheduleJS est accessible par l'interm\u00e9diaire de l'objet <code>GanttChart<\/code> avec des m\u00e9thodes telles que <code>gantt.getGraphics()<\/code>.<\/p><p>Le <code>GanttChart<\/code> propose un ensemble de m\u00e9thodes surchargeables con\u00e7ues pour g\u00e9rer les donn\u00e9es saisies par l'utilisateur sur les graphiques, par exemple :<\/p><ul><li><code>onRowDrawingEnginePointerDown<\/code><\/li><li><code>onDatelinePointerMove<\/code><\/li><li><code>onToggleGrid<\/code><\/li><\/ul><p>Ce que nous voulons faire ici, c'est remplacer la fonction <code>onRowDrawingEngineContextMenu<\/code> pour d\u00e9clencher une logique lors de l'ouverture de notre menu contextuel. Dans un environnement de bureau, cette m\u00e9thode est appel\u00e9e lorsque l'utilisateur clique avec le bouton droit de la souris n'importe o\u00f9 sur les graphiques.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-61ac5dc elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"61ac5dc\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<p>Maintenant, lorsque l'utilisateur clique avec le bouton droit de la souris sur les graphiques, ce code se d\u00e9clenche avec l'\u00e9v\u00e9nement de pointeur sous-jacent, la ligne actuelle et l'indice de ligne. Nous pouvons extraire la ligne courante <code>hoveredActivity<\/code> en utilisant le <code>graphics.getHoveredActivity<\/code> et la transmettre \u00e0 la couche <code>onShow<\/code> methode.<\/p><p>Le menu contextuel que nous construisons ajoutera des interactions avec les activit\u00e9s pr\u00e9sentes sur le canevas. Lors d'un clic droit de l'utilisateur, nous v\u00e9rifions si nous survolons une activit\u00e9, et si c'est le cas, nous masquons notre infobulle et d\u00e9clenchons la commande <code>contextMenuOverlay.onShow<\/code> methode.<\/p><p>Pour des raisons de performance, cette m\u00e9thode est ex\u00e9cut\u00e9e en dehors de la zone Angular par ScheduleJS. Nous devons donc ajouter un appel \u00e0 <code>ChangeDetectorRef.detectChanges()<\/code> pour d\u00e9clencher manuellement la d\u00e9tection des changements et mettre \u00e0 jour le DOM.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-dbb9ec0 elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"dbb9ec0\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<h2 style=\"color: #181926; margin-bottom: 25px;\">R\u00e9sultat final<\/h2><p>La vid\u00e9o suivante pr\u00e9sente les quatre nouvelles actions que nous venons de cr\u00e9er :<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-49ed047 elementor-aspect-ratio-32 elementor-widget elementor-widget-video\" data-id=\"49ed047\" data-element_type=\"widget\" data-settings=\"{&quot;video_type&quot;:&quot;hosted&quot;,&quot;aspect_ratio&quot;:&quot;32&quot;,&quot;controls&quot;:&quot;yes&quot;}\" data-widget_type=\"video.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"e-hosted-video elementor-wrapper elementor-fit-aspect-ratio elementor-open-inline\">\n\t\t\t\t\t<video class=\"elementor-video\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2023\/06\/context-menu.mp4\" controls=\"\" controlslist=\"nodownload\"><\/video>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6a6916c elementor-invisible elementor-widget elementor-widget-text-editor\" data-id=\"6a6916c\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeIn&quot;}\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<p>Cet exemple n'est qu'une simple impl\u00e9mentation d'un menu contextuel, le but \u00e9tant de vous donner des id\u00e9es sur la fa\u00e7on dont vous pouvez interagir avec vos graphiques ScheduleJS. Vous pouvez utiliser les m\u00eames principes pour construire un menu contextuel plus avanc\u00e9, ou m\u00eame int\u00e9grer une biblioth\u00e8que tierce qui acc\u00e9l\u00e9rera le d\u00e9veloppement du menu contextuel et d\u00e9clenchera l'API ScheduleJS \u00e0 partir d'ici. \u00c0 vous de jouer !\u00a0<\/p><div style=\"text-align: center; margin-top: 45px; margin-bottom: 20px;\"><strong>S'il vous pla\u00eet <a href=\"https:\/\/schedulejs.com\/fr\/contact\/\">nous contacter<\/a> si vous avez des d\u00e9fis UX\/UI ou des id\u00e9es pour ScheduleJS !<\/strong><\/div>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-f2eace9 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"f2eace9\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-8bea6f0\" data-id=\"8bea6f0\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-629ebc3 elementor-invisible elementor-widget elementor-widget-heading\" data-id=\"629ebc3\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInRight&quot;}\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Plus d'articles sur la mise en \u0153uvre<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-ddc14ce elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"ddc14ce\" data-element_type=\"section\" data-settings=\"{&quot;shape_divider_top&quot;:&quot;mountains&quot;}\">\n\t\t\t\t\t<div class=\"elementor-shape elementor-shape-top\" data-negative=\"false\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewbox=\"0 0 1000 100\" preserveaspectratio=\"none\">\n\t<path class=\"elementor-shape-fill\" opacity=\"0.33\" d=\"M473,67.3c-203.9,88.3-263.1-34-320.3,0C66,119.1,0,59.7,0,59.7V0h1000v59.7 c0,0-62.1,26.1-94.9,29.3c-32.8,3.3-62.8-12.3-75.8-22.1C806,49.6,745.3,8.7,694.9,4.7S492.4,59,473,67.3z\"\/>\n\t<path class=\"elementor-shape-fill\" opacity=\"0.66\" d=\"M734,67.3c-45.5,0-77.2-23.2-129.1-39.1c-28.6-8.7-150.3-10.1-254,39.1 s-91.7-34.4-149.2,0C115.7,118.3,0,39.8,0,39.8V0h1000v36.5c0,0-28.2-18.5-92.1-18.5C810.2,18.1,775.7,67.3,734,67.3z\"\/>\n\t<path class=\"elementor-shape-fill\" d=\"M766.1,28.9c-200-57.5-266,65.5-395.1,19.5C242,1.8,242,5.4,184.8,20.6C128,35.8,132.3,44.9,89.9,52.5C28.6,63.7,0,0,0,0 h1000c0,0-9.9,40.9-83.6,48.1S829.6,47,766.1,28.9z\"\/>\n<\/svg>\t\t<\/div>\n\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-410297c\" data-id=\"410297c\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-fe84f8c premium-blog-align-left premium-blog-align-left elementor-invisible elementor-widget elementor-widget-premium-addon-blog\" data-id=\"fe84f8c\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInRight&quot;}\" data-widget_type=\"premium-addon-blog.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t<div class=\"premium-blog\">\n\t\t\t\t<div class=\"premium-blog-wrap  premium-blog-even\" data-scroll=\"1\" data-infinite=\"\" data-layout=\"even\" data-equal=\"true\" data-page=\"11211\" data-carousel=\"1\" data-grid=\"true\" data-fade=\"false\" data-play=\"1\" data-center=\"false\" data-slides-spacing=\"0\" data-speed=\"8000\" data-col=\"3\" data-col-tablet=\"2\" data-col-mobile=\"1\" data-arrows=\"true\" data-dots=\"true\" data-scroll-slides=\"\">\n\t\t\t\t\t<div class=\"premium-blog-post-outer-container\" data-total=\"2\">\n\t\t\t<div class=\"premium-blog-post-container premium-blog-skin-classic\">\n\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumb-effect-wrapper\">\n\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-container premium-blog-zoomin-effect\">\n\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"2560\" height=\"1707\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2025\/12\/keyboard-oldschool-scaled.jpg\" class=\"attachment-full size-full\" alt=\"\" \/>\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-overlay\">\n\t\t\t\t\t\t\t\t<a class=\"elementor-icon\" href=\"https:\/\/schedulejs.com\/fr\/keyboard-events-and-user-interactions\/\" target=\"_self\"><\/a>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-content-wrapper\">\n\t\t\t\t\t<div class=\"premium-blog-content-wrapper-inner\">\n\t\t\t\t\t\t<div class=\"premium-blog-inner-container\">\n\t\t\t\t\t\t\t<div class=\"premium-blog-entry-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h2 class=\"premium-blog-entry-title\">\n\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/keyboard-events-and-user-interactions\/\" target=\"_self\">\n\t\t\t\tKeyboard Events and User Interactions\t\t\t<\/a>\n\t\t<\/h2>\n\t\t\t\t<div class=\"premium-blog-entry-meta\">\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-time premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-clock-o\"><\/i>\n\t\t\t\t\t<span>avril 9, 2026<\/span>\n\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-categories premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-align-left fa-fw\"><\/i>\n\t\t\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/category\/features\/\" rel=\"category tag\">Fonctionnalit\u00e9s<\/a>, <a href=\"https:\/\/schedulejs.com\/fr\/category\/implementations\/\" rel=\"category tag\">Impl\u00e9mentations<\/a>\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<p class=\"premium-blog-post-content\">How to handle application events in ScheduleJS. Manage user inputs while performing ScheduleJS actions, design the perfect UX for your app.<\/p>\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t\t\t<div class=\"premium-blog-post-outer-container\" data-total=\"2\">\n\t\t\t<div class=\"premium-blog-post-container premium-blog-skin-classic\">\n\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumb-effect-wrapper\">\n\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-container premium-blog-zoomin-effect\">\n\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1784\" height=\"1366\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2026\/03\/Screenshot-2026-03-13-at-14.47.46.png\" class=\"attachment-full size-full\" alt=\"\" \/>\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-overlay\">\n\t\t\t\t\t\t\t\t<a class=\"elementor-icon\" href=\"https:\/\/schedulejs.com\/fr\/tree-table-customization\/\" target=\"_self\"><\/a>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-content-wrapper\">\n\t\t\t\t\t<div class=\"premium-blog-content-wrapper-inner\">\n\t\t\t\t\t\t<div class=\"premium-blog-inner-container\">\n\t\t\t\t\t\t\t<div class=\"premium-blog-entry-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h2 class=\"premium-blog-entry-title premium-blog-entry-title\">\n\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/tree-table-customization\/\" target=\"_self\">\n\t\t\t\tTree Table Customization\t\t\t<\/a>\n\t\t<\/h2>\n\t\t\t\t<div class=\"premium-blog-entry-meta\">\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-time premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-clock-o\"><\/i>\n\t\t\t\t\t<span>mars 13, 2026<\/span>\n\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-categories premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-align-left fa-fw\"><\/i>\n\t\t\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/category\/features\/\" rel=\"category tag\">Fonctionnalit\u00e9s<\/a>, <a href=\"https:\/\/schedulejs.com\/fr\/category\/implementations\/\" rel=\"category tag\">Impl\u00e9mentations<\/a>\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<p class=\"premium-blog-post-content\">Tree tables can be extensively customised in ScheduleJS: colorful row headers, multiple child levels, display, and interactions<\/p>\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t\t\t<div class=\"premium-blog-post-outer-container\" data-total=\"2\">\n\t\t\t<div class=\"premium-blog-post-container premium-blog-skin-classic\">\n\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumb-effect-wrapper\">\n\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-container premium-blog-zoomin-effect\">\n\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"2560\" height=\"2041\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2026\/02\/viewer-on-white-scaled.png\" class=\"attachment-full size-full\" alt=\"\" \/>\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-overlay\">\n\t\t\t\t\t\t\t\t<a class=\"elementor-icon\" href=\"https:\/\/schedulejs.com\/fr\/building-custom-tree-tables-in-schedulejs\/\" target=\"_self\"><\/a>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-content-wrapper\">\n\t\t\t\t\t<div class=\"premium-blog-content-wrapper-inner\">\n\t\t\t\t\t\t<div class=\"premium-blog-inner-container\">\n\t\t\t\t\t\t\t<div class=\"premium-blog-entry-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h2 class=\"premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title\">\n\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/building-custom-tree-tables-in-schedulejs\/\" target=\"_self\">\n\t\t\t\tBuilding custom Tree Tables in ScheduleJS\t\t\t<\/a>\n\t\t<\/h2>\n\t\t\t\t<div class=\"premium-blog-entry-meta\">\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-time premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-clock-o\"><\/i>\n\t\t\t\t\t<span>f\u00e9vrier 5, 2026<\/span>\n\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-categories premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-align-left fa-fw\"><\/i>\n\t\t\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/category\/features\/\" rel=\"category tag\">Fonctionnalit\u00e9s<\/a>, <a href=\"https:\/\/schedulejs.com\/fr\/category\/implementations\/\" rel=\"category tag\">Impl\u00e9mentations<\/a>\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<p class=\"premium-blog-post-content\">Build custom tree tables in ScheduleJS using schedule-info-column-header-cell and schedule-info-column-row-cell components.<\/p>\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t\t\t<div class=\"premium-blog-post-outer-container\" data-total=\"2\">\n\t\t\t<div class=\"premium-blog-post-container premium-blog-skin-classic\">\n\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumb-effect-wrapper\">\n\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-container premium-blog-zoomin-effect\">\n\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"2880\" height=\"1800\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2023\/08\/Screenshot-2023-08-03-at-16.54.49.png\" class=\"attachment-full size-full\" alt=\"Big Gantt charts\" \/>\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-overlay\">\n\t\t\t\t\t\t\t\t<a class=\"elementor-icon\" href=\"https:\/\/schedulejs.com\/fr\/row-management-and-layout-control-in-schedulejs\/\" target=\"_self\"><\/a>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-content-wrapper\">\n\t\t\t\t\t<div class=\"premium-blog-content-wrapper-inner\">\n\t\t\t\t\t\t<div class=\"premium-blog-inner-container\">\n\t\t\t\t\t\t\t<div class=\"premium-blog-entry-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h2 class=\"premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title\">\n\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/row-management-and-layout-control-in-schedulejs\/\" target=\"_self\">\n\t\t\t\tRow Management and Layout Control in ScheduleJS\t\t\t<\/a>\n\t\t<\/h2>\n\t\t\t\t<div class=\"premium-blog-entry-meta\">\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-time premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-clock-o\"><\/i>\n\t\t\t\t\t<span>janvier 17, 2026<\/span>\n\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-categories premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-align-left fa-fw\"><\/i>\n\t\t\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/category\/features\/\" rel=\"category tag\">Fonctionnalit\u00e9s<\/a>, <a href=\"https:\/\/schedulejs.com\/fr\/category\/implementations\/\" rel=\"category tag\">Impl\u00e9mentations<\/a>\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<p class=\"premium-blog-post-content\">Unlock flexible row management in ScheduleJS: control individual row heights, mix GanttLayout and ChartLayout in the same view.<\/p>\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t\t\t<div class=\"premium-blog-post-outer-container\" data-total=\"2\">\n\t\t\t<div class=\"premium-blog-post-container premium-blog-skin-classic\">\n\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumb-effect-wrapper\">\n\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-container premium-blog-zoomin-effect\">\n\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"2880\" height=\"1800\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2021\/05\/curved-link.png\" class=\"attachment-full size-full\" alt=\"JS Gantt charts Screenshot\" \/>\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-overlay\">\n\t\t\t\t\t\t\t\t<a class=\"elementor-icon\" href=\"https:\/\/schedulejs.com\/fr\/drag-and-drop-operations\/\" target=\"_self\"><\/a>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-content-wrapper\">\n\t\t\t\t\t<div class=\"premium-blog-content-wrapper-inner\">\n\t\t\t\t\t\t<div class=\"premium-blog-inner-container\">\n\t\t\t\t\t\t\t<div class=\"premium-blog-entry-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h2 class=\"premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title\">\n\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/drag-and-drop-operations\/\" target=\"_self\">\n\t\t\t\tAdvanced Drag and Drop Operations\t\t\t<\/a>\n\t\t<\/h2>\n\t\t\t\t<div class=\"premium-blog-entry-meta\">\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-time premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-clock-o\"><\/i>\n\t\t\t\t\t<span>d\u00e9cembre 15, 2025<\/span>\n\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-categories premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-align-left fa-fw\"><\/i>\n\t\t\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/category\/features\/\" rel=\"category tag\">Fonctionnalit\u00e9s<\/a>, <a href=\"https:\/\/schedulejs.com\/fr\/category\/implementations\/\" rel=\"category tag\">Impl\u00e9mentations<\/a>\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<p class=\"premium-blog-post-content\">Master drag and drop in ScheduleJS: render activities while dragging, access the drag canvas via DragViewTransversalSystemLayers.<\/p>\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t\t\t<div class=\"premium-blog-post-outer-container\" data-total=\"2\">\n\t\t\t<div class=\"premium-blog-post-container premium-blog-skin-classic\">\n\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumb-effect-wrapper\">\n\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-container premium-blog-zoomin-effect\">\n\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"320\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2022\/11\/logo-schedulejs-padded.jpg\" class=\"attachment-full size-full\" alt=\"ScheduleJS Logo\" \/>\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-overlay\">\n\t\t\t\t\t\t\t\t<a class=\"elementor-icon\" href=\"https:\/\/schedulejs.com\/fr\/schedulejs-1-4-release-note-2\/\" target=\"_self\"><\/a>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-content-wrapper\">\n\t\t\t\t\t<div class=\"premium-blog-content-wrapper-inner\">\n\t\t\t\t\t\t<div class=\"premium-blog-inner-container\">\n\t\t\t\t\t\t\t<div class=\"premium-blog-entry-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h2 class=\"premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title\">\n\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/schedulejs-1-4-release-note-2\/\" target=\"_self\">\n\t\t\t\tScheduleJS 1.4 Release note\t\t\t<\/a>\n\t\t<\/h2>\n\t\t\t\t<div class=\"premium-blog-entry-meta\">\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-time premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-clock-o\"><\/i>\n\t\t\t\t\t<span>novembre 4, 2025<\/span>\n\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-categories premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-align-left fa-fw\"><\/i>\n\t\t\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/category\/features\/\" rel=\"category tag\">Fonctionnalit\u00e9s<\/a>, <a href=\"https:\/\/schedulejs.com\/fr\/category\/implementations\/\" rel=\"category tag\">Impl\u00e9mentations<\/a>\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<p class=\"premium-blog-post-content\">ScheduleJS 1.4 release notes. A step forward towards modern Angular app building.<\/p>\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t\t\t<div class=\"premium-blog-post-outer-container\" data-total=\"2\">\n\t\t\t<div class=\"premium-blog-post-container premium-blog-skin-classic\">\n\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumb-effect-wrapper\">\n\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-container premium-blog-zoomin-effect\">\n\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"860\" height=\"484\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2025\/09\/3910938.webp\" class=\"attachment-full size-full\" alt=\"Angular ScheduleJS logo on a background of code snippets.\" \/>\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-overlay\">\n\t\t\t\t\t\t\t\t<a class=\"elementor-icon\" href=\"https:\/\/schedulejs.com\/fr\/angular18-vs-angular16\/\" target=\"_self\"><\/a>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-content-wrapper\">\n\t\t\t\t\t<div class=\"premium-blog-content-wrapper-inner\">\n\t\t\t\t\t\t<div class=\"premium-blog-inner-container\">\n\t\t\t\t\t\t\t<div class=\"premium-blog-entry-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h2 class=\"premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title\">\n\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/angular18-vs-angular16\/\" target=\"_self\">\n\t\t\t\tAngular 18 VS Angular 16\t\t\t<\/a>\n\t\t<\/h2>\n\t\t\t\t<div class=\"premium-blog-entry-meta\">\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-time premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-clock-o\"><\/i>\n\t\t\t\t\t<span>juillet 25, 2025<\/span>\n\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-categories premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-align-left fa-fw\"><\/i>\n\t\t\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/category\/features\/\" rel=\"category tag\">Fonctionnalit\u00e9s<\/a>, <a href=\"https:\/\/schedulejs.com\/fr\/category\/implementations\/\" rel=\"category tag\">Impl\u00e9mentations<\/a>\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<p class=\"premium-blog-post-content\">Angular 16 vs Angular 18 comparison: discover what's new in Angular, the arrival of signals, Zoneless mode, zone coalescing, and their impact on your projects.<\/p>\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t\t\t<div class=\"premium-blog-post-outer-container\" data-total=\"2\">\n\t\t\t<div class=\"premium-blog-post-container premium-blog-skin-classic\">\n\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumb-effect-wrapper\">\n\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-container premium-blog-zoomin-effect\">\n\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"792\" height=\"446\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2025\/09\/Capture-decran-2025-09-29-160604.png\" class=\"attachment-full size-full\" alt=\"\" \/>\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-overlay\">\n\t\t\t\t\t\t\t\t<a class=\"elementor-icon\" href=\"https:\/\/schedulejs.com\/fr\/angular-rome-conference\/\" target=\"_self\"><\/a>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-content-wrapper\">\n\t\t\t\t\t<div class=\"premium-blog-content-wrapper-inner\">\n\t\t\t\t\t\t<div class=\"premium-blog-inner-container\">\n\t\t\t\t\t\t\t<div class=\"premium-blog-entry-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h2 class=\"premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title\">\n\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/angular-rome-conference\/\" target=\"_self\">\n\t\t\t\tAngular Rome Conference\t\t\t<\/a>\n\t\t<\/h2>\n\t\t\t\t<div class=\"premium-blog-entry-meta\">\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-time premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-clock-o\"><\/i>\n\t\t\t\t\t<span>juin 30, 2025<\/span>\n\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-categories premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-align-left fa-fw\"><\/i>\n\t\t\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/category\/features\/\" rel=\"category tag\">Fonctionnalit\u00e9s<\/a>, <a href=\"https:\/\/schedulejs.com\/fr\/category\/implementations\/\" rel=\"category tag\">Impl\u00e9mentations<\/a>\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<p class=\"premium-blog-post-content\">Discover the Angular Rome Conference: workshops, domain-driven design, signals, state management, micro frontends.<\/p>\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t\t\t<div class=\"premium-blog-post-outer-container\" data-total=\"2\">\n\t\t\t<div class=\"premium-blog-post-container premium-blog-skin-classic\">\n\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumb-effect-wrapper\">\n\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-container premium-blog-zoomin-effect\">\n\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"860\" height=\"482\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2025\/09\/Whats-New-in-Angular-18.webp\" class=\"attachment-full size-full\" alt=\"Discover the latest features and updates in Angular 18 for improved web development.\" \/>\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-overlay\">\n\t\t\t\t\t\t\t\t<a class=\"elementor-icon\" href=\"https:\/\/schedulejs.com\/fr\/whats-new-in-angular-18\/\" target=\"_self\"><\/a>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-content-wrapper\">\n\t\t\t\t\t<div class=\"premium-blog-content-wrapper-inner\">\n\t\t\t\t\t\t<div class=\"premium-blog-inner-container\">\n\t\t\t\t\t\t\t<div class=\"premium-blog-entry-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h2 class=\"premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title\">\n\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/whats-new-in-angular-18\/\" target=\"_self\">\n\t\t\t\tWhat&#8217;s New in Angular 18\t\t\t<\/a>\n\t\t<\/h2>\n\t\t\t\t<div class=\"premium-blog-entry-meta\">\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-time premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-clock-o\"><\/i>\n\t\t\t\t\t<span>mars 29, 2025<\/span>\n\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-categories premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-align-left fa-fw\"><\/i>\n\t\t\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/category\/features\/\" rel=\"category tag\">Fonctionnalit\u00e9s<\/a>, <a href=\"https:\/\/schedulejs.com\/fr\/category\/implementations\/\" rel=\"category tag\">Impl\u00e9mentations<\/a>\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<p class=\"premium-blog-post-content\">Discover Angular 18: zoneless mode, zone coalescing, native await, and TypeScript 5.4 compatibility.<\/p>\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t\t\t<div class=\"premium-blog-post-outer-container\" data-total=\"2\">\n\t\t\t<div class=\"premium-blog-post-container premium-blog-skin-classic\">\n\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumb-effect-wrapper\">\n\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-container premium-blog-zoomin-effect\">\n\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1782\" height=\"1155\" src=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2023\/03\/tr_anonymized_white_bg.png\" class=\"attachment-full size-full\" alt=\"Gantt Charts\" \/>\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-thumbnail-overlay\">\n\t\t\t\t\t\t\t\t<a class=\"elementor-icon\" href=\"https:\/\/schedulejs.com\/fr\/top-3-best-javascript-gantt-chart-components\/\" target=\"_self\"><\/a>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"premium-blog-content-wrapper\">\n\t\t\t\t\t<div class=\"premium-blog-content-wrapper-inner\">\n\t\t\t\t\t\t<div class=\"premium-blog-inner-container\">\n\t\t\t\t\t\t\t<div class=\"premium-blog-entry-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h2 class=\"premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title premium-blog-entry-title\">\n\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/top-3-best-javascript-gantt-chart-components\/\" target=\"_self\">\n\t\t\t\tTop 3 Meilleurs Composants JavaScript pour Diagramme de Gantt\t\t\t<\/a>\n\t\t<\/h2>\n\t\t\t\t<div class=\"premium-blog-entry-meta\">\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-time premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-clock-o\"><\/i>\n\t\t\t\t\t<span>novembre 26, 2024<\/span>\n\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t\t\t<span class=\"premium-blog-meta-separator\">\u2022<\/span>\n\t\t\t\t<div class=\"premium-blog-post-categories premium-blog-meta-data\">\n\t\t\t\t\t<i class=\"fa fa-align-left fa-fw\"><\/i>\n\t\t\t\t\t<a href=\"https:\/\/schedulejs.com\/fr\/category\/features\/\" rel=\"category tag\">Fonctionnalit\u00e9s<\/a>, <a href=\"https:\/\/schedulejs.com\/fr\/category\/implementations\/\" rel=\"category tag\">Impl\u00e9mentations<\/a>\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t\t<\/div>\n\t\t\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t<p class=\"premium-blog-post-content\">Le TOP 3 des diagrammes de Gantt JavaScript. D\u00e9couvrez leurs caract\u00e9ristiques, avantages et inconv\u00e9nients pour choisir le meilleur outil pour votre projet.<\/p>\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t\t\t<\/div>\n\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-b325336 elementor-widget elementor-widget-shortcode\" data-id=\"b325336\" data-element_type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"elementor-shortcode\">    <div class=\"wpdiscuz_top_clearing\"><\/div>\r\n    <div id='comments' class='comments-area'><div id='respond' style='width: 0;height: 0;clear: both;margin: 0;padding: 0;'><\/div>    <div id=\"wpdcom\" class=\"wpdiscuz_unauth wpd-default wpd-layout-1 wpd-comments-open\">\r\n                    <div class=\"wc_social_plugin_wrapper\">\r\n                            <\/div>\r\n            <div class=\"wpd-form-wrap\">\r\n                <div class=\"wpd-form-head\">\r\n                                            <div class=\"wpd-sbs-toggle\">\r\n                            <i class=\"far fa-envelope\"><\/i> <span class=\"wpd-sbs-title\">S\u2019abonner<\/span> <i class=\"fas fa-caret-down\"><\/i>\r\n                        <\/div>\r\n                                            <div class=\"wpd-auth\">\r\n                                                <div class=\"wpd-login\">\r\n                            <a rel=\"nofollow\" href=\"https:\/\/schedulejs.com\/wp-login.php?redirect_to=https%3A%2F%2Fschedulejs.com%2Ffr%2Ftop-3-best-javascript-gantt-chart-components%2F\"><i class='fas fa-sign-in-alt'><\/i> Connexion<\/a>                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n                                                    <div class=\"wpdiscuz-subscribe-bar wpdiscuz-hidden\">\r\n                                                    <form action=\"https:\/\/schedulejs.com\/wp-admin\/admin-ajax.php?action=wpdAddSubscription\" method=\"post\" id=\"wpdiscuz-subscribe-form\">\r\n                                <div class=\"wpdiscuz-subscribe-form-intro\">Notification pour <\/div>\r\n                                <div class=\"wpdiscuz-subscribe-form-option\" style=\"width:40%;\">\r\n                                    <select class=\"wpdiscuz_select\" name=\"wpdiscuzSubscriptionType\" >\r\n                                                                                    <option value=\"post\">nouveaux commentaires de suivi<\/option>\r\n                                                                                                                                <option value=\"all_comment\" >nouvelles r\u00e9ponses \u00e0 mes commentaires<\/option>\r\n                                                                                <\/select>\r\n                                <\/div>\r\n                                                                    <div class=\"wpdiscuz-item wpdiscuz-subscribe-form-email\">\r\n                                        <input  class=\"email\" type=\"email\" name=\"wpdiscuzSubscriptionEmail\" required=\"required\" value=\"\" placeholder=\"E-mail\"\/>\r\n                                    <\/div>\r\n                                                                    <div class=\"wpdiscuz-subscribe-form-button\">\r\n                                    <input id=\"wpdiscuz_subscription_button\" class=\"wpd-prim-button wpd_not_clicked\" type=\"submit\" value=\"\u203a\" name=\"wpdiscuz_subscription_button\" \/>\r\n                                <\/div> \r\n                                <input type=\"hidden\" id=\"wpdiscuz_subscribe_form_nonce\" name=\"wpdiscuz_subscribe_form_nonce\" value=\"e6a21bab66\" \/><input type=\"hidden\" name=\"_wp_http_referer\" value=\"\/fr\/wp-json\/wp\/v2\/posts\/11211\" \/>                            <\/form>\r\n                                                <\/div>\r\n                            <div class=\"wpd-form wpd-form-wrapper wpd-main-form-wrapper\" id='wpd-main-form-wrapper-0_0'>\r\n                                        <form class=\"wpd_comm_form wpd_main_comm_form\"\r\n                      method=\"post\" enctype=\"multipart\/form-data\" data-uploading=\"false\" action=\"\">\r\n                    <div class=\"wpd-field-comment\">\r\n                        <div class=\"wpdiscuz-item wc-field-textarea\">\r\n                            <div class=\"wpdiscuz-textarea-wrap\">\r\n                                                                                                        <div class=\"wpd-avatar\">\r\n                                        <img alt='guest' src='https:\/\/secure.gravatar.com\/avatar\/?s=56&#038;d=mm&#038;r=g' srcset='https:\/\/secure.gravatar.com\/avatar\/?s=112&#038;d=mm&#038;r=g 2x' class='avatar avatar-56 photo avatar-default' height='56' width='56' \/>                                    <\/div>\r\n                                                <div id=\"wpd-editor-wraper-0_0\" style=\"display: none;\">\r\n                <div id=\"wpd-editor-char-counter-0_0\"\r\n                     class=\"wpd-editor-char-counter\"><\/div>\r\n                <label style=\"display: none;\" for=\"wc-textarea-0_0\">Label<\/label>\r\n                <textarea id=\"wc-textarea-0_0\" name=\"wc_comment\"\r\n                          class=\"wc_comment wpd-field\"><\/textarea>\r\n                <div id=\"wpd-editor-0_0\"><\/div>\r\n                        <div id=\"wpd-editor-toolbar-0_0\">\r\n                            <button title=\"En gras\"\r\n                        class=\"ql-bold\"  ><\/button>\r\n                                <button title=\"Italique\"\r\n                        class=\"ql-italic\"  ><\/button>\r\n                                <button title=\"Soulign\u00e9\"\r\n                        class=\"ql-underline\"  ><\/button>\r\n                                <button title=\"Barr\u00e9\"\r\n                        class=\"ql-strike\"  ><\/button>\r\n                                <button title=\"Liste ordonn\u00e9e\"\r\n                        class=\"ql-list\" value='ordered' ><\/button>\r\n                                <button title=\"Liste non ordonn\u00e9e\"\r\n                        class=\"ql-list\" value='bullet' ><\/button>\r\n                                <button title=\"Bloc de citation\"\r\n                        class=\"ql-blockquote\"  ><\/button>\r\n                                <button title=\"Bloc de code\"\r\n                        class=\"ql-code-block\"  ><\/button>\r\n                                <button title=\"Lien\"\r\n                        class=\"ql-link\"  ><\/button>\r\n                                <button title=\"Code source\"\r\n                        class=\"ql-sourcecode\"  data-wpde_button_name='sourcecode'>{}<\/button>\r\n                                <button title=\"Spoiler\"\r\n                        class=\"ql-spoiler\"  data-wpde_button_name='spoiler'>[+]<\/button>\r\n                            <div class=\"wpd-editor-buttons-right\">\r\n                <span class='wmu-upload-wrap' wpd-tooltip='Attacher une image \u00e0 ce commentaire' wpd-tooltip-position='left'><label class='wmu-add'><i class='far fa-image'><\/i><input style='display:none;' class='wmu-add-files' type='file' name='wmu_files[]'  accept='image\/*'\/><\/label><\/span>            <\/div>\r\n        <\/div>\r\n                    <\/div>\r\n                                        <\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n                    <div class=\"wpd-form-foot\" style='display:none;'>\r\n                        <div class=\"wpdiscuz-textarea-foot\">\r\n                                                        <div class=\"wpdiscuz-button-actions\"><div class='wmu-action-wrap'><div class='wmu-tabs wmu-images-tab wmu-hide'><\/div><\/div><\/div>\r\n                        <\/div>\r\n                                <div class=\"wpd-form-row\">\r\n                    <div class=\"wpd-form-col-left\">\r\n                        <div class=\"wpdiscuz-item wc_name-wrapper wpd-has-icon\">\r\n                                    <div class=\"wpd-field-icon\"><i class=\"fas fa-user\"><\/i><\/div>\r\n                                    <input id=\"wc_name-0_0\" value=\"\" required='required' aria-required='true' class=\"wc_name wpd-field\" type=\"text\" name=\"wc_name\" placeholder=\"Nom*\" maxlength=\"50\" pattern='.{3,50}' title=\"\">\r\n                <label for=\"wc_name-0_0\" class=\"wpdlb\">Nom*<\/label>\r\n                            <\/div>\r\n                        <div class=\"wpdiscuz-item wc_email-wrapper wpd-has-icon\">\r\n                                    <div class=\"wpd-field-icon\"><i class=\"fas fa-at\"><\/i><\/div>\r\n                                    <input id=\"wc_email-0_0\" value=\"\" required='required' aria-required='true' class=\"wc_email wpd-field\" type=\"email\" name=\"wc_email\" placeholder=\"E-mail*\" \/>\r\n                <label for=\"wc_email-0_0\" class=\"wpdlb\">E-mail*<\/label>\r\n                            <\/div>\r\n                            <div class=\"wpdiscuz-item wc_website-wrapper wpd-has-icon\">\r\n                                            <div class=\"wpd-field-icon\"><i class=\"fas fa-link\"><\/i><\/div>\r\n                                        <input id=\"wc_website-0_0\" value=\"\" class=\"wc_website wpd-field\" type=\"text\" name=\"wc_website\" placeholder=\"Site web\" \/>\r\n                    <label for=\"wc_website-0_0\" class=\"wpdlb\">Site web<\/label>\r\n                                    <\/div>\r\n                        <\/div>\r\n                <div class=\"wpd-form-col-right\">\r\n                    <div class=\"wc-field-submit\">\r\n                                            \r\n                                            <label class=\"wpd_label\" wpd-tooltip=\"Notifier des nouvelles r\u00e9ponses \u00e0 tous mes commentaires\">\r\n                            <input id=\"wc_notification_new_comment-0_0\" class=\"wc_notification_new_comment-0_0 wpd_label__checkbox\" value=\"comment\" type=\"checkbox\" name=\"wpdiscuz_notification_type\" \/>\r\n                            <span class=\"wpd_label__text\">\r\n                                <span class=\"wpd_label__check\">\r\n                                    <i class=\"fas fa-bell wpdicon wpdicon-on\"><\/i>\r\n                                    <i class=\"fas fa-bell-slash wpdicon wpdicon-off\"><\/i>\r\n                                <\/span>\r\n                            <\/span>\r\n                        <\/label>\r\n                                                                <input id=\"wpd-field-submit-0_0\" class=\"wc_comm_submit wpd_not_clicked wpd-prim-button\" type=\"submit\" name=\"submit\" value=\"Publier le commentaire\" \/>\r\n        <\/div>\r\n                <\/div>\r\n                    <div class=\"clearfix\"><\/div>\r\n        <\/div>\r\n                            <\/div>\r\n                                        <input type=\"hidden\" class=\"wpdiscuz_unique_id\" value=\"0_0\"\r\n                           name=\"wpdiscuz_unique_id\">\r\n                                    <input type=\"hidden\" name=\"trp-form-language\" value=\"fr\"\/><\/form>\r\n                        <\/div>\r\n                <div id=\"wpdiscuz_hidden_secondary_form\" style=\"display: none;\">\r\n                    <div class=\"wpd-form wpd-form-wrapper wpd-secondary-form-wrapper\" id='wpd-secondary-form-wrapper-wpdiscuzuniqueid' style='display: none;'>\r\n                            <div class=\"wpd-secondary-forms-social-content\"><\/div>\r\n                <div class=\"clearfix\"><\/div>\r\n                                        <form class=\"wpd_comm_form wpd-secondary-form-wrapper\"\r\n                      method=\"post\" enctype=\"multipart\/form-data\" data-uploading=\"false\" action=\"\">\r\n                    <div class=\"wpd-field-comment\">\r\n                        <div class=\"wpdiscuz-item wc-field-textarea\">\r\n                            <div class=\"wpdiscuz-textarea-wrap\">\r\n                                                                                                        <div class=\"wpd-avatar\">\r\n                                        <img alt='guest' src='https:\/\/secure.gravatar.com\/avatar\/?s=56&#038;d=mm&#038;r=g' srcset='https:\/\/secure.gravatar.com\/avatar\/?s=112&#038;d=mm&#038;r=g 2x' class='avatar avatar-56 photo avatar-default' height='56' width='56' \/>                                    <\/div>\r\n                                                <div id=\"wpd-editor-wraper-wpdiscuzuniqueid\" style=\"display: none;\">\r\n                <div id=\"wpd-editor-char-counter-wpdiscuzuniqueid\"\r\n                     class=\"wpd-editor-char-counter\"><\/div>\r\n                <label style=\"display: none;\" for=\"wc-textarea-wpdiscuzuniqueid\">Label<\/label>\r\n                <textarea id=\"wc-textarea-wpdiscuzuniqueid\" name=\"wc_comment\"\r\n                          class=\"wc_comment wpd-field\"><\/textarea>\r\n                <div id=\"wpd-editor-wpdiscuzuniqueid\"><\/div>\r\n                        <div id=\"wpd-editor-toolbar-wpdiscuzuniqueid\">\r\n                            <button title=\"En gras\"\r\n                        class=\"ql-bold\"  ><\/button>\r\n                                <button title=\"Italique\"\r\n                        class=\"ql-italic\"  ><\/button>\r\n                                <button title=\"Soulign\u00e9\"\r\n                        class=\"ql-underline\"  ><\/button>\r\n                                <button title=\"Barr\u00e9\"\r\n                        class=\"ql-strike\"  ><\/button>\r\n                                <button title=\"Liste ordonn\u00e9e\"\r\n                        class=\"ql-list\" value='ordered' ><\/button>\r\n                                <button title=\"Liste non ordonn\u00e9e\"\r\n                        class=\"ql-list\" value='bullet' ><\/button>\r\n                                <button title=\"Bloc de citation\"\r\n                        class=\"ql-blockquote\"  ><\/button>\r\n                                <button title=\"Bloc de code\"\r\n                        class=\"ql-code-block\"  ><\/button>\r\n                                <button title=\"Lien\"\r\n                        class=\"ql-link\"  ><\/button>\r\n                                <button title=\"Code source\"\r\n                        class=\"ql-sourcecode\"  data-wpde_button_name='sourcecode'>{}<\/button>\r\n                                <button title=\"Spoiler\"\r\n                        class=\"ql-spoiler\"  data-wpde_button_name='spoiler'>[+]<\/button>\r\n                            <div class=\"wpd-editor-buttons-right\">\r\n                <span class='wmu-upload-wrap' wpd-tooltip='Attacher une image \u00e0 ce commentaire' wpd-tooltip-position='left'><label class='wmu-add'><i class='far fa-image'><\/i><input style='display:none;' class='wmu-add-files' type='file' name='wmu_files[]'  accept='image\/*'\/><\/label><\/span>            <\/div>\r\n        <\/div>\r\n                    <\/div>\r\n                                        <\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n                    <div class=\"wpd-form-foot\" style='display:none;'>\r\n                        <div class=\"wpdiscuz-textarea-foot\">\r\n                                                        <div class=\"wpdiscuz-button-actions\"><div class='wmu-action-wrap'><div class='wmu-tabs wmu-images-tab wmu-hide'><\/div><\/div><\/div>\r\n                        <\/div>\r\n                                <div class=\"wpd-form-row\">\r\n                    <div class=\"wpd-form-col-left\">\r\n                        <div class=\"wpdiscuz-item wc_name-wrapper wpd-has-icon\">\r\n                                    <div class=\"wpd-field-icon\"><i class=\"fas fa-user\"><\/i><\/div>\r\n                                    <input id=\"wc_name-wpdiscuzuniqueid\" value=\"\" required='required' aria-required='true' class=\"wc_name wpd-field\" type=\"text\" name=\"wc_name\" placeholder=\"Nom*\" maxlength=\"50\" pattern='.{3,50}' title=\"\">\r\n                <label for=\"wc_name-wpdiscuzuniqueid\" class=\"wpdlb\">Nom*<\/label>\r\n                            <\/div>\r\n                        <div class=\"wpdiscuz-item wc_email-wrapper wpd-has-icon\">\r\n                                    <div class=\"wpd-field-icon\"><i class=\"fas fa-at\"><\/i><\/div>\r\n                                    <input id=\"wc_email-wpdiscuzuniqueid\" value=\"\" required='required' aria-required='true' class=\"wc_email wpd-field\" type=\"email\" name=\"wc_email\" placeholder=\"E-mail*\" \/>\r\n                <label for=\"wc_email-wpdiscuzuniqueid\" class=\"wpdlb\">E-mail*<\/label>\r\n                            <\/div>\r\n                            <div class=\"wpdiscuz-item wc_website-wrapper wpd-has-icon\">\r\n                                            <div class=\"wpd-field-icon\"><i class=\"fas fa-link\"><\/i><\/div>\r\n                                        <input id=\"wc_website-wpdiscuzuniqueid\" value=\"\" class=\"wc_website wpd-field\" type=\"text\" name=\"wc_website\" placeholder=\"Site web\" \/>\r\n                    <label for=\"wc_website-wpdiscuzuniqueid\" class=\"wpdlb\">Site web<\/label>\r\n                                    <\/div>\r\n                        <\/div>\r\n                <div class=\"wpd-form-col-right\">\r\n                    <div class=\"wc-field-submit\">\r\n                                            \r\n                                            <label class=\"wpd_label\" wpd-tooltip=\"Notifier des nouvelles r\u00e9ponses \u00e0 tous mes commentaires\">\r\n                            <input id=\"wc_notification_new_comment-wpdiscuzuniqueid\" class=\"wc_notification_new_comment-wpdiscuzuniqueid wpd_label__checkbox\" value=\"comment\" type=\"checkbox\" name=\"wpdiscuz_notification_type\" \/>\r\n                            <span class=\"wpd_label__text\">\r\n                                <span class=\"wpd_label__check\">\r\n                                    <i class=\"fas fa-bell wpdicon wpdicon-on\"><\/i>\r\n                                    <i class=\"fas fa-bell-slash wpdicon wpdicon-off\"><\/i>\r\n                                <\/span>\r\n                            <\/span>\r\n                        <\/label>\r\n                                                                <input id=\"wpd-field-submit-wpdiscuzuniqueid\" class=\"wc_comm_submit wpd_not_clicked wpd-prim-button\" type=\"submit\" name=\"submit\" value=\"Publier le commentaire\" \/>\r\n        <\/div>\r\n                <\/div>\r\n                    <div class=\"clearfix\"><\/div>\r\n        <\/div>\r\n                            <\/div>\r\n                                        <input type=\"hidden\" class=\"wpdiscuz_unique_id\" value=\"wpdiscuzuniqueid\"\r\n                           name=\"wpdiscuz_unique_id\">\r\n                                    <input type=\"hidden\" name=\"trp-form-language\" value=\"fr\"\/><\/form>\r\n                        <\/div>\r\n                <\/div>\r\n                    <\/div>\r\n                        <div id=\"wpd-threads\" class=\"wpd-thread-wrapper\">\r\n                <div class=\"wpd-thread-head\">\r\n                    <div class=\"wpd-thread-info\" data-comments-count=\"1\">\r\n                        <span class='wpdtc' title='1'>1<\/span> Commentaire                    <\/div>\r\n                                        <div class=\"wpd-space\"><\/div>\r\n                    <div class=\"wpd-thread-filter\">\r\n                                                    <div class=\"wpd-filter wpdf-reacted wpd_not_clicked\" wpd-tooltip=\"Commentaire avec le plus de r\u00e9actions\"><i class=\"fas fa-bolt\"><\/i><\/div>\r\n                                                        <div class=\"wpd-filter wpdf-hottest wpd_not_clicked\" wpd-tooltip=\"Fil de commentaire le plus chaud\"><i class=\"fas fa-fire\"><\/i><\/div>\r\n                                                        <div class=\"wpd-filter wpdf-sorting\">\r\n                                                                        <span class=\"wpdiscuz-sort-button wpdiscuz-date-sort-asc wpdiscuz-sort-button-active\" data-sorting=\"oldest\">Le plus ancien<\/span>\r\n                                                                        <i class=\"fas fa-sort-down\"><\/i>\r\n                                <div class=\"wpdiscuz-sort-buttons\">\r\n                                                                            <span class=\"wpdiscuz-sort-button wpdiscuz-date-sort-desc\" data-sorting=\"newest\">Le plus r\u00e9cent<\/span>\r\n                                                                                <span class=\"wpdiscuz-sort-button wpdiscuz-vote-sort-up\" data-sorting=\"by_vote\">Le plus populaire<\/span>\r\n                                                                        <\/div>\r\n                            <\/div>\r\n                                                <\/div>\r\n                <\/div>\r\n                <div class=\"wpd-comment-info-bar\">\r\n                    <div class=\"wpd-current-view\"><i class=\"fas fa-quote-left\"><\/i> Commentaires<\/div>\r\n                    <div class=\"wpd-filter-view-all\">Show all comments<\/div>\r\n                <\/div>\r\n                                <div class=\"wpd-thread-list\">\r\n                    <div id='wpd-comm-73_0' class='comment even thread-even depth-1 wpd-comment wpd_comment_level-1'><div class=\"wpd-comment-wrap wpd-blog-guest\">\r\n    <div class=\"wpd-comment-left\">\r\n    <div class=\"wpd-avatar\">\r\n    <img alt='lenormor' src='https:\/\/secure.gravatar.com\/avatar\/cc853959ecaa102f1edfb92e53cb80ddb39f99aad04bf727c1804947d0b89f38?s=64&#038;d=mm&#038;r=g' srcset='https:\/\/secure.gravatar.com\/avatar\/cc853959ecaa102f1edfb92e53cb80ddb39f99aad04bf727c1804947d0b89f38?s=128&#038;d=mm&#038;r=g 2x' class='avatar avatar-64 photo' height='64' width='64' \/>\r\n<\/div>\r\n    \r\n    \r\n<\/div>\r\n    <div id=\"comment-73\" class=\"wpd-comment-right\">\r\n    <div class=\"wpd-comment-header\">\r\n    <div class=\"wpd-comment-author\">\r\n    lenormor\r\n<\/div>\r\n    <div class=\"wpd-comment-date\" title=\"novembre 26, 2024 10:55 am\">\r\n    <i class='far fa-clock' aria-hidden='true'><\/i>\r\n    1 an \r\n<\/div>\r\n    \r\n    <div class=\"wpd-comment-share wpd-hidden wpd-tooltip wpd-top\">\r\n    <i class='fas fa-share-alt' aria-hidden='true'><\/i>\r\n    <div class=\"wpd-tooltip-content\">\r\n        <a class='wc_tw' rel='noreferrer' target='_blank' href='https:\/\/twitter.com\/intent\/tweet?text=Very good article, thanks for sharing.&url=https%3A%2F%2Fschedulejs.com%2Ffr%2Ftop-3-best-javascript-gantt-chart-components%2F%23comment-73' title='Share on Twitter'><i class='fab fa-twitter wpf-cta' aria-hidden='true'><\/i><\/a><a class='wc_vk' rel='noreferrer' target='_blank' href='https:\/\/vk.com\/share.php?url=https:\/\/schedulejs.com\/fr\/top-3-best-javascript-gantt-chart-components\/' title='Share on VKontakte'><i class='fab fa-vk wpf-cta' aria-hidden='true'><\/i><\/a><a class='wc_ok' rel='noreferrer' target='_blank' href='https:\/\/connect.ok.ru\/offer?url=https:\/\/schedulejs.com\/fr\/top-3-best-javascript-gantt-chart-components\/' title='Share on Odnoklassniki'><i class='fab fa-odnoklassniki wpf-cta' aria-hidden='true'><\/i><\/a>\r\n    <\/div>\r\n<\/div>\r\n    <div class=\"wpd-space\"><\/div>\r\n    <div class=\"wpd-comment-link wpd-hidden\">\r\n    <span wpd-tooltip='Comment link' wpd-tooltip-position='left'><i class='fas fa-link' aria-hidden='true' data-wpd-clipboard='https:\/\/schedulejs.com\/fr\/top-3-best-javascript-gantt-chart-components\/#comment-73'><\/i><\/span>\r\n<\/div>\r\n<\/div>\r\n    \r\n    <div class=\"wpd-comment-text\">\r\n    <p>Very good article, thanks for sharing.<\/p>\n\r\n<\/div>\r\n    <div class=\"wpd-comment-footer\">\r\n    <div class=\"wpd-vote\">\r\n    <div class=\"wpd-vote-up wpd_not_clicked\">\r\n        <svg aria-hidden='true' focusable='false' data-prefix='fas' data-icon='plus' class='svg-inline--fa fa-plus fa-w-14' role='img' xmlns='https:\/\/www.w3.org\/2000\/svg' viewbox='0 0 448 512'><path d='M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z'><\/path><\/svg>\r\n    <\/div>\r\n    <div class='wpd-vote-result' title='0'>0<\/div>\r\n    <div class=\"wpd-vote-down wpd_not_clicked\">\r\n        <svg aria-hidden='true' focusable='false' data-prefix='fas' data-icon='minus' class='svg-inline--fa fa-minus fa-w-14' role='img' xmlns='https:\/\/www.w3.org\/2000\/svg' viewbox='0 0 448 512'><path d='M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z'><\/path><\/svg>\r\n    <\/div>\r\n<\/div>\r\n    <div class=\"wpd-reply-button\">\r\n    <svg xmlns='https:\/\/www.w3.org\/2000\/svg' viewbox='0 0 24 24'><path d='M10 9V5l-7 7 7 7v-4.1c5 0 8.5 1.6 11 5.1-1-5-4-10-11-11z'\/><path d='M0 0h24v24H0z' fill='none'\/><\/svg>\r\n    <span>Answer<\/span>\r\n<\/div>\r\n    <div class=\"wpd-space\"><\/div>\r\n    \r\n    \r\n<\/div>\r\n<\/div>\r\n<\/div><div id='wpdiscuz_form_anchor-73_0'><\/div><\/div><!-- \/\/ From wpDiscuz's Caches \/\/ -->                    <div class=\"wpdiscuz-comment-pagination\">\r\n                                            <\/div>\r\n                <\/div>\r\n            <\/div>\r\n                <\/div>\r\n        <\/div>\r\n    <div id=\"wpdiscuz-loading-bar\" class=\"wpdiscuz-loading-bar-unauth\"><\/div>\r\n    <div id=\"wpdiscuz-comment-message\" class=\"wpdiscuz-comment-message-unauth\"><\/div>\r\n    <\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Comment construire un menu contextuel interactif ? Une plong\u00e9e en profondeur dans la gestion des \u00e9v\u00e9nements ScheduleJS et les pratiques recommand\u00e9es pour construire votre propre menu contextuel.<\/p>","protected":false},"author":1,"featured_media":11212,"comment_status":"open","ping_status":"open","sticky":false,"template":"elementor_header_footer","format":"standard","meta":{"footnotes":""},"categories":[57],"tags":[],"class_list":["post-11211","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-implementations","blog-post blog-spacing"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.9 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Contextual Menu<\/title>\n<meta name=\"description\" content=\"How to build an interactive contextual menu? A deep dive into ScheduleJS event handling and recommended practice.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/schedulejs.com\/fr\/contextual-menu\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Contextual Menu\" \/>\n<meta property=\"og:description\" content=\"How to build an interactive contextual menu? A deep dive into ScheduleJS event handling and recommended practice.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/schedulejs.com\/fr\/contextual-menu\/\" \/>\n<meta property=\"article:published_time\" content=\"2023-06-27T08:56:31+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-07-02T07:25:12+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/schedulejs.com\/wp-content\/uploads\/2023\/06\/context-menu.png\" \/>\n\t<meta property=\"og:image:width\" content=\"2880\" \/>\n\t<meta property=\"og:image:height\" content=\"1800\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"wordpress\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@ScheduleJS\" \/>\n<meta name=\"twitter:site\" content=\"@ScheduleJS\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"wordpress\" \/>\n\t<meta name=\"twitter:label2\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data2\" content=\"7 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/schedulejs.com\\\/contextual-menu\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/schedulejs.com\\\/contextual-menu\\\/\"},\"author\":{\"name\":\"wordpress\",\"@id\":\"https:\\\/\\\/schedulejs.com\\\/#\\\/schema\\\/person\\\/dcf1d1444881cf1c59df51e7f2c07dbd\"},\"headline\":\"Contextual menu\",\"datePublished\":\"2023-06-27T08:56:31+00:00\",\"dateModified\":\"2024-07-02T07:25:12+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/schedulejs.com\\\/contextual-menu\\\/\"},\"wordCount\":988,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/schedulejs.com\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/schedulejs.com\\\/contextual-menu\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/schedulejs.com\\\/wp-content\\\/uploads\\\/2023\\\/06\\\/context-menu.png\",\"articleSection\":[\"Implementations\"],\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/schedulejs.com\\\/contextual-menu\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/schedulejs.com\\\/contextual-menu\\\/\",\"url\":\"https:\\\/\\\/schedulejs.com\\\/contextual-menu\\\/\",\"name\":\"Contextual Menu\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/schedulejs.com\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/schedulejs.com\\\/contextual-menu\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/schedulejs.com\\\/contextual-menu\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/schedulejs.com\\\/wp-content\\\/uploads\\\/2023\\\/06\\\/context-menu.png\",\"datePublished\":\"2023-06-27T08:56:31+00:00\",\"dateModified\":\"2024-07-02T07:25:12+00:00\",\"description\":\"How to build an interactive contextual menu? A deep dive into ScheduleJS event handling and recommended practice.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/schedulejs.com\\\/contextual-menu\\\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/schedulejs.com\\\/contextual-menu\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\\\/\\\/schedulejs.com\\\/contextual-menu\\\/#primaryimage\",\"url\":\"https:\\\/\\\/schedulejs.com\\\/wp-content\\\/uploads\\\/2023\\\/06\\\/context-menu.png\",\"contentUrl\":\"https:\\\/\\\/schedulejs.com\\\/wp-content\\\/uploads\\\/2023\\\/06\\\/context-menu.png\",\"width\":2880,\"height\":1800,\"caption\":\"JS Gantt Screenshot\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/schedulejs.com\\\/contextual-menu\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Accueil\",\"item\":\"https:\\\/\\\/schedulejs.com\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Contextual menu\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/schedulejs.com\\\/#website\",\"url\":\"https:\\\/\\\/schedulejs.com\\\/\",\"name\":\"ScheduleJS - Applicative Gantt charts\",\"description\":\"Create advanced Gantt charts using web technologies\",\"publisher\":{\"@id\":\"https:\\\/\\\/schedulejs.com\\\/#organization\"},\"alternateName\":\"ScheduleJS\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/schedulejs.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/schedulejs.com\\\/#organization\",\"name\":\"ScheduleJS\",\"url\":\"https:\\\/\\\/schedulejs.com\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\\\/\\\/schedulejs.com\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/schedulejs.com\\\/wp-content\\\/uploads\\\/2021\\\/05\\\/logo_schedulejs_blue_1500x500.png\",\"contentUrl\":\"https:\\\/\\\/schedulejs.com\\\/wp-content\\\/uploads\\\/2021\\\/05\\\/logo_schedulejs_blue_1500x500.png\",\"width\":1500,\"height\":500,\"caption\":\"ScheduleJS\"},\"image\":{\"@id\":\"https:\\\/\\\/schedulejs.com\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/x.com\\\/ScheduleJS\",\"https:\\\/\\\/www.linkedin.com\\\/showcase\\\/schedulejs\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/schedulejs.com\\\/#\\\/schema\\\/person\\\/dcf1d1444881cf1c59df51e7f2c07dbd\",\"name\":\"wordpress\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/6a75ce3fbea1f5d75b3421485bbb1d13c75ccd55580543fd67bcca73f43984b4?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/6a75ce3fbea1f5d75b3421485bbb1d13c75ccd55580543fd67bcca73f43984b4?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/6a75ce3fbea1f5d75b3421485bbb1d13c75ccd55580543fd67bcca73f43984b4?s=96&d=mm&r=g\",\"caption\":\"wordpress\"},\"sameAs\":[\"https:\\\/\\\/schedulejs.com\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Contextual Menu","description":"How to build an interactive contextual menu? A deep dive into ScheduleJS event handling and recommended practice.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/schedulejs.com\/fr\/contextual-menu\/","og_locale":"fr_FR","og_type":"article","og_title":"Contextual Menu","og_description":"How to build an interactive contextual menu? A deep dive into ScheduleJS event handling and recommended practice.","og_url":"https:\/\/schedulejs.com\/fr\/contextual-menu\/","article_published_time":"2023-06-27T08:56:31+00:00","article_modified_time":"2024-07-02T07:25:12+00:00","og_image":[{"width":2880,"height":1800,"url":"https:\/\/schedulejs.com\/wp-content\/uploads\/2023\/06\/context-menu.png","type":"image\/png"}],"author":"wordpress","twitter_card":"summary_large_image","twitter_creator":"@ScheduleJS","twitter_site":"@ScheduleJS","twitter_misc":{"\u00c9crit par":"wordpress","Dur\u00e9e de lecture estim\u00e9e":"7 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/schedulejs.com\/contextual-menu\/#article","isPartOf":{"@id":"https:\/\/schedulejs.com\/contextual-menu\/"},"author":{"name":"wordpress","@id":"https:\/\/schedulejs.com\/#\/schema\/person\/dcf1d1444881cf1c59df51e7f2c07dbd"},"headline":"Contextual menu","datePublished":"2023-06-27T08:56:31+00:00","dateModified":"2024-07-02T07:25:12+00:00","mainEntityOfPage":{"@id":"https:\/\/schedulejs.com\/contextual-menu\/"},"wordCount":988,"commentCount":0,"publisher":{"@id":"https:\/\/schedulejs.com\/#organization"},"image":{"@id":"https:\/\/schedulejs.com\/contextual-menu\/#primaryimage"},"thumbnailUrl":"https:\/\/schedulejs.com\/wp-content\/uploads\/2023\/06\/context-menu.png","articleSection":["Implementations"],"inLanguage":"fr-FR","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/schedulejs.com\/contextual-menu\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/schedulejs.com\/contextual-menu\/","url":"https:\/\/schedulejs.com\/contextual-menu\/","name":"Contextual Menu","isPartOf":{"@id":"https:\/\/schedulejs.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/schedulejs.com\/contextual-menu\/#primaryimage"},"image":{"@id":"https:\/\/schedulejs.com\/contextual-menu\/#primaryimage"},"thumbnailUrl":"https:\/\/schedulejs.com\/wp-content\/uploads\/2023\/06\/context-menu.png","datePublished":"2023-06-27T08:56:31+00:00","dateModified":"2024-07-02T07:25:12+00:00","description":"How to build an interactive contextual menu? A deep dive into ScheduleJS event handling and recommended practice.","breadcrumb":{"@id":"https:\/\/schedulejs.com\/contextual-menu\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/schedulejs.com\/contextual-menu\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/schedulejs.com\/contextual-menu\/#primaryimage","url":"https:\/\/schedulejs.com\/wp-content\/uploads\/2023\/06\/context-menu.png","contentUrl":"https:\/\/schedulejs.com\/wp-content\/uploads\/2023\/06\/context-menu.png","width":2880,"height":1800,"caption":"JS Gantt Screenshot"},{"@type":"BreadcrumbList","@id":"https:\/\/schedulejs.com\/contextual-menu\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Accueil","item":"https:\/\/schedulejs.com\/"},{"@type":"ListItem","position":2,"name":"Contextual menu"}]},{"@type":"WebSite","@id":"https:\/\/schedulejs.com\/#website","url":"https:\/\/schedulejs.com\/","name":"ScheduleJS - Applicative Gantt charts","description":"Create advanced Gantt charts using web technologies","publisher":{"@id":"https:\/\/schedulejs.com\/#organization"},"alternateName":"ScheduleJS","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/schedulejs.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"},{"@type":"Organization","@id":"https:\/\/schedulejs.com\/#organization","name":"ScheduleJS","url":"https:\/\/schedulejs.com\/","logo":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/schedulejs.com\/#\/schema\/logo\/image\/","url":"https:\/\/schedulejs.com\/wp-content\/uploads\/2021\/05\/logo_schedulejs_blue_1500x500.png","contentUrl":"https:\/\/schedulejs.com\/wp-content\/uploads\/2021\/05\/logo_schedulejs_blue_1500x500.png","width":1500,"height":500,"caption":"ScheduleJS"},"image":{"@id":"https:\/\/schedulejs.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/x.com\/ScheduleJS","https:\/\/www.linkedin.com\/showcase\/schedulejs\/"]},{"@type":"Person","@id":"https:\/\/schedulejs.com\/#\/schema\/person\/dcf1d1444881cf1c59df51e7f2c07dbd","name":"wordpress","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/secure.gravatar.com\/avatar\/6a75ce3fbea1f5d75b3421485bbb1d13c75ccd55580543fd67bcca73f43984b4?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/6a75ce3fbea1f5d75b3421485bbb1d13c75ccd55580543fd67bcca73f43984b4?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/6a75ce3fbea1f5d75b3421485bbb1d13c75ccd55580543fd67bcca73f43984b4?s=96&d=mm&r=g","caption":"wordpress"},"sameAs":["https:\/\/schedulejs.com"]}]}},"_links":{"self":[{"href":"https:\/\/schedulejs.com\/fr\/wp-json\/wp\/v2\/posts\/11211","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/schedulejs.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/schedulejs.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/schedulejs.com\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/schedulejs.com\/fr\/wp-json\/wp\/v2\/comments?post=11211"}],"version-history":[{"count":0,"href":"https:\/\/schedulejs.com\/fr\/wp-json\/wp\/v2\/posts\/11211\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/schedulejs.com\/fr\/wp-json\/wp\/v2\/media\/11212"}],"wp:attachment":[{"href":"https:\/\/schedulejs.com\/fr\/wp-json\/wp\/v2\/media?parent=11211"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/schedulejs.com\/fr\/wp-json\/wp\/v2\/categories?post=11211"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/schedulejs.com\/fr\/wp-json\/wp\/v2\/tags?post=11211"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}