Lista Desplegable Seleccionable<\/title>\n <style>\n \/* Estilos para el contenedor *\/\n .dropdown {\n position: relative;\n display: inline-block;\n }\n\n \/* Estilos para el bot\u00f3n *\/\n .dropdown-btn {\n background-color: #4CAF50;\n color: white;\n padding: 16px;\n font-size: 16px;\n border: none;\n cursor: pointer;\n width: 200px;\n text-align: left;\n }\n\n \/* Contenedor de las opciones desplegables *\/\n .dropdown-content {\n display: none;\n position: absolute;\n background-color: #f9f9f9;\n min-width: 160px;\n box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);\n z-index: 1;\n width: 100%;\n }\n\n \/* Estilos para las opciones *\/\n .dropdown-content a {\n color: black;\n padding: 12px 16px;\n text-decoration: none;\n display: block;\n cursor: pointer;\n }\n\n \/* Efecto de color al pasar el cursor sobre las opciones *\/\n .dropdown-content a:hover {\n background-color: #f1f1f1;\n color: #4CAF50;\n }\n\n \/* Mostrar las opciones cuando se pasa el cursor sobre el bot\u00f3n *\/\n .dropdown:hover .dropdown-content {\n display: block;\n }\n\n \/* Cambiar el color del bot\u00f3n cuando el cursor est\u00e1 sobre \u00e9l *\/\n .dropdown:hover .dropdown-btn {\n background-color: #3e8e41;\n }\n\n \/* Estilo de la opci\u00f3n seleccionada *\/\n .selected {\n background-color: #4CAF50;\n color: white !important;\n }\n <\/style>\n<\/head>\n<body>\n\n<div class=\"dropdown\">\n <button class=\"dropdown-btn\" id=\"dropdownButton\">Selecciona una opci\u00f3n<\/button>\n <div class=\"dropdown-content\">\n <a href=\"#\" onclick=\"selectOption(this, 'Residente')\">Residente<\/a>\n <a href=\"#\" onclick=\"selectOption(this, 'Ingeniero')\">Ingeniero<\/a>\n <a href=\"#\" onclick=\"selectOption(this, 'Oficial tecnico')\">Oficial tecnico<\/a>\n <a href=\"#\" onclick=\"selectOption(this, 'Ayudante')\">Ayudante<\/a>\n <a href=\"#\" onclick=\"selectOption(this, 'Segurista')\">Segurista<\/a>\n <a href=\"#\" onclick=\"selectOption(this, 'Cotizador')\">Cotizador<\/a>\n <a href=\"#\" onclick=\"selectOption(this, 'Comprador')\">Comprador<\/a>\n <\/div>\n<\/div>\n\n<script>\n \/\/ Funci\u00f3n para seleccionar la opci\u00f3n y actualizar el bot\u00f3n\n function selectOption(element, optionText) {\n \/\/ Remover la clase 'selected' de cualquier opci\u00f3n previamente seleccionada\n var options = document.querySelectorAll('.dropdown-content a');\n options.forEach(function(option) {\n option.classList.remove('selected');\n });\n\n \/\/ Agregar la clase 'selected' a la opci\u00f3n seleccionada\n element.classList.add('selected');\n\n \/\/ Actualizar el texto del bot\u00f3n principal\n document.getElementById('dropdownButton').textContent = optionText;\n }\n<\/script>\n\n<\/body>\n<\/html>\n\n\n\n\n<div class=\"wpcf7 no-js\" id=\"wpcf7-f969-o1\" lang=\"en-US\" dir=\"ltr\" data-wpcf7-id=\"969\">\n<div class=\"screen-reader-response\"><p role=\"status\" aria-live=\"polite\" aria-atomic=\"true\"><\/p> <ul><\/ul><\/div>\n<form action=\"\/index.php\/wp-json\/wp\/v2\/pages\/967#wpcf7-f969-o1\" method=\"post\" class=\"wpcf7-form init\" aria-label=\"Contact form\" enctype=\"multipart\/form-data\" novalidate=\"novalidate\" data-status=\"init\">\n<div style=\"display: none;\">\n<input type=\"hidden\" name=\"_wpcf7\" value=\"969\" \/>\n<input type=\"hidden\" name=\"_wpcf7_version\" value=\"6.0.3\" \/>\n<input type=\"hidden\" name=\"_wpcf7_locale\" value=\"en_US\" \/>\n<input type=\"hidden\" name=\"_wpcf7_unit_tag\" value=\"wpcf7-f969-o1\" \/>\n<input type=\"hidden\" name=\"_wpcf7_container_post\" value=\"0\" \/>\n<input type=\"hidden\" name=\"_wpcf7_posted_data_hash\" value=\"\" \/>\n<\/div>\n<p class=\"spam-master-hidden\"><label class=\"spam-master-hidden\" for=\"spammaster_extra_field_1\">Insert your mother second name<br><input class=\"spam-master-hidden input\" type=\"text\" name=\"spammaster_extra_field_1\" id=\"spammaster_extra_field_1\" autocomplete=\"off\" value=\"\" \/><\/label><\/p><p class=\"spam-master-hidden\"><label class=\"spam-master-hidden\" for=\"spammaster_extra_field_2\">Insert your father second name<br><input class=\"spam-master-hidden input\" type=\"text\" name=\"spammaster_extra_field_2\" id=\"spammaster_extra_field_2\" autocomplete=\"off\" value=\"\" \/><\/label><\/p><p><label> Your name<br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-name\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-text wpcf7-validates-as-required\" autocomplete=\"name\" aria-required=\"true\" aria-invalid=\"false\" value=\"\" type=\"text\" name=\"your-name\" \/><\/span> <\/label>\n<\/p>\n<p><label> Your email<br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-email\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-email wpcf7-validates-as-required wpcf7-text wpcf7-validates-as-email\" autocomplete=\"email\" aria-required=\"true\" aria-invalid=\"false\" value=\"\" type=\"email\" name=\"your-email\" \/><\/span> <\/label>\n<\/p>\n<p><label> Subject<br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-subject\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-text wpcf7-validates-as-required\" aria-required=\"true\" aria-invalid=\"false\" value=\"\" type=\"text\" name=\"your-subject\" \/><\/span> <\/label>\n<\/p>\n<p><label> Your message (optional)<br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-message\"><textarea cols=\"40\" rows=\"10\" maxlength=\"2000\" class=\"wpcf7-form-control wpcf7-textarea\" aria-invalid=\"false\" name=\"your-message\"><\/textarea><\/span> <\/label>\n<\/p>\n<p><input class=\"wpcf7-form-control wpcf7-submit has-spinner\" type=\"submit\" value=\"Submit\" \/>\n<\/p>\n<p><label> Subir CV<br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"doc\"><input size=\"40\" class=\"wpcf7-form-control wpcf7-file\" accept=\".pdf,.txt,.doc,.docx\" aria-invalid=\"false\" type=\"file\" name=\"doc\" \/><\/span><\/label><br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"math-quiz\"><label><span class=\"wpcf7-quiz-label\">5+5=?<\/span> <input size=\"40\" class=\"wpcf7-form-control wpcf7-quiz\" autocomplete=\"off\" aria-required=\"true\" aria-invalid=\"false\" type=\"text\" name=\"math-quiz\" \/><\/label><input type=\"hidden\" name=\"_wpcf7_quiz_answer_math-quiz\" value=\"945f46db54cd67fbae4f172dc1e1bde9\" \/><\/span><br \/>\n<input class=\"wpcf7-form-control wpcf7-submit has-spinner\" type=\"submit\" value=\"Enviar\" \/>\n<\/p><p class=\"spam-master-sig\"><label for=\"spam_master\"><a href=\"https:\/\/www.spammaster.org\/\" target=\"_blank\" title=\"Protected by Spam Master\">Protected by Spam Master<\/a><\/label><\/p><div class=\"wpcf7-response-output\" aria-hidden=\"true\"><\/div>\n<\/form>\n<\/div>\n\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Lista Desplegable Seleccionable Selecciona una opci\u00f3n Residente Ingeniero Oficial tecnico Ayudante Segurista Cotizador Comprador<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_joinchat":[],"footnotes":""},"class_list":["post-967","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/syptel.com.mx\/index.php\/wp-json\/wp\/v2\/pages\/967","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/syptel.com.mx\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/syptel.com.mx\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/syptel.com.mx\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/syptel.com.mx\/index.php\/wp-json\/wp\/v2\/comments?post=967"}],"version-history":[{"count":9,"href":"https:\/\/syptel.com.mx\/index.php\/wp-json\/wp\/v2\/pages\/967\/revisions"}],"predecessor-version":[{"id":979,"href":"https:\/\/syptel.com.mx\/index.php\/wp-json\/wp\/v2\/pages\/967\/revisions\/979"}],"wp:attachment":[{"href":"https:\/\/syptel.com.mx\/index.php\/wp-json\/wp\/v2\/media?parent=967"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":967,"date":"2024-10-04T18:45:12","date_gmt":"2024-10-04T18:45:12","guid":{"rendered":"https:\/\/syptel.com.mx\/?page_id=967"},"modified":"2024-10-04T19:53:11","modified_gmt":"2024-10-04T19:53:11","slug":"test-empleos","status":"publish","type":"page","link":"https:\/\/syptel.com.mx\/index.php\/test-empleos\/","title":{"rendered":"test empleos"},"content":{"rendered":"\n\n\n\n \n \n Lista Desplegable Seleccionable<\/title>\n <style>\n \/* Estilos para el contenedor *\/\n .dropdown {\n position: relative;\n display: inline-block;\n }\n\n \/* Estilos para el bot\u00f3n *\/\n .dropdown-btn {\n background-color: #4CAF50;\n color: white;\n padding: 16px;\n font-size: 16px;\n border: none;\n cursor: pointer;\n width: 200px;\n text-align: left;\n }\n\n \/* Contenedor de las opciones desplegables *\/\n .dropdown-content {\n display: none;\n position: absolute;\n background-color: #f9f9f9;\n min-width: 160px;\n box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);\n z-index: 1;\n width: 100%;\n }\n\n \/* Estilos para las opciones *\/\n .dropdown-content a {\n color: black;\n padding: 12px 16px;\n text-decoration: none;\n display: block;\n cursor: pointer;\n }\n\n \/* Efecto de color al pasar el cursor sobre las opciones *\/\n .dropdown-content a:hover {\n background-color: #f1f1f1;\n color: #4CAF50;\n }\n\n \/* Mostrar las opciones cuando se pasa el cursor sobre el bot\u00f3n *\/\n .dropdown:hover .dropdown-content {\n display: block;\n }\n\n \/* Cambiar el color del bot\u00f3n cuando el cursor est\u00e1 sobre \u00e9l *\/\n .dropdown:hover .dropdown-btn {\n background-color: #3e8e41;\n }\n\n \/* Estilo de la opci\u00f3n seleccionada *\/\n .selected {\n background-color: #4CAF50;\n color: white !important;\n }\n <\/style>\n<\/head>\n<body>\n\n<div class=\"dropdown\">\n <button class=\"dropdown-btn\" id=\"dropdownButton\">Selecciona una opci\u00f3n<\/button>\n <div class=\"dropdown-content\">\n <a href=\"#\" onclick=\"selectOption(this, 'Residente')\">Residente<\/a>\n <a href=\"#\" onclick=\"selectOption(this, 'Ingeniero')\">Ingeniero<\/a>\n <a href=\"#\" onclick=\"selectOption(this, 'Oficial tecnico')\">Oficial tecnico<\/a>\n <a href=\"#\" onclick=\"selectOption(this, 'Ayudante')\">Ayudante<\/a>\n <a href=\"#\" onclick=\"selectOption(this, 'Segurista')\">Segurista<\/a>\n <a href=\"#\" onclick=\"selectOption(this, 'Cotizador')\">Cotizador<\/a>\n <a href=\"#\" onclick=\"selectOption(this, 'Comprador')\">Comprador<\/a>\n <\/div>\n<\/div>\n\n<script>\n \/\/ Funci\u00f3n para seleccionar la opci\u00f3n y actualizar el bot\u00f3n\n function selectOption(element, optionText) {\n \/\/ Remover la clase 'selected' de cualquier opci\u00f3n previamente seleccionada\n var options = document.querySelectorAll('.dropdown-content a');\n options.forEach(function(option) {\n option.classList.remove('selected');\n });\n\n \/\/ Agregar la clase 'selected' a la opci\u00f3n seleccionada\n element.classList.add('selected');\n\n \/\/ Actualizar el texto del bot\u00f3n principal\n document.getElementById('dropdownButton').textContent = optionText;\n }\n<\/script>\n\n<\/body>\n<\/html>\n\n\n\n\n<div class=\"wpcf7 no-js\" id=\"wpcf7-f969-o1\" lang=\"en-US\" dir=\"ltr\" data-wpcf7-id=\"969\">\n<div class=\"screen-reader-response\"><p role=\"status\" aria-live=\"polite\" aria-atomic=\"true\"><\/p> <ul><\/ul><\/div>\n<form action=\"\/index.php\/wp-json\/wp\/v2\/pages\/967#wpcf7-f969-o1\" method=\"post\" class=\"wpcf7-form init\" aria-label=\"Contact form\" enctype=\"multipart\/form-data\" novalidate=\"novalidate\" data-status=\"init\">\n<div style=\"display: none;\">\n<input type=\"hidden\" name=\"_wpcf7\" value=\"969\" \/>\n<input type=\"hidden\" name=\"_wpcf7_version\" value=\"6.0.3\" \/>\n<input type=\"hidden\" name=\"_wpcf7_locale\" value=\"en_US\" \/>\n<input type=\"hidden\" name=\"_wpcf7_unit_tag\" value=\"wpcf7-f969-o1\" \/>\n<input type=\"hidden\" name=\"_wpcf7_container_post\" value=\"0\" \/>\n<input type=\"hidden\" name=\"_wpcf7_posted_data_hash\" value=\"\" \/>\n<\/div>\n<p class=\"spam-master-hidden\"><label class=\"spam-master-hidden\" for=\"spammaster_extra_field_1\">Insert your mother second name<br><input class=\"spam-master-hidden input\" type=\"text\" name=\"spammaster_extra_field_1\" id=\"spammaster_extra_field_1\" autocomplete=\"off\" value=\"\" \/><\/label><\/p><p class=\"spam-master-hidden\"><label class=\"spam-master-hidden\" for=\"spammaster_extra_field_2\">Insert your father second name<br><input class=\"spam-master-hidden input\" type=\"text\" name=\"spammaster_extra_field_2\" id=\"spammaster_extra_field_2\" autocomplete=\"off\" value=\"\" \/><\/label><\/p><p><label> Your name<br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-name\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-text wpcf7-validates-as-required\" autocomplete=\"name\" aria-required=\"true\" aria-invalid=\"false\" value=\"\" type=\"text\" name=\"your-name\" \/><\/span> <\/label>\n<\/p>\n<p><label> Your email<br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-email\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-email wpcf7-validates-as-required wpcf7-text wpcf7-validates-as-email\" autocomplete=\"email\" aria-required=\"true\" aria-invalid=\"false\" value=\"\" type=\"email\" name=\"your-email\" \/><\/span> <\/label>\n<\/p>\n<p><label> Subject<br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-subject\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-text wpcf7-validates-as-required\" aria-required=\"true\" aria-invalid=\"false\" value=\"\" type=\"text\" name=\"your-subject\" \/><\/span> <\/label>\n<\/p>\n<p><label> Your message (optional)<br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-message\"><textarea cols=\"40\" rows=\"10\" maxlength=\"2000\" class=\"wpcf7-form-control wpcf7-textarea\" aria-invalid=\"false\" name=\"your-message\"><\/textarea><\/span> <\/label>\n<\/p>\n<p><input class=\"wpcf7-form-control wpcf7-submit has-spinner\" type=\"submit\" value=\"Submit\" \/>\n<\/p>\n<p><label> Subir CV<br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"doc\"><input size=\"40\" class=\"wpcf7-form-control wpcf7-file\" accept=\".pdf,.txt,.doc,.docx\" aria-invalid=\"false\" type=\"file\" name=\"doc\" \/><\/span><\/label><br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"math-quiz\"><label><span class=\"wpcf7-quiz-label\">5+5=?<\/span> <input size=\"40\" class=\"wpcf7-form-control wpcf7-quiz\" autocomplete=\"off\" aria-required=\"true\" aria-invalid=\"false\" type=\"text\" name=\"math-quiz\" \/><\/label><input type=\"hidden\" name=\"_wpcf7_quiz_answer_math-quiz\" value=\"945f46db54cd67fbae4f172dc1e1bde9\" \/><\/span><br \/>\n<input class=\"wpcf7-form-control wpcf7-submit has-spinner\" type=\"submit\" value=\"Enviar\" \/>\n<\/p><p class=\"spam-master-sig\"><label for=\"spam_master\"><a href=\"https:\/\/www.spammaster.org\/\" target=\"_blank\" title=\"Protected by Spam Master\">Protected by Spam Master<\/a><\/label><\/p><div class=\"wpcf7-response-output\" aria-hidden=\"true\"><\/div>\n<\/form>\n<\/div>\n\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Lista Desplegable Seleccionable Selecciona una opci\u00f3n Residente Ingeniero Oficial tecnico Ayudante Segurista Cotizador Comprador<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_joinchat":[],"footnotes":""},"class_list":["post-967","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/syptel.com.mx\/index.php\/wp-json\/wp\/v2\/pages\/967","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/syptel.com.mx\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/syptel.com.mx\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/syptel.com.mx\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/syptel.com.mx\/index.php\/wp-json\/wp\/v2\/comments?post=967"}],"version-history":[{"count":9,"href":"https:\/\/syptel.com.mx\/index.php\/wp-json\/wp\/v2\/pages\/967\/revisions"}],"predecessor-version":[{"id":979,"href":"https:\/\/syptel.com.mx\/index.php\/wp-json\/wp\/v2\/pages\/967\/revisions\/979"}],"wp:attachment":[{"href":"https:\/\/syptel.com.mx\/index.php\/wp-json\/wp\/v2\/media?parent=967"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}