V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
shenyuanv
V2EX  ›  程序员

[求前端高手解答] 图片固定位置的幻灯片效果如何实现(有实例)

  •  
  •   shenyuanv ·
    shenyuanv · 2013-10-09 22:30:08 +08:00 · 3770 次点击
    这是一个创建于 4062 天前的主题,其中的信息可能已经有所发展或是发生改变。
    http://csc.xdsec.org/
    类似于这个网站的幻灯片效果,页面往下滚动的时候幻灯片的图片是不会跟着往上移动,这个效果是用什么原理实现的?是否有现成的库可以调用?
    另外这个网站加载未完成时能显示加载百分比,这个又是如何实现呢?

    前端菜鸟求各路高手解答~
    3 条回复    1970-01-01 08:00:00 +08:00
    ijse
        1
    ijse  
       2013-10-09 22:50:25 +08:00
    图片展示 那层设置了`position: fixed;` , 现成的库不知道, 大概有吧。。

    这个站加载百分比用的是jpreLoader插件
    slixurd
        2
    slixurd  
       2013-10-09 22:52:45 +08:00
    请看源代码
    /* ==================================================
    Slider Options
    ================================================== */

    BRUSHED.slider = function(){
    $.supersized({

    supersized是一个现成的库
    http://www.buildinternet.com/project/supersized/
    shenyuanv
        3
    shenyuanv  
    OP
       2013-10-10 09:19:59 +08:00
    @slixurd 我之前也在源码上看到这个surpersized库了,但是在官网DEMO中没有图片固定效果的演示,感觉跟其他幻灯片的库差不多,所以感觉是不是作者在这个库的基础上修改过。

    @ijse 多谢啦!`position: fixed;`我去研究下这个属性……
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2838 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 26ms · UTC 14:28 · PVG 22:28 · LAX 06:28 · JFK 09:28
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.