在jQuery滑块中处理不同大小的图像

嗨我使用标准的jQuery图像滑块/旋转木马来显示图像。在jQuery滑块中处理不同大小的图像

我有在滑块中使用的各种尺寸的图像。我怎样才能确保宽度和高度不会影响滑块的尺寸，同时仍然看起来一半体面。例如slider是width = 300px height = 200px？

我希望它这样的滑块的行为： http://coffeescripter.com/code/ad-gallery/

，但我不是使用一个负责任的设计

来源

2012-02-22 raklos

你见过这个滑块吗？它是为响应式设计而打造的。 http://flex.madebymufffin.com/ – 2012-02-22 15:56:19

是的，我见过这个。问题是缩放图像以适应容器 – raklos 2012-02-22 16:03:49

这一个作为其不是很大，您要么必须使滑块占位大作为您的最大图像，或者如果您希望它们的大小相同，请在<img>标记上设置width和height属性以覆盖图像的实际尺寸。

如果宽高比不一致，那么您可能需要在jQuery/JavaScript中的服务器上实时计算缩小的尺寸。

来源

2012-02-22 14:28:18 Widor

第一个选项将不起作用，因为我不能确定diminsions将会是什么。手动设置宽度和高度时，如果您有较高的纵向图像，然后是较宽的横向图像，则会真正地混淆图像。 – raklos 2012-02-22 14:31:25

是的，这是计算出的宽度/高度将出现的位置。您可以找到图像的最大侧并计算出匹配滑块尺寸所需的增加/减少百分比，然后将相同比例应用于其他图像侧'（宽度或高度）。如果你有风景/画作的图像，而你又不想追赶它们，那么我认为它会看起来很笨拙，不管你怎么做。 – Widor 2012-02-22 14:35:00

在jQuery滑块中处理不同大小的图像

回答

相关问题