lightgalleryをカスタマイズに関して。プルダウン機能を付けてみまた。

Question

スライダーのlightgalleryをカスタマイズして
プルダウン機能でページ移動させる機能を付けました。

プルダウンでページ移動はできたのですが、
サムネも現在見ている画像が赤枠で表示されるのですが、
そこが正常に移動してくれません。

---

プルダウン移動した１回目→サムネの赤枠部分動かない
プルダウン移動した２回目→１回目の開いたページが赤枠になる。
プルダウン移動した３回目→２回目の開いたページが赤枠になる。
・・・という感じでズレてしまいます。

プルダウンで移動した際に赤枠になる「addClass("active")」がしっかり利いていないようです。

デモページ
http://footmarkdays.web.fc2.com/index1.html

何が原因か分かりますでしょうか。

【現在使用しているjs】
$('select').change(function() {
var val = this.value;
location.href = document.URL.replace( /([&?]slide=)\d{1,3}/ , "$1" + val );
});

【関数？を使ったjs】
このあたりよく分かっていないのですが、下記ページのメソッドから
スライドさせる関数があったので、それを使った動かし方をしても、、、症状は変わりませんでした。
http://sachinchoolur.github.io/lightGallery/docs/api.html#methods

('select').change(function() {
$('#lightgallery').data('lightGallery').slide(this.value);
});

Answer 1

lightGalleryの公式のデモページで、

$('#aniimated-thumbnials').data('lightGallery').slide(5);

をやってみて同じ状態に（サムネイルの赤枠がズレる）なるので、潜在バグなのかな・・？

lightGalleryのコードを見る気力が起きなかったので、どこらへんが悪いのは分からないですがー・・・

とりあえずの解決方法として。

いつでもサムネイルを出した上でのカスタマイズ機能なのであれば、
スライドさせる動作を、サムネイルをクリックしたときの動作に任せてしまえば
現状の問題は回避できそうです。

$('select').change(function() {
  $($('.lg-thumb-item')[this.value]).click();//該当のサムネイルをクリック
});

サムネイルを出さない可能性があるなら、
今のスライダーの表示位置を把握して、←か、→を、必要な回数クリックするとかでも行けそうです。