Trigger 'nächsten' Rahmen in Niall Doherty Coda Slider 2.0 - Möglich mit Javascript. Change-Event?

Question

Ich habe mich verrückt gemacht, um diese Arbeit zu machen. Variationen meines Versuchs sind wahnsinnig peinlich geworden - ich kann einfach nicht herausfinden, was Niall Slider von mir verlangt, damit der Slider zum nächsten Frame wechselt, ohne etwas anzuklicken.

Was ich will ist, dass der Schieberegler zum nächsten Frame verschoben wird, wenn Formularelemente geändert werden. Also, mit jquery sollte das etwa so einfach sein wie zu sagen:

Aber anscheinend ist es nicht so einfach. Ich habe viele Dinge ausprobiert. Einige verzweifelte Dinge. Meist versuche ich nur, Teile seines Codes auszulösen. Der Code, der nächste Rahmen geschieht zu machen scheint, ist dieser Code:

$('#coda-nav-right-' + sliderCount + ' a').click(function(){ 
     navClicks++; 
     if (currentPanel == panelCount) { 
      offset = 0; 
      currentPanel = 1; 
      alterPanelHeight(0); 
      slider.siblings('.coda-nav').find('a.current').removeClass('current').parents('ul').find('a:eq(0)').addClass('current'); 
     } else { 
      offset = - (panelWidth*currentPanel); 
      alterPanelHeight(currentPanel); 
      currentPanel += 1; 
      slider.siblings('.coda-nav').find('a.current').removeClass('current').parent().next().find('a').addClass('current'); 
     }; 
     $('.panel-container', slider).animate({ marginLeft: offset }, settings.slideEaseDuration, settings.slideEaseFunction); 
     if (settings.crossLinking) { location.hash = currentPanel }; // Change the URL hash (cross-linking) 
     return false; 
    }); 

Es ist eine Kombination von mir mit Javascript sehr mittelmäßig und ziemlich vertraut mit Nialls Code zu sein. Es ist gut kommentiert, aber ich kann nicht genau sagen, was in jeder Zeile passiert. Wenn ich sehen kann, bin ich nicht wirklich sicher, wie ich das Gleiche mit meiner .change-Funktion machen kann.

Wie auch immer, wenn jemand etwas Licht darauf werfen könnte, wäre ich unglaublich dankbar. Ich denke, wenn mir geholfen wird, das herauszufinden, könnte es mir auch ein bisschen weiter helfen. Ich denke, hier ist etwas über Javascript, das ich nicht verstehe, aber ich weiß nicht, was es ist.

Answer 1

Sie können auf einen Link programmgesteuert mit der Funktion no-args click() in jQuery klicken. Vorausgesetzt, dass Sie die gleiche Einstellung verwenden wie die meisten Beispiele, sollten Sie in der Lage sein, so etwas zu schreiben:

HTML:

<input type="radio" id="next-panel" /> 

JavaScript:

$("#next-panel").bind("change", function() { 
    $("#coda-nav-right-1 > a").click(); 
}); 

Dies wird auf den Link das ist der Standard-Speicherort für den "richtigen" Link in den Demos. Sie können hier ein funktionierendes Beispiel sehen: http://jsfiddle.net/andrewwhitaker/WzJMP/

Randbemerkung: Haben Sie darüber nachgedacht, jQueryUI tabs verwenden? jQueryUI hat eine viel besser nutzbare und gut dokumentierte API, und Sie könnten die Effekte und Funktionen von Coda Slider leicht neu erstellen. Sie werden wahrscheinlich auch auf Websites wie StackOverflow besser unterstützt.