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

纯 JS+CSS 实现 Windows 安装界面“请坐和放宽”

  •  5
     
  •   renzhn · Mar 31, 2016 · 10242 views
    This topic created in 3872 days ago, the information mentioned may be changed or developed.
    Supplement 1  ·  Mar 31, 2016
    2.0: 加入了一个 CSS 实现的 Metro Loading Icon
    79 replies  •  2017-07-14 11:17:20 +08:00
    VmuTargh
    VmuTargh
    Mar 31, 2016
    1
    暴力膜蛤不可取, 无形膜蛤最续命!
    czmecho
    czmecho
    Mar 31, 2016 via Android
    2
    原来是膜法师的教徒。
    Phariel
    Phariel
    Mar 31, 2016
    3
    为了 url +1s
    jkjoke
    jkjoke
    Mar 31, 2016
    4
    兹慈
    mogita
    mogita
    Mar 31, 2016 via iPhone
    5
    这个命续得我给九分!
    fy
    fy
    Mar 31, 2016
    6
    膜的飞起,+1s
    ericls
    ericls
    Mar 31, 2016
    7
    OP 搞的这个东西啊 excited !
    xlvecle
    xlvecle
    Mar 31, 2016
    8
    天若有情天亦老, 你这一弄又一秒
    Twinkle
    Twinkle
    Mar 31, 2016
    9
    +1s
    BOYPT
    BOYPT
    Mar 31, 2016
    10
    蛤蛤蛤 excited
    不过字体不像,可以引入 webfont 改改
    eastpiger
    eastpiger
    Mar 31, 2016
    11
    打开之后先右键源代码、然后默默滚回去认真复习了一遍
    zhujinliang
    zhujinliang
    Mar 31, 2016
    12
    看的我两腿不由自主地跑了起来
    v1024
    v1024
    Mar 31, 2016
    13
    楼主 js 写的不错。
    pec
    pec
    Mar 31, 2016
    14
    有花屏闪屏 bug
    hjc4869
    hjc4869
    Mar 31, 2016
    15
    其实那个第一次登录的颜色渐变 UI 本来就是 HTML+js 写的(
    lution
    lution
    Mar 31, 2016
    16
    @pec 我还以为是故意的
    renzhn
    renzhn
    OP
    Mar 31, 2016
    17
    @BOYPT 中文 Webfont...?
    @pec patch welcome
    @hjc4869 消息来源?
    viator42
    viator42
    Mar 31, 2016
    18
    现在的年轻人,说着说着就膜起来了
    irainsoft
    irainsoft
    Mar 31, 2016
    19
    暴力膜蛤不可取
    iloveayu
    iloveayu
    Mar 31, 2016
    20
    这都可以膜,也是醉了。。。
    hjc4869
    hjc4869
    Mar 31, 2016
    21
    @renzhn C:\Windows\System32\oobe\FirstLoginAnim.html
    当然这个用浏览器是跑不动的……
    renzhn
    renzhn
    OP
    Mar 31, 2016
    22
    @hjc4869 长姿势
    renzhn
    renzhn
    OP
    Mar 31, 2016
    23
    @pec 你不会是硬件带不动导致的闪屏吧...我这边是由于切到别的页面过后脚本仍然会在跑导致的,我还不知道怎么解决
    Exin
    Exin
    Mar 31, 2016
    24
    +1s

    有个 bug : Chrome 切换到别的标签页 1 分钟左右再切回去,页面底色就会闪烁
    sciooga
    sciooga
    Mar 31, 2016
    25
    低级膜法师说闷声发大财,高级膜法师都知道原句是闷声大发财。
    lyragosa
    lyragosa
    Mar 31, 2016
    26
    建议在进入之前弹出一个免责声明。
    不然可能会出人命的。

    “本应用运行中可能出现剧烈的色彩 /光线变化,请调亮屋内灯光,并与显示器保持一定距离,如有不适,请立刻关闭页面并咨询你当地的医疗机构。”
    cname
    cname
    Mar 31, 2016
    27
    我也有点闪烁
    300
    300
    Mar 31, 2016
    28
    这是你发的?
    300
    300
    Mar 31, 2016
    29
    如果不是的话那就是被盗用了
    renzhn
    renzhn
    OP
    Mar 31, 2016
    30
    @winterbells 这个人在源码里还好留了标记: view-source:http://www.bilifuli.com/451.html 第四行
    我要不要在源码里加个 LICENSE ,加了好像也没什么卵用...
    300
    300
    Mar 31, 2016
    31
    @renzhn 需要删帖吗?我觉得他还有推广的嫌疑
    renzhn
    renzhn
    OP
    Mar 31, 2016
    32
    @winterbells 资辞,他明明可以引用原 URL 呀
    jk2K
    jk2K
    Mar 31, 2016
    33
    怎么会闪烁
    300
    300
    Mar 31, 2016
    34
    @renzhn
    done !
    你这网页好像有 bug ,从别的标签页切过来的时候会一直闪
    renzhn
    renzhn
    OP
    Mar 31, 2016
    35
    @winterbells 这个 bug 是由于切到别的页面过后脚本仍然会在跑导致的,我还不知道怎么解决
    SvenWong
    SvenWong
    Mar 31, 2016
    36
    干嘛要学一个老者说话
    ipeony
    ipeony
    Mar 31, 2016
    37
    那个闪的效果是故意的还是我的问题。。。
    oott123
    oott123
    Mar 31, 2016
    38
    关于脚本运行的问题,我没有看楼主的脚本,不过我猜可能是浏览器在后台的时候会把 setTimeout / setInterval 的间隔降低到 1000ms 一次导致的问题…
    tees
    tees
    Mar 31, 2016
    39
    切换之后的确会狂闪一下。
    renzhn
    renzhn
    OP
    Mar 31, 2016
    40
    @Exin
    @winterbells
    @ipeony
    @tees
    谢谢反馈, bug 已修,并且改善了 iOS Safari 的兼容性
    mailunion
    mailunion
    Mar 31, 2016
    41
    闷声大发财
    RqPS6rhmP3Nyn3Tm
    RqPS6rhmP3Nyn3Tm
    Mar 31, 2016 via Android
    42
    中文 webfont 可以试试百度前端团队出的 fontmin ,静态静态界面很好用。字体我记得是等线吧,就这几个字子集肯定不会超出 40 kb 。
    Fedor
    Fedor
    Mar 31, 2016❤️1
    43
    吓得我关了 Chrome
    jas0ndyq
    jas0ndyq
    Mar 31, 2016
    44
    猝不及防
    wjself
    wjself
    Mar 31, 2016
    45
    噗…樓主,我可以用的東西麼?
    renzhn
    renzhn
    OP
    Mar 31, 2016
    46
    @wjself 可以直接引用 URL ,你要干嘛呀?
    wjself
    wjself
    Mar 31, 2016
    47
    @renzhn 我可以抄袭么?(直接拿到自己的站点什么的…
    renzhn
    renzhn
    OP
    Mar 31, 2016
    48
    @wjself I'M ANGRY !你这样子是不行的!
    wjself
    wjself
    Mar 31, 2016
    49
    @renzhn 嗯,好吧…对不住咯…
    nayuxuohz
    nayuxuohz
    Mar 31, 2016
    50
    丧心病狂点 背景色动画和文字动画都可以 css 做啦
    jinwyp
    jinwyp
    Mar 31, 2016
    51
    那个 css loading 的动画怎么做的?
    renzhn
    renzhn
    OP
    Mar 31, 2016
    52
    @jinwyp 无可奉告
    Garantion
    Garantion
    Mar 31, 2016
    53
    Abrupt MO is not recommended!
    guoyida
    guoyida
    Mar 31, 2016
    54
    字体太丑了啊
    wjself
    wjself
    Mar 31, 2016
    55
    @jinwyp 那個的話是用貝塞爾曲線做的 css3animate ,技術上並不難
    wm5d8b
    wm5d8b
    Mar 31, 2016
    56
    interesting !
    好想 fork 一下
    wsph123
    wsph123
    Mar 31, 2016
    57
    坐到一半就摸上了!
    wbsdty331
    wbsdty331
    Mar 31, 2016 via Android
    58
    猝不及防
    hggg
    hggg
    Apr 1, 2016
    59
    显示的内容好,你们啊总想搞个大新闻~好评!
    philobscur
    philobscur
    Apr 1, 2016
    60
    右键之后 chrome 挂了...
    ChiangDi
    ChiangDi
    Apr 1, 2016 via Android
    61
    I'm angry
    murmur
    murmur
    Apr 1, 2016
    62
    纯 css 实现是坠吼的
    aitaii
    aitaii
    Apr 1, 2016
    63
    一言不合就+1s
    emlcj
    emlcj
    Apr 1, 2016
    64
    you can use css animation instead of js to change background
    cayley
    cayley
    Apr 1, 2016
    65
    好屌哦
    sakeven
    sakeven
    Apr 1, 2016
    66
    膜蛤
    yhyy135
    yhyy135
    Apr 1, 2016
    67
    成功续 1s
    haogefeifei
    haogefeifei
    Apr 1, 2016
    68
    怒看源码。。结果 +1s
    Shangxin
    Shangxin
    Apr 1, 2016
    69
    当然资瓷啦
    ebony0319
    ebony0319
    Apr 1, 2016
    70
    那些话怎么吊。
    lackar
    lackar
    May 28, 2016
    71
    怎样做成屏保呢? Mac 上
    lackar
    lackar
    May 28, 2016
    72
    可以不自动跳转微博吗?就可以当屏保了,如果还能自定义文字就更好了
    renzhn
    renzhn
    OP
    May 29, 2016
    73
    @lackar 把网页存下来稍作修改即可,把"window.location = http://" 改为 wordIndex == 0 可实现不跳转
    lackar
    lackar
    May 29, 2016
    74
    @renzhn 搞定!哈哈,不亦乐乎
    lackar
    lackar
    May 29, 2016
    75
    @renzhn 是不跳转了,但怎么能回到第一个循环播放呢?
    renzhn
    renzhn
    OP
    May 29, 2016
    76
    165 行:
    switchWord = function () {
    if (wordIndex >= words.length) {
    wordIndex = 0;
    }
    setWord();
    setTimeout(function () {
    wordIndex++;
    switchWord();
    }, wordDuration);
    };
    chshch
    chshch
    Sep 24, 2016
    77
    为了表示支持,我花了 59 秒钟看了这个网页..... 口.口
    qgb
    qgb
    May 23, 2017
    78
    @wsph123 吴思澎
    wsph123
    wsph123
    Jul 14, 2017
    79
    @qgb 咦?
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Privacy   ·   Solana   ·   862 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 143ms · UTC 20:56 · PVG 04:56 · LAX 12:56 · JFK 15:56
    ♥ Do have faith in what you're doing.