私はlightsliderとlightgalleryの組み合わせを使用しています。 マウスをドラッグするとギャラリーが開くことを除いて、すべてが希望どおりに機能しています。 これは起こらないはずだと思います。マウスドラッグで画像をスライドさせるだけです。
私はこれを修正できないようです。 これは関連するコードです:
var allowOtherImageTools = true;
jQuery(function ($)
{
if ($(".image_tools > li").length > 1)
{
var myLightSlider;
myLightSlider = $(".image_tools").lightSlider({
item: 1,
slideMargin: 5, //margin right
enableDrag: true, //mouse drag
loop: true, //loop carousel
pager: false, //small bullets
gallery: false, //small thumbnails
enableTouch: true,
swipeThreshold: 50,
prevHtml: '<span class="icon icon-left-open">',
nextHtml: '<span class="icon icon-right-open">',
onBeforeSlide: function (imageTools)
{
allowOtherImageTools = false;
},
onAfterSlide: function (imageTools)
{
allowOtherImageTools = true;
.......
},
/*
* Gallery > When slider is loaded the gallery is iniated
*/
onSliderLoad: function (imageTools)
{
var myLightGallery;
myLightGallery = imageTools.lightGallery(
{
selector: '.lslide figure img', // custom selector to find content
mode: 'lg-slide', // fade mode (slide and fade present, other need additional css file)
download: false, // show or hide download button
prevHtml: '<span class="icon icon-left-open">',
nextHtml: '<span class="icon icon-right-open">',
loop: true,
//zoom plugin
zoom: true,
actualSize: true, // back to default size
scale: 0.5, // zoom scale
hideBarsDelay: 150000, //hide toolbar 15s
})
// event object Jquery event object
// prevIndex int index of previous slide
// index int index of the slide
// fromTouch bool true if slide function called via touch event or mouse drag
// fromThumb bool true if slide function called via thumbnail click
.on('onAfterSlide.lg', function (event, prevIndex, index, fromTouch, fromThumb)
{
//match slider index
myLightSlider.goToSlide(index);
})
// event object Jquery event object
.on('onBeforeOpen.lg', function (event) {
if (!allowOtherImageTools)
{
//what should i do here??
}
});
}
});
}
//else no image slider needed
});
修正として、マウスドラッグでギャラリーを開かないようにしようとしています(失敗しています)。 onBeforeSlide / onAfterslideイベントを使用して、ギャラリーのオープンを停止するためにグローバルなallowOtherImageToolsを設定しています。
私の質問
onBeforeOpen.lg
にバインドされた無名関数で何をすべきですか?ねえ@preliot 、
現在、この問題を直接解決する方法はありません。 私はlightSliderバージョン2.0に取り組んでいます。 v2.0に修正を含めようとします。
現在使用している場合は、設定からenableDragとenableTouchを無効にできます。
http://sachinchoolur.github.io/lightslider/settings.html
一時的な修正:
onBeforeSlide: function (imageTools)
{
$('body').addClass('lg-on');
},
/*
* Slider > Replacement text with real sentences
*/
onAfterSlide: function (imageTools)
{
$('body').removeClass('lg-on');
}
}
ギャラリーはすでに開いていると想定しているため、機能します。 これはハックですが、マウスドラッグを続けます!
おそらくlightsliderを使用する方が良い考えですが、切り替えるには遅すぎるので、 tiny-slider
機能するものを次に示します。
slider.events.on('dragStart', function () {
setTimeout(function () {
$('body').addClass('lg-on');
}, 100);
});
slider.events.on('dragEnd', function () {
$('body').removeClass('lg-on');
});
最も参考になるコメント
一時的な修正:
ギャラリーはすでに開いていると想定しているため、機能します。 これはハックですが、マウスドラッグを続けます!