4

我正在尝试复制谷歌移动网站的一部分。

http://www.imgur.com/9DdQz.png

他们网站底部附近的区域有他们的“地点”菜单,您可以在其中使用手指水平滚动浏览不同的选项,然后点击您想要的图标。

我想复制的功能是水平滚动,同时将页面设置为特定宽度,这样窗口就不会只是重新调整大小,从而否定滚动功能。

我尝试使用适用于 Chrome 的 Android 远程调试工具获取用于创建此代码的代码副本,但我找不到该网站这一部分的特定代码,我认为它必须通过单独的 .js 加载文件。我也做了足够多的谷歌搜索,尝试另一个搜索字符串的前景与将我的头撞到砖墙上试图重新装修我的工作场所一样。简而言之,我迷路了,超出了我的深度,正在寻求帮助。任何指针或帮助将不胜感激。

提前致谢。

4

1 回答 1

4
<div id="scrollcontainer" >
    <div id="scrollplane" >
         <a class="nav" href="?">Link 1</a>
         <a class="nav" href="?">Link 2</a>
         <a class="nav" href="?">Link 3</a>
    </div>
    </div> 

CSS:

#scrollcontainer {
        width: 100%;
        overflow-x: auto; 
        overflow-y: hidden;
        height: // some height
}

#scrollplane { 
 height: // less than scroll container ;
 width: // greater than scroll container;

}

然后我会建议你的链接在滚动平面上相对定位。这应该在移动浏览器上实现所需的效果,但会在桌面上显示滚动条

于 2012-12-14T20:43:24.307 回答