• 请不要在回答技术问题时复制粘贴 AI 生成的内容
shenyuanv
V2EX  ›  程序员

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

  •  
  •   shenyuanv ·
    shenyuanv · Oct 9, 2013 · 4493 views
    This topic created in 4632 days ago, the information mentioned may be changed or developed.
    http://csc.xdsec.org/
    类似于这个网站的幻灯片效果,页面往下滚动的时候幻灯片的图片是不会跟着往上移动,这个效果是用什么原理实现的?是否有现成的库可以调用?
    另外这个网站加载未完成时能显示加载百分比,这个又是如何实现呢?

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

    这个站加载百分比用的是jpreLoader插件
    slixurd
        2
    slixurd  
       Oct 9, 2013
    请看源代码
    /* ==================================================
    Slider Options
    ================================================== */

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

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

    @ijse 多谢啦!`position: fixed;`我去研究下这个属性……
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   1163 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 30ms · UTC 18:05 · PVG 02:05 · LAX 11:05 · JFK 14:05
    ♥ Do have faith in what you're doing.