Estoy trabajando con esta plantilla de templatemo.
Quería incluir algunas referencias a otras partes del sitio web en el cuerpo del texto (por ejemplo, "póngase en contacto conmigo" para obtener más información). Si hace clic en "Contácteme", la página debería navegar a "Contacto" de la misma manera que si el usuario hiciera clic en la barra de navegación para navegar a la página (con la misma animación).
Para ello, agregué el siguiente código para activar un evento de clic:
<p class="tm-text">Contact me via the <a id="myLink" href="javascript:loadPage(5);">contact form</a></p>
Y la función para activar el clic:
function loadPage(pageNo) { $(document).ready(function() { $('.nav-item').get(pageNo).click();}); }Entonces, este código funciona, si hago clic en la referencia, la página cambia como si hiciera clic en la barra de navegación. PERO:
Si vuelvo a cargar la página y hago clic en la referencia, la página navega a la página de contacto, que, sin embargo, no se muestra correctamente (faltan el formulario de contacto y la vista de Google Maps).
Si vuelvo a cargar la página, primero abra la página de contacto a través del menú, luego cambie a la página con la referencia y haga clic en ella, la página de contacto se carga correctamente.
Este comportamiento también se muestra si hago referencia a otra página (por ejemplo, la Galería). Se muestran los elementos de la galería (la página no está completamente vacía), pero el espacio entre los elementos no es correcto.
Parece que cada página debe cargarse al menos una vez a través de la barra de navegación. Si esto ha sucedido, todas las páginas se muestran correctamente cuando se abren a través de una referencia en el texto.
Gracias por su apoyo.
Su plantilla usa el control deslizante Hero + algunas funciones personalizadas de JavaScript para moverse entre "páginas", por lo que debe usar las mismas funciones para obtener el mismo comportamiento.
Hacer eso funcionará:
<p class="tm-text">Contact me via the <a id="myLink" href="javascript:goToPage('Contact');">contact form</a></p>Necesita agregar esta función JS:
function goToPage(page_name) { // Retrieve the <a> tag with the page_name // page_name is the string of the page in the navbar page_link_a = $('.navbar-nav .nav-link').filter(function(index) { return $(this).text() === page_name; }); page_link_li = page_link_a.parent(); // Trigger js code from hero slider page_link_li.click(); // Trigger js code from templatemo page_link_a.click(); } La función goToPage() toma un parámetro, el nombre de cadena de la sección, por lo que si tiene una sección llamada My Gallery , debe poner eso, no my-gallery ni un índice.