V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
Macv1994
V2EX  ›  问与答

瞎逛逛发现一个神奇的网站

  •  3
     
  •   Macv1994 · 265 天前 · 16249 次点击
    这是一个创建于 265 天前的主题,其中的信息可能已经有所发展或是发生改变。

    http://koalastothemax.com/

    请问各位大佬这网站是怎么实现的呀?感觉好神奇~

    122 条回复    2021-03-23 17:00:35 +08:00
    1  2  
    Ritter
        1
    Ritter   265 天前
    好玩
    endershadow
        2
    endershadow   265 天前
    牛逼
    cslive
        3
    cslive   265 天前
    挺好玩的,可以画画
    Leprax
        4
    Leprax   265 天前
    密集恐惧症预警 强迫症预警
    cslive
        5
    cslive   265 天前
    玩到最后才发现是个考拉
    Peterey
        6
    Peterey   265 天前   ❤️ 3
    玩到一半发现是一只考拉,这个要是能自定义图片就超级牛逼了
    liufish
        7
    liufish   265 天前
    理论上是不是所有的图片都可以做成这样
    sikariba
        8
    sikariba   265 天前
    好神奇
    barrelsoil
        9
    barrelsoil   265 天前
    可以自定义图片
    liyang5945
        10
    liyang5945   265 天前
    NB,感觉可以用来做博客头像之类的
    kisshere
        11
    kisshere   265 天前   ❤️ 3
    上次看见这个特效的时候,秦始皇还没统一六国吧,我记得当时是一个 js 特效下载的网站提供的 demo,最终形成的是一个蒙娜丽莎的像素图
    devwolf
        12
    devwolf   265 天前
    仿佛刮刮乐,svg 可以这样玩的嘛,我也要学
    jfzhangak
        13
    jfzhangak   265 天前
    强迫症慎入,不划出全图 ,不全部划开的话 心里难受
    Woood
        14
    Woood   265 天前
    function basicLoad(location) {
    var possible = ['koalas', 'koalas1', 'koalas2', 'koalas3'];
    var file = 'img/' + possible[Math.floor(Math.random() * possible.length)] + '.jpg'
    return {
    file: file,
    shownFile: location.protocol + '//' + location.host + location.pathname + file
    };
    }
    替换代码,应该就可以
    zhaokun
        15
    zhaokun   265 天前
    https://i.loli.net/2021/03/09/haw5zUltprf96Kj.png
    画到这地方卡住了,没反应
    Pogbag
        16
    Pogbag   265 天前
    强迫症患者的福音
    Macv1994
        17
    Macv1994   265 天前
    @Ritter
    @endershadow
    @cslive 哈哈哈哈 确实很好玩 我也玩了很久 就是想知道实现原理
    Macv1994
        18
    Macv1994   265 天前
    @cslive
    @Peterey 这个应该是宣传保护考拉的网站
    Macv1994
        19
    Macv1994   265 天前
    @sikariba
    @liyang5945
    @devwolf 是啊 我也感觉好神奇
    Macv1994
        20
    Macv1994   265 天前
    @Leprax
    @jfzhangak
    @Pogbag 哈哈哈哈 我也是强迫症之一
    tutustream
        21
    tutustream   265 天前
    都点完会跳出一个成就,大家加油!
    YAR
        22
    YAR   265 天前
    我还以为自己乱画画出了一只考拉, 后来才发现是底图
    copper20
        24
    copper20   265 天前
    f12 可看源码
    Ginray
        25
    Ginray   265 天前
    哈哈,把考拉的图换成妹子的 QQ 头像,高中的时候我就用过这招了
    chocovon
        26
    chocovon   265 天前
    按现在的技术,应该可以配合机器识图,玩“你刮我猜”了
    imgbed
        27
    imgbed   265 天前   ❤️ 1
    chiu
        28
    chiu   265 天前
    考拉:你在看什么。。。
    HiShan
        29
    HiShan   265 天前
    哈哈哈 有意思
    stephenxiaxy
        30
    stephenxiaxy   265 天前
    好家伙
    zhangyangkam1
        31
    zhangyangkam1   265 天前
    我记得之前碰到一个一样的网站,不过每次进去都是一张随机图片
    hugsky
        32
    hugsky   265 天前
    验证码的新思路
    YulChigga
        33
    YulChigga   265 天前
    @imgbed hhh
    Macv1994
        34
    Macv1994   265 天前 via Android
    @HiShan 哈哈哈哈😄强迫症患者福音 摸鱼又多了一个站点
    itowei
        35
    itowei   265 天前
    HTML 的网页特效,估计是作者展示特效用的
    FaiChou
        36
    FaiChou   265 天前   ❤️ 2


    我是有多无聊..

    M1 无压力
    KouShuiYu
        37
    KouShuiYu   265 天前
    Phariel
        38
    Phariel   265 天前 via iPhone
    牛逼 冬天可以用这个迅速暖手 🐶
    CallMeReznov
        39
    CallMeReznov   265 天前
    爷回青,GGMM 们都再网上冲浪吗
    RealKela
        40
    RealKela   265 天前
    浪费了我 10 分钟(ー ー;)
    crab
        41
    crab   265 天前
    @Peterey 底部不是可以输入图片链接吗
    lyqqqq
        42
    lyqqqq   265 天前
    我以为刮完会提示你说 第 XXXX 名无聊的人。
    结果是自定义图片
    “Awesome stuff! Now make your own and share the link.
    Paste an image URL bellow and press enter.”
    rootmaster
        43
    rootmaster   265 天前
    看来大家都是和我那么无聊,都这样搞出考拉
    icyalala
        44
    icyalala   265 天前
    很早以前记得有个用 Adobe AIR 做的 iOS App 完全一致。。
    Ultraman
        45
    Ultraman   265 天前 via Android
    看域名啊兄弟们,koala
    SbloodyS
        46
    SbloodyS   265 天前
    好玩
    Macv1994
        47
    Macv1994   265 天前
    @chiu 我在看这个强迫症长啥样 哈哈哈

    @Phariel 春天来了 冬天还会远吗?

    @RealKela 手速不行啊 大兄弟 hhh

    @SbloodyS 哈哈哈 看到各位玩的这么开心 我的分享才有意义

    @Ultraman 嗯 应该是个宣传考拉保护的网站吧
    Macv1994
        48
    Macv1994   265 天前
    @crab 哪里啊 没看到呀
    Macv1994
        49
    Macv1994   265 天前   ❤️ 1
    crab
        50
    crab   265 天前
    @Macv1994 操作完一次后,下面就会出现一个图片链接输入框。
    1507265844
        51
    1507265844   265 天前
    页面缩小狂甩鼠标,一分钟搞定 /doge
    18k
        52
    18k   265 天前
    竟然是考拉 最后不应该是一条鱼吗 真·摸鱼
    consul
        53
    consul   265 天前
    还挺流畅
    Biwood
        54
    Biwood   265 天前 via iPhone
    很多年前就有这效果了,用 D3.js ,页面底部有写
    ksedz
        55
    ksedz   265 天前
    有刮刮乐的感觉
    JoJoJoJ
        56
    JoJoJoJ   265 天前 via iPhone
    为啥我只看到个灰色圆圈,毫无互动
    Macv1994
        57
    Macv1994   265 天前
    @JoJoJoJ 鼠标移到圆圈上
    orangeTop
        60
    orangeTop   265 天前
    画多了 会卡
    learningman
        61
    learningman   265 天前
    @Macv1994 居然没关 autoindex,有点离谱
    jfzhangak
        62
    jfzhangak   265 天前
    @barrelsoil 怎么实现替换自己想要的图片呢
    gaigechunfeng
        63
    gaigechunfeng   265 天前
    我还是第一次见到。很好玩收藏了。
    awolfly9
        66
    awolfly9   265 天前
    借楼非前端问一下,这个项目要怎么启动呢?
    clone 项目后,直接点击 index 提示找不到 文件。

    Sorry, KoalsToTheMax could not load the image 'img/koalas1.jpg'
    phony2r
        67
    phony2r   265 天前
    用 svg 的话 dom 节点太多, 一些配置不好的机器可能会卡, 还是 canvas 性能好
    onionKnight888
        68
    onionKnight888   265 天前
    难受
    silencelixing
        69
    silencelixing   265 天前
    有没有大佬,搞出来一个可以显示任意图片的版本?
    jiurenbudai
        70
    jiurenbudai   265 天前
    @silencelixing 本身就可以
    Macv1994
        71
    Macv1994   265 天前
    @silencelixing 现在就可以 不过你要先把一张图画完 下面才会显示出来
    silencelixing
        73
    silencelixing   265 天前
    @Macv1994 我画完了还是没有
    silencelixing
        74
    silencelixing   265 天前
    @jiurenbudai 怎么操作,画完吗
    xuAN111
        75
    xuAN111   265 天前
    @Leprax 啥强迫症预警,强迫症不会有任何不舒服。这个东西和强迫症没关系
    silencelixing
        76
    silencelixing   265 天前
    @jiurenbudai
    @Macv1994
    还真可以,一个点都不能留,出现了!
    Leprax
        77
    Leprax   265 天前
    @xuAN111 可不止我说强迫症呢
    xuAN111
        78
    xuAN111   265 天前
    @Leprax 嗯,我指的是强迫症
    Geekerstar
        79
    Geekerstar   265 天前
    我太牛逼了,随手一画就画了个考拉😁
    ppxppx
        80
    ppxppx   265 天前 via Android
    @Peterey 全部画完就可以粘贴图片链接生成了
    xavierskip
        81
    xavierskip   265 天前
    N 年前玩过的网站又被人挖出来了。。我记得是可以自定义图片的。划完后就有一个自定义图片 url 的地方出现了。
    zgs1983
        82
    zgs1983   265 天前
    有点意思.
    Hoshinokozo
        83
    Hoshinokozo   265 天前
    个人猜测,考拉图片是背景,圆圈更像是一个遮罩层。

    可以反过来想,先准备一张图片,在上面生成一个遮罩层,遮罩层的每个像素点一开始是透明的,然后用鼠标的滑动事件设定通过某种算法生成 4 个更大的圆圈,如此往复,形成最开始的样子
    jamme
        84
    jamme   265 天前
    emmm...感觉类似于 MipMap~
    beanrobbie
        85
    beanrobbie   265 天前
    哈哈,怎么都是考拉
    a0000
        86
    a0000   265 天前 via Android
    @YAR 笑死我了。。233
    Macv1994
        87
    Macv1994   265 天前 via Android
    @beanrobbie 看域名啊兄弟们,koala
    linhongye
        88
    linhongye   265 天前 via Android
    池化
    Latin
        89
    Latin   265 天前
    KouShuiYu
        91
    KouShuiYu   265 天前
    lvwzhen
        92
    lvwzhen   265 天前
    这个古早网站有快十年了吧,记得上大学时就有了。
    用 「 http://koalastothemax.com/?image_url 」的格式可以访问其他图片。
    ganbuliao
        93
    ganbuliao   265 天前
    用的 d3 做的特效啊
    fanjianhang
        94
    fanjianhang   265 天前
    治好了我的鼠标手~
    adjusted
        95
    adjusted   265 天前
    fgk
        97
    fgk   265 天前
    我的风扇♾
    GrayXu
        98
    GrayXu   265 天前
    这不就是池化操作的反过程嘛
    lbyo
        99
    lbyo   265 天前
    下方这个链接点进去好阴森啊,生怕有个戴着类似哥布林大鼻子面具的人跳出来
    1  2  
    关于   ·   帮助文档   ·   API   ·   FAQ   ·   我们的愿景   ·   广告投放   ·   感谢   ·   实用小工具   ·   3018 人在线   最高记录 5497   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 29ms · UTC 10:45 · PVG 18:45 · LAX 02:45 · JFK 05:45
    ♥ Do have faith in what you're doing.