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

六一儿童节到了，快给你喜欢的女孩念一首诗吧

  •   
  •   pseudo · 2016-06-01 10:25:27 +08:00 · 5002 次点击
    这是一个创建于 3096 天前的主题，其中的信息可能已经有所发展或是发生改变。

    标题的两句话好像没有什么关联，哈哈。 突发奇想写的一个简单的 css3 动画页面， Demo 里输入 xxx 然后按 Enter 即可开始。

    不嫌弃简陋的话，尽情拿去用吧，可以改成你想写的各种文字。

    Github Demo

    利用 jQuery + webkitAnimationEnd 进行动画的流程控制，感觉不够优美。想请教一下这类 css3 动画有没有什么更好的控制方法或者还不错的框架。

    如果顺手，点一下 star 吧。^_^

    第 1 条附言  ·  2016-06-01 16:29:51 +08:00
    告诉我你的名字那里输入 xxx 按 Enter 就可以看效果啦，为什么大家都把我第二句话忽略了😂
  • CSS3
  • 动画
  • Demo
  • jquery
    54 条回复  •  2016-06-04 11:36:28 +08:00
    RqPS6rhmP3Nyn3Tm
        1
    RqPS6rhmP3Nyn3Tm  
       2016-06-01 11:36:48 +08:00 via Android
    403 forbidden
    404 not found
    primroses
        2
    primroses  
       2016-06-01 11:54:36 +08:00
    快说 你的心上人是谁

    对不起，你不是我的心上人
    t40462860
        3
    t40462860  
       2016-06-01 12:22:53 +08:00
    对不起，你不是我的心上人

    看不了效果
    funky
        4
    funky  
       2016-06-01 12:23:40 +08:00
    输入 xxx
    noe132
        5
    noe132  
       2016-06-01 12:24:10 +08:00 via Android
    对不起 。。。。。😂
    Tyler1989
        6
    Tyler1989  
       2016-06-01 12:29:54 +08:00 via Android
    楼主暗恋我
    UnisandK
        7
    UnisandK  
       2016-06-01 12:31:47 +08:00   ❤️ 1
    然后你喜欢的妹子顺手输入了自己的昵称，看到了“对不起，你不是我的心上人”，全剧终
    Zohar
        8
    Zohar  
       2016-06-01 12:47:50 +08:00 via Android
    @primroses
    @t40462860
    看一下 script.js 就可以知道，输入 xxx 即可。
    tabris17
        9
    tabris17  
       2016-06-01 12:49:29 +08:00
    花径不曾缘客扫，蓬门今始为君开。
    天生一个仙人洞，无限风光在险峰。
    yalay
        10
    yalay  
       2016-06-01 12:53:18 +08:00
    有意思， star 了
    416877140
        11
    416877140  
       2016-06-01 12:58:59 +08:00   ❤️ 3
    苟利国家生死以
    岂因祸福避趋之
    0x1406F40
        12
    0x1406F40  
       2016-06-01 13:01:15 +08:00
    日后吟湿
    Love4Taylor
        13
    Love4Taylor  
       2016-06-01 13:02:37 +08:00
    @UnisandK 所以得把所有可能的名称都写上去么 233333
    iamwb
        14
    iamwb  
       2016-06-01 13:09:06 +08:00 via Android
    我说另请高明吧
    我也实在不是
    fhefh
        15
    fhefh  
       2016-06-01 13:11:50 +08:00
    输入 xxx
    foreach
        16
    foreach  
       2016-06-01 13:12:20 +08:00
    看到这个过场动画，脑子里立马浮现出了 beyond 海阔天空的旋律，应该再加个背景音乐。
    Artoria
        17
    Artoria  
       2016-06-01 13:19:54 +08:00
    对不起，你不是我心上人
    pseudo
        18
    pseudo  
    OP
       2016-06-01 16:47:36 +08:00
    @BXIA 域名解析是万网的，不知道你为什么会这样诶
    @primroses
    @t40462860
    @noe132
    @Artoria 输入 xxx 啦
    @Tyler1989 哈哈哈哈哈为什么
    @UnisandK 哈哈哈哈这就是悲剧了，不过可以看看 Github 上面的 readme 的最后一句话哈哈哈
    @yalay 谢谢！
    @Zohar 谢谢还看了我丑陋的代码哈哈
    @Love4Taylor 哈哈哈哈要是妹子是程序员就
    @foreach 当时几个小时写完后来就没管了，谢谢你的建议～
    Artoria
        19
    Artoria  
       2016-06-01 17:27:15 +08:00
    @pseudo 只能 xxx 不能 xx 吗
    pseudo
        20
    pseudo  
    OP
       2016-06-01 17:29:10 +08:00
    @Artoria 可以改代码改成任意都可以通过呀
    Artoria
        21
    Artoria  
       2016-06-01 17:29:54 +08:00
    @pseudo 我去， 原来是 xxx 这三个。我还以为是随便三个字。。
    ynlwys
        22
    ynlwys  
       2016-06-01 18:14:26 +08:00 via Android
    问心上人人是谁的，智商都下线了😂😂😂
    pseudo
        23
    pseudo  
    OP
       2016-06-01 18:15:44 +08:00 via iPhone
    @Artoria 哈哈哈哈难怪我说怎么都忽略我的话
    @ynlwys 哈哈哈哈哈哈
    sorcerer
        24
    sorcerer  
       2016-06-01 18:16:51 +08:00 via iPhone
    不错 收了 给妹纸看 再加个音乐
    ys0290
        25
    ys0290  
       2016-06-01 18:17:07 +08:00 via iPhone
    果真什么日子都能过成情人节
    7z7
        26
    7z7  
       2016-06-01 18:19:39 +08:00
    黑屏 xxx 回车无反应
    pseudo
        27
    pseudo  
    OP
       2016-06-01 18:28:59 +08:00 via iPhone
    @sorcerer 谢谢～
    @ys0290 哈哈哈只是今天想发然后强行凑了个节日
    @7z7 那个事件可能只有 webkit 内核的浏览器支持
    BigPa
        28
    BigPa  
       2016-06-01 18:37:19 +08:00
    苟利国家生死以，岂因祸福趋避之。
    lanpong
        29
    lanpong  
       2016-06-01 18:39:17 +08:00
    可以拿走吗？
    pseudo
        30
    pseudo  
    OP
       2016-06-01 18:39:21 +08:00 via iPhone
    @416877140
    @iamwb
    @BigPa
    暴力 不可取
    pseudo
        31
    pseudo  
    OP
       2016-06-01 18:41:01 +08:00 via iPhone
    @lanpong 请随意拿走，反正那个女孩已经变成 ex 了哈哈哈哈哈
    shooter
        32
    shooter  
       2016-06-01 19:08:37 +08:00
    唤起窗前尚宿醒，啼鹃催去又声声。
    丹青旧誓相如札，禅棍经时杜牧情。
    别后相思空一水，重来回首已三生。
    云阶月地依然在，旧逐空香百遍行。
    lanpong
        33
    lanpong  
       2016-06-01 19:48:07 +08:00
    @pseudo 哈哈哈哈哈哈，我的那个女孩也变成 ex 了
    songkaiape
        34
    songkaiape  
       2016-06-01 20:43:37 +08:00
    嗯，不是很懂前端，但是想问下怎么能把这个动画改成兼容非 webkit 内核的动画呢？总不好跟妹子说，来先装个 GOOGLE 浏览器。。然后打开微信里那条网址。。
    brucewzp
        35
    brucewzp  
       2016-06-01 20:59:06 +08:00
    楼主有心啊
    pseudo
        36
    pseudo  
    OP
       2016-06-01 21:38:57 +08:00
    @lanpong 哈哈哈哈，好在现在的女孩更棒
    @songkaiape 我 css3 动画接触的少，所以也想问有没有其他方法呢
    @brucewzp 哈哈谢谢
    helloSwift
        37
    helloSwift  
       2016-06-01 21:51:50 +08:00
    好玩 哈哈哈哈
    Senorsen
        38
    Senorsen  
       2016-06-01 21:57:31 +08:00
    效果挺好的，简单漂亮
    songkaiape
        39
    songkaiape  
       2016-06-01 23:14:09 +08:00
    @pseudo $('#anim').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function() 我查到说这个 Jquery 自带的 one 可以保证兼容，但是好像还是不行
    ppppayme
        40
    ppppayme  
       2016-06-02 04:40:45 +08:00
    脸过不了儿童节，胸可以过啊。
    体重过不了儿童节，身高可以过啊。
    年龄过不了儿童节，智商可以过啊。
    人生经验过不了儿童节，性经验可以过啊。
    shippo7
        41
    shippo7  
       2016-06-02 04:59:05 +08:00 via iPhone
    萝莉有三好
    轻音身柔易推倒
    ynlwys
        42
    ynlwys  
       2016-06-02 07:16:31 +08:00 via Android
    部分手机输入法的完成前往无法提交输入框的名字， Google 输入法可以，百度不行😂😂😂
    SlipStupig
        43
    SlipStupig  
       2016-06-02 08:45:09 +08:00
    我的心上人还不知道在哪里，也许还在上一个动物园呢
    hqs123
        44
    hqs123  
       2016-06-02 10:08:17 +08:00
    楼上都挺搞笑的哈哈
    pseudo
        45
    pseudo  
    OP
       2016-06-02 11:42:04 +08:00
    @helloSwift
    @Senorsen 谢谢你们！
    @songkaiape 我也不是很清楚诶，自己用 Chrome 就偷了个懒
    @ynlwys 我是用 keycode==13 判断的，可能不同输入法有不同吧
    @SlipStupig 哈哈哈哈哈
    @hqs123 哈哈哈哈
    taxiangdeni
        46
    taxiangdeni  
       2016-06-02 12:12:50 +08:00
    对不起，你不是我的心上人
    andyhuzhill
        47
    andyhuzhill  
       2016-06-02 15:25:10 +08:00
    居然在作者的简历里发现了母校的名字
    andyhuzhill
        48
    andyhuzhill  
       2016-06-02 15:29:01 +08:00
    @andyhuzhill 我是说我的母校　话没说清楚
    StargazerWikiv
        49
    StargazerWikiv  
       2016-06-02 17:41:07 +08:00
    意识输入了楼主的昵称，结果原来楼主是有节操的人。
    pseudo
        50
    pseudo  
    OP
       2016-06-02 19:38:48 +08:00
    @andyhuzhill 哈哈哈哈校友啊
    @StargazerWikiv 哈哈哈当然我不会那么
    t40462860
        51
    t40462860  
       2016-06-03 09:36:51 +08:00
    输入 xxx 然后啥反应都没有呀。。
    pseudo
        52
    pseudo  
    OP
       2016-06-03 10:31:29 +08:00
    @t40462860 按 Enter 啦
    andyhuzhill
        53
    andyhuzhill  
       2016-06-03 18:11:38 +08:00 via Android
    @pseudo 并不是校友 我是 csust 的
    pseudo
        54
    pseudo  
    OP
       2016-06-04 11:36:28 +08:00
    @andyhuzhill 哈哈哈那也是有缘人
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2881 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 25ms · UTC 11:20 · PVG 19:20 · LAX 03:20 · JFK 06:20
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.