爱意满满的作品展示区。
Kaiyuan

bootstrap.footnotes.js 改良,不再依附 Bootstrap

  •  
  •   Kaiyuan ·
    Kaiyuan · Jun 12, 2013 · 3610 views
    This topic created in 4750 days ago, the information mentioned may be changed or developed.
    很久之前找到一个很喜欢的注释提示的效果,不过是依赖 Bootstrap,对于不用 Bootstrap 的网站很无奈。

    bootstrap.footnotes.js: http://taitems.github.io/UX-Lab/BootstrapFootnotes/index.html

    后来就自己查手册,上 Google 制作了一个仅依赖 jQuery 版本,而且除了元素上方弹出注释之外,添加了其他三个方向的窗口。


    昨天做了调整,可以自动根据元素位置在原本注释弹出方式不适用的时候自动切换到其他方向弹出注释。
    例如,原本是设置上方弹出注释,当页面滚动到一定时候上方不够空间显示注释窗口自动切换成在元素下放弹出。
    Demo: http://kaiyuan.github.io/footnotes.js/sup.html
    Github: https://github.com/Kaiyuan/bootstrap.footnotes.js

    注意的是,可能我变量的命名太随便,或许会和其他插件或者你们写的变量有冲突。

    我现在还不了解实时获取当前窗口高宽,所以当浏览器改变窗口大小时候没有刷新页面没能正确判断合适方式显示注释。



    前两天仿照 http://elenagreta.com/ 上的画框做了一个 CSS3 版本 http://cdpn.io/BIbru
    4 replies    1970-01-01 08:00:00 +08:00
    kk71
        1
    kk71  
       Jun 12, 2013
    顶一下~
    vixvix
        2
    vixvix  
       Jun 12, 2013
    感谢后再赞一个。
    yueyoum
        3
    yueyoum  
       Jun 13, 2013
    cool !
    davepkxxx
        4
    davepkxxx  
       Jun 13, 2013
    收藏了
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   6061 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 47ms · UTC 02:32 · PVG 10:32 · LAX 19:32 · JFK 22:32
    ♥ Do have faith in what you're doing.