【问题标题】:Responsive stacking multi-image slider响应式堆叠多图像滑块
【发布时间】:2015-04-30 20:23:24
【问题描述】:
我希望做以下事情:
有一个自动播放滑块,一次移动 2 张幻灯片。左/上幻灯片将包含 div 中的实时文本,右/下幻灯片将只是一个图像。当浏览器调整大小时,我希望左侧部分堆叠在顶部。当它们滑动时,它们将被替换为 2 个以完全相同的方式设置的不同幻灯片。
是否有插件或 jquery 可以使这成为可能?还是我可以操纵的一个简单的?
谢谢你,
乔丹娜
【问题讨论】:
标签:
javascript
jquery
mobile
slider
responsive-slides
【解决方案1】:
你会想要一个像这样的函数来同时制作动画
$(function () {
$("#first").animate({
//youre animation here in the format of
width: '600px'
}, { duration: 200, queue: false });
$("#second").animate({
//if you want you can change several attributes at once such as
width: '600px',
height: '600px'
}, { duration: 200, queue: false });
});
然后您将使用 css 将用作容器的 div 或 span 的宽度设置为百分比。所以它会自动调整大小尝试 90%
并玩弄它。当然,根据您所说,您将希望更改实际动画参数以使第一个 Dom 向上移动,第二个 Dom 向下移动....这应该很简单...所以我希望这会有所帮助!