V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
jame
V2EX  ›  前端开发

Apple 产品页头部固定技术

  •  
  •   jame · 2016-04-24 22:17:59 +08:00 · 1972 次点击
    这是一个创建于 2941 天前的主题,其中的信息可能已经有所发展或是发生改变。

    使用 iPhone 浏览产品页时, logo 下面那行在滚动后固定定位,而且很顺滑,这是怎么做到的?求教。

    产品页链接: http://www.apple.com/cn/iphone-6s/

    6 条回复    2016-04-24 23:46:24 +08:00
    atan
        1
    atan  
       2016-04-24 22:43:10 +08:00
    levon
        2
    levon  
       2016-04-24 22:49:37 +08:00
    我觉得比较人性化的做法是当你要往上滚的时候,头部才显示出来。
    audi
        3
    audi  
       2016-04-24 22:57:28 +08:00 via iPhone
    页面中的 iPhone 模型才顺滑
    jame
        4
    jame  
    OP
       2016-04-24 23:08:44 +08:00
    @atan 这个不支持手机。
    @levon 同感。
    atan
        5
    atan  
       2016-04-24 23:16:43 +08:00
    看了下样式,他用了 position:sticky 这个 css3 属性,因此比较流畅,但是目前只有 firefox 和 safari 支持,所以 chrome , IE 下还是需要 JS 完成,效果就没这么好了
    jame
        6
    jame  
    OP
       2016-04-24 23:46:24 +08:00
    @atan 看到,谢谢。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1006 人在线   最高记录 6547   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 22ms · UTC 20:18 · PVG 04:18 · LAX 13:18 · JFK 16:18
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.