1

我将使用 CSS 寻找类似于经典 iPhone“滑动显示”外观的东西一个例子

我的目标代码结构类似于

<ul>
    <li>Top Content</li>
    <li>Bottom Content</li>
</ul>

因此，使用 javascript 和 css 转换我可以让顶层滑开并显示底层。我尝试将底层设置为顶部：-（li 的高度）和 z-index -1 哪种工作方式（它们确实重叠）除了由于这个原因，div 之间有很大的空间（margin 0 padding 0 没有不解决）

我还能如何实现这一点？

4

2 回答 2

1

我真的认为使用相同的列表来完成这是一个糟糕的主意你应该只使用两个不同的 ul 的http://jsfiddle.net/8JYA2/

<ul class="list-1">
  <li>One</li>
  <li>Two</li>
  <li>Three</li>
  <li>Four</li>
</ul>
<ul class="list-2">
  <li>Back One</li>
  <li>Back Two</li>
  <li>Back Three</li>
  <li>Back Four</li>
</ul>

我可能错了，但您为什么要针对该代码结构？

于 2013-01-15T19:11:17.113 回答
0

经过一些帮助和试验，我现在有了一个可行的解决方案。

解决方案是制作一个列表，但每 li 放置两个 div 并将 div 分层。然后使用javascript，修改div上的左右百分比，让顶部的div滑掉。代码看起来像这样

<ul>
  <li><div>Top Content</div></li>
  <li><div>Bottom Content</div></li>
</ul>

结合我之前关于在顶部内容上将 z-index 设置得更高的想法，它效果很好。

于 2013-01-20T16:13:16.847 回答