水平画廊 - 滚动和触摸

我使用NG画廊在wordpress上制作了水平画廊。水平画廊 - 滚动和触摸

我想使用鼠标滚轮滚动图库并点击图库区域并移动。现在我只能通过点击图库底部的滚动条并手动移动来移动图像。我该如何实现它？

这是我的自定义代码：

.ngg-galleryoverview { 
    display: table-row; 
    float: none; 
    max-width: 100%; 
    overflow-x: scroll; 
    overflow-scrolling: touch; 
    clear: both; 
} 

.ngg-gallery-thumbnail-box { 
    display: table-cell; 
    float: none; 
} 

.ngg-gallery-thumbnail { 
    width: 415px; 
}

来源

2017-06-13 Pat

你能提供一些小提琴或codepen与您的画廊..... –

@RenzoCC - 我觉得类似 - 它看起来差不多一样。在这种情况下，它是明确的HTML，但视图是相同的http://jsfiddle.net/mendota/w9dvp/2/ – Pat

添加这一点，正在鼠标滚轮事件丝毫此library
去处理鼠标滚轮事件

$('#footer').on('mousewheel', function(event) { 
    //console.log(event.deltaX, event.deltaY, event.deltaFactor); 
    if(event.deltaY==1){ 
     $(this).animate({scrollLeft: '+=10px'}, 100); 
    }else if(event.deltaY==-1){ 
     $(this).animate({scrollLeft: '-=10px'}, 100); 
    } 
});

fiddle

来源

2017-06-13 13:03:19

我应该插入“#footer” - 在我的情况下，div看起来像https：// s10 .postimg.org/st8fim915/div.png – Pat

你能帮忙吗？ – Pat

抱歉，延迟......你可以尝试添加.ngg-ajax-pagination-none而不是#footer，但我不能保证它，因为我看不到错误，请尝试重现错误在一个小提琴codepen或在这里.... https://stackoverflow.com/help/mcve –

水平画廊 - 滚动和触摸

回答

相关问题