1

我已经开始使用 zurb 的 Foundation 3,但我的滑块在左侧有带有文本的幻灯片,在右侧有一个图像(而不仅仅是图像和顶部的标签)。

当我减小浏览器窗口的大小时,除了滑块的高度之外,它都适合。

我们需要的是在小型浏览器上使滑块更高(它需要是相同的滑块 - 不是替代品)。

我知道流体滑块中有流体选项,我怀疑如果我改变它,就足以解决这个问题。

我该如何做到这一点?

以下是我的滑块 HTML 代码:

<div class="row">
  <div class="twelve columns">
    <div id="slider">
        <!-- *** This is the slider that needs to fit smaller browsers ***-->
        <div class="row" style="background-color:White;">
            <div class="six columns">
                <h2>Title</h2>
                <div class="summary">
                    This is the summary is the summary is the summary is the summary is the summary is the summary is the summary.
                    <a href="javascript:void(0);">Learn more</a>
                </div>
                <div class="some-thumbnails">
                    <img src="http://placehold.it/100x100&text=[thumbnail]" />
                    <img src="http://placehold.it/100x100&text=[thumbnail]" />
                    <img src="http://placehold.it/100x100&text=[thumbnail]" />
                </div>
            </div>
            <div class="six columns">
                <img src="http://placehold.it/550x250&text=[img 1]" />
            </div>
        </div>
        <img src="http://placehold.it/1000x400&text=[img 1]" />
    </div>
</div>

<hr />

4

1 回答 1

1

轨道由轨道插件使用的某个插件生成的图像控制。我所做的是更改插件以获取最高幻灯片的左右部分的高度(更改为手机视图时),然后将 data-src 设置为“holder.js/[width]x[height]”并调用 Holder.run() 方法。

于 2012-10-04T08:52:03.123 回答