hyperlink - anything slider

Al hacer clic en el enlace, cambia la URL en la barra del navegador, pero en realidad no carga la URL(puede estar relacionada con AnythingSlider)

Question

Estoy usando AnythingSlider. Tengo un enlace a cierta página y diapositiva, como este:

<a href=''http://sitename.com/pagename/#panel1-1''>Click Me</a>

Actualizado para mayor claridad: el problema fue que cuando creo un enlace como este, el enlace directo a la página y la diapositiva funciona cuando el enlace no está en la página con la diapositiva, pero no funciona cuando está en la misma página. como la diapositiva. Como tengo estos enlaces en todo mi sitio, y es dinámico, necesitaba una forma de poder simplemente vincular a una diapositiva, que funcionaría en cualquier página, incluida la página donde está la diapositiva.

Encontré una solución: me estoy vinculando a la diapositiva tal como estaba antes, y luego actualicé dinámicamente la acción en ese enlace para las páginas donde el enlace aparece en la misma página que el control deslizante.

** Mi solución (la esencia que utilicé en mi sitio, edítela según sus propósitos): **

//Get anythingslider links, and dynamically update them so that they jump to the slider
    $("a").each(function(){

        var pathname = window.location.pathname.replace(/^https?:////critter.co/,'''');

        var link = this.href.replace(/^https?:////critter.co/,'''');

        if(link.indexOf("/settings/home") == 0 && pathname.indexOf("/settings/home") == 0){
            $(this).removeAttr("href");
            slidenum = parseInt(link.charAt(link.length-1));
            $(this).click(function(){
                $("ul#slider").anythingSlider(link.charAt(link.length-1));
            });
        }

        if(link.indexOf("/record/home") == 0 && pathname.indexOf("/record/home") == 0){
            $(this).removeAttr("href");
            slidenum = parseInt(link.charAt(link.length-1));
            $(this).click(function(){
                $("ul#slider").anythingSlider(link.charAt(link.length-1));
            });
        }

    })

Answer 1

No estoy muy seguro de que te entiendo, con las páginas en el lado derecho. Pero creo que el problema que tienes es que el enlace en sí solo está cambiando la URL y no las diapositivas, ¿verdad?

En primer lugar, el nombre de página pagename/ está enlazando con otra página, por lo que debería estar funcionando. Si desea controlar el control deslizante desde la misma página, solo necesitará la parte #1-1 ; bueno, si tiene múltiples controles deslizantes en la página.

One Slider ( demo )

• Si solo tiene un control deslizante, puede hacer algo como esto:

  <nav>
      Go to slide:
      <a href="#1">One</a> | <a href="#2">Two</a> | <a href="#3">Three</a> |
      <a href="#4">Four</a> | <a href="#5">Five</a>
  </nav>

  y este código para hacer que el control deslizante vaya a esa diapositiva en particular:

  $(''nav a'').click(function(){
      $(''#slider'').anythingSlider( $(this).attr(''href'').substring(1) );
  });

Multiple Sliders ( demo )

• En este HTML, he agregado un índice para el control deslizante en el atributo href - #1-1 significa deslizador 1, panel 1. Así que aquí hay un ejemplo de navegación para múltiples controles deslizantes (se pueden agregar más).

  <nav>
      top slider: <a href="#1-1">One</a> | <a href="#1-2">Two</a> | <a href="#1-3">Three</a> |
      <a href="#1-4">Four</a> | <a href="#1-5">Five</a>
      <br>
      bottom slider: <a href="#2-1">One</a> | <a href="#2-2">Two</a> | <a href="#2-3">Three</a> |
      <a href="#2-4">Four</a> | <a href="#2-5">Five</a>
  </nav>

  Entonces este código se puede usar para controlar los controles deslizantes:

  $(''nav a'').click(function(){
      var link = $(this).attr(''href'').match(/(/d+)-(/d+)/),
          slider = parseInt( link[1], 10 ) - 1; // eq needs zero based index
      $(''.slider'').eq( slider ).anythingSlider( link[2] );
  });