{"id":569,"date":"2021-06-29T20:50:10","date_gmt":"2021-06-29T20:50:10","guid":{"rendered":"https:\/\/alexcgdesign.com\/blog\/?p=569"},"modified":"2021-06-29T20:51:56","modified_gmt":"2021-06-29T20:51:56","slug":"crea-un-menu-despegale-con-html-css-y-js","status":"publish","type":"post","link":"https:\/\/alexcgdesign.com\/blog\/crea-un-menu-despegale-con-html-css-y-js\/","title":{"rendered":"Crea un men\u00fa despegale con HTML CSS y JS"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"569\" class=\"elementor elementor-569\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-f8aedbe elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"f8aedbe\" data-element_type=\"section\" data-e-type=\"section\">\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-6bffbf7\" data-id=\"6bffbf7\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-2dae757 elementor-widget elementor-widget-text-editor\" data-id=\"2dae757\" data-element_type=\"widget\" data-e-type=\"widget\" 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\t<p>Hola, \u00bfC\u00f3mo est\u00e1s?, el d\u00eda de hoy crearemos un men\u00fa animado, s\u00f3lamente con HTML CSS y Javascript. Sin utilizar ning\u00fan plugin o librer\u00eda. \u00bfTe animas a hacerlo?. \u00a1Excelente vamos alla!<\/p><p>\u00a0<\/p><p><span style=\"color: #54595f; font-family: Raleway, sans-serif; font-size: 20px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400;\">S\u00f3lo dejame preguntarte algo antes de empezar \u00bfYa viste el tutorial donde creamos el men\u00fa animado desde cero? Si la respuesta ha sido no, \u00bfQu\u00e9 esperas para verlo?\u00a0<\/span><img decoding=\"async\" class=\"emoji\" style=\"font-variant-ligatures: normal; font-variant-caps: normal; font-family: Raleway, sans-serif; font-size: 20px; font-style: normal; font-weight: 400; background-color: #ffffff; color: #54595f; background-image: none !important;\" role=\"img\" draggable=\"false\" src=\"https:\/\/s.w.org\/images\/core\/emoji\/13.0.1\/svg\/1f447.svg\" alt=\"\ud83d\udc47\" \/><img decoding=\"async\" class=\"emoji\" style=\"font-variant-ligatures: normal; font-variant-caps: normal; font-family: Raleway, sans-serif; font-size: 20px; font-style: normal; font-weight: 400; background-color: #ffffff; color: #54595f; background-image: none !important;\" role=\"img\" draggable=\"false\" src=\"https:\/\/s.w.org\/images\/core\/emoji\/13.0.1\/svg\/1f447.svg\" alt=\"\ud83d\udc47\" \/><img decoding=\"async\" class=\"emoji\" style=\"font-variant-ligatures: normal; font-variant-caps: normal; font-family: Raleway, sans-serif; font-size: 20px; font-style: normal; font-weight: 400; background-color: #ffffff; color: #54595f; background-image: none !important;\" role=\"img\" draggable=\"false\" src=\"https:\/\/s.w.org\/images\/core\/emoji\/13.0.1\/svg\/1f447.svg\" alt=\"\ud83d\udc47\" \/><\/p><p>\u00a0<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-17fbd8f elementor-widget elementor-widget-video\" data-id=\"17fbd8f\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;youtube_url&quot;:&quot;https:\\\/\\\/youtu.be\\\/jVITFZJEm_k&quot;,&quot;autoplay&quot;:&quot;yes&quot;,&quot;video_type&quot;:&quot;youtube&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\t\t<div class=\"elementor-wrapper elementor-open-inline\">\n\t\t\t<div class=\"elementor-video\"><\/div>\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-124f2d5 elementor-button-danger elementor-widget elementor-widget-button\" data-id=\"124f2d5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-button-wrapper\">\n\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-lg\" href=\"https:\/\/youtu.be\/jVITFZJEm_k\" target=\"_blank\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<i aria-hidden=\"true\" class=\"fab fa-youtube\"><\/i>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Ver tutorial<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-77dfbe0 elementor-widget elementor-widget-spacer\" data-id=\"77dfbe0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\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<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-e7143c0 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"e7143c0\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;}\">\n\t\t\t\t\t\t\t<div class=\"elementor-background-overlay\"><\/div>\n\t\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-09e1578\" data-id=\"09e1578\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-b9157fa elementor-widget elementor-widget-heading\" data-id=\"b9157fa\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">\u00bfTe gustar\u00eda descargar el proyecto?<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-892e301 elementor-widget elementor-widget-text-editor\" data-id=\"892e301\" data-element_type=\"widget\" data-e-type=\"widget\" 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\t<div data-id=\"2d1f6c1\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\"><div><div><p><span style=\"color: #ffffff;\">Claro, todos los proyectos de AlexCG Design, son libres de descargar, recuerda que te puedes unir a la newsletter o tambi\u00e9n entrar a la p\u00e1gina de nuestro patrocinador para seguir apoyando:)<\/span><\/p><\/div><\/div><\/div>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-757248f elementor-button-danger elementor-widget elementor-widget-button\" data-id=\"757248f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-button-wrapper\">\n\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-lg\" href=\"https:\/\/alexcgdesign.com\/cursocss\" target=\"_blank\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<i aria-hidden=\"true\" class=\"fab fa-css3\"><\/i>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Curso CSS COMPLETO<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ef45511 elementor-button-warning elementor-widget elementor-widget-button\" data-id=\"ef45511\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-button-wrapper\">\n\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-lg\" href=\"https:\/\/www.mediafire.com\/file\/9fmxtrffi1cg6t6\/Menu_Despegable.zip\/file\" target=\"_blank\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<i aria-hidden=\"true\" class=\"fas fa-arrow-down\"><\/i>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Descarga el proyecto<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-df59aa6 elementor-button-info elementor-widget elementor-widget-button\" data-id=\"df59aa6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-button-wrapper\">\n\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-lg\" href=\"https:\/\/alexcgdesign.com\/cursocss\" target=\"_blank\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<i aria-hidden=\"true\" class=\"fas fa-laptop-code\"><\/i>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Hosting &amp; Dominio<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/div>\n\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<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-460bc19 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"460bc19\" data-element_type=\"section\" data-e-type=\"section\">\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-1825140\" data-id=\"1825140\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-5880432 elementor-widget elementor-widget-spacer\" data-id=\"5880432\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c03b29d elementor-widget elementor-widget-heading\" data-id=\"c03b29d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Entra a las Newsletter<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-311d06d elementor-widget elementor-widget-wpforms\" data-id=\"311d06d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"wpforms.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"wpforms-container \" id=\"wpforms-309\"><form id=\"wpforms-form-309\" class=\"wpforms-validate wpforms-form\" data-formid=\"309\" method=\"post\" enctype=\"multipart\/form-data\" action=\"\/blog\/wp-json\/wp\/v2\/posts\/569\" data-token=\"3bf46f48156df6a2c75b5e20008a8708\" data-token-time=\"1782910672\"><noscript class=\"wpforms-error-noscript\">Por favor, activa JavaScript en tu navegador para completar este formulario.<\/noscript><div class=\"wpforms-field-container\"><div id=\"wpforms-309-field_0-container\" class=\"wpforms-field wpforms-field-name\" data-field-id=\"0\"><label class=\"wpforms-field-label\">Nombre <span class=\"wpforms-required-label\">*<\/span><\/label><div class=\"wpforms-field-row wpforms-field-medium\"><div class=\"wpforms-field-row-block wpforms-first wpforms-one-half\"><input type=\"text\" id=\"wpforms-309-field_0\" class=\"wpforms-field-name-first wpforms-field-required\" name=\"wpforms[fields][0][first]\" required><label for=\"wpforms-309-field_0\" class=\"wpforms-field-sublabel after\">Nombre<\/label><\/div><div class=\"wpforms-field-row-block wpforms-one-half\"><input type=\"text\" id=\"wpforms-309-field_0-last\" class=\"wpforms-field-name-last wpforms-field-required\" name=\"wpforms[fields][0][last]\" required><label for=\"wpforms-309-field_0-last\" class=\"wpforms-field-sublabel after\">Apellidos<\/label><\/div><\/div><\/div><div id=\"wpforms-309-field_1-container\" class=\"wpforms-field wpforms-field-email\" data-field-id=\"1\"><label class=\"wpforms-field-label\" for=\"wpforms-309-field_1\">Correo electr\u00f3nico <span class=\"wpforms-required-label\">*<\/span><\/label><input type=\"email\" id=\"wpforms-309-field_1\" class=\"wpforms-field-medium wpforms-field-required\" name=\"wpforms[fields][1]\" spellcheck=\"false\" required><\/div><\/div><!-- .wpforms-field-container --><div class=\"wpforms-field wpforms-field-hp\"><label for=\"wpforms-309-field-hp\" class=\"wpforms-field-label\">Website<\/label><input type=\"text\" name=\"wpforms[hp]\" id=\"wpforms-309-field-hp\" class=\"wpforms-field-medium\"><\/div><div class=\"wpforms-submit-container\" ><input type=\"hidden\" name=\"wpforms[id]\" value=\"309\"><input type=\"hidden\" name=\"page_title\" value=\"\"><input type=\"hidden\" name=\"page_url\" value=\"https:\/\/alexcgdesign.com\/blog\/wp-json\/wp\/v2\/posts\/569\"><input type=\"hidden\" name=\"url_referer\" value=\"\"><button type=\"submit\" name=\"wpforms[submit]\" id=\"wpforms-submit-309\" class=\"wpforms-submit\" data-alt-text=\"Enviando...\" data-submit-text=\"Enviar\" aria-live=\"assertive\" value=\"wpforms-submit\">Enviar<\/button><\/div><\/form><\/div>  <!-- .wpforms-container -->\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<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Hola, \u00bfC\u00f3mo est\u00e1s?, el d\u00eda de hoy crearemos un men\u00fa animado, s\u00f3lamente con HTML CSS y Javascript. Sin utilizar ning\u00fan plugin o librer\u00eda. \u00bfTe animas a hacerlo?. \u00a1Excelente vamos alla! \u00a0 S\u00f3lo dejame preguntarte algo antes de empezar \u00bfYa viste el tutorial donde creamos el men\u00fa animado desde cero? Si la respuesta ha sido no, [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":570,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2],"tags":[],"class_list":["post-569","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-diseno-web"],"blocksy_meta":[],"_links":{"self":[{"href":"https:\/\/alexcgdesign.com\/blog\/wp-json\/wp\/v2\/posts\/569","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/alexcgdesign.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/alexcgdesign.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/alexcgdesign.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/alexcgdesign.com\/blog\/wp-json\/wp\/v2\/comments?post=569"}],"version-history":[{"count":0,"href":"https:\/\/alexcgdesign.com\/blog\/wp-json\/wp\/v2\/posts\/569\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/alexcgdesign.com\/blog\/wp-json\/wp\/v2\/media\/570"}],"wp:attachment":[{"href":"https:\/\/alexcgdesign.com\/blog\/wp-json\/wp\/v2\/media?parent=569"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/alexcgdesign.com\/blog\/wp-json\/wp\/v2\/categories?post=569"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/alexcgdesign.com\/blog\/wp-json\/wp\/v2\/tags?post=569"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}