我查看了许多不同的滑块,但没有找到任何可以实现设计师想要的东西。下面的图片应该有助于解释。请注意,滑块上方和下方都有用于页眉/页脚内容的空间。
A. 基本上这个想法是使用一定数量的屏幕空间,比如 10%,让下一个图像 (2) 在右侧部分可见。
B. 当前图像 (1) 向左浮动并填充高度 - 它可能是宽图像或窄图像。
C. 以浅灰色显示的空间量取决于用户的可用屏幕空间。当图像达到全分辨率时,间隙将根据需要扩大。
D. 相反,随着可用空间的缩小,间隙也会缩小,并且
E. 间隙达到最小尺寸后,载玻片收缩。
F. 然后,如果需要,当前幻灯片 (1) 将开始从左右剪裁(宽图像)。
G. 对于动画,下一张幻灯片 (2) 滑过以填补空白,然后将当前幻灯片 (1) 凸出,在将下一张图片部分拉入之前留下空白。
是否有一个滑块已经做了类似的事情,还是我需要修改一个现有的?如果是这样,什么是一个好的起点?我试过像 Flexslider 这样的,但是 JS 调整大小会干扰在屏幕上显示两个。
还没有图片发布权限,所以这里是:http: //imgur.com/swYtr