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

¥200 求高手。 求提取一个 html 元素的 CSS (JS),自己搞不定

  •  1
     
  •   catsky ·
    catsky · 2019-09-23 08:53:04 +08:00 · 10444 次点击
    这是一个创建于 1649 天前的主题,其中的信息可能已经有所发展或是发生改变。

    目标:提取 https://alexperryhotelandapartments.com.au 左下角的 “PRICE CHECK NOW" 那个”按钮“html,css ( js ),放在自己的一个 html 页面,达到一样的外观和动画效果。不需要提取点击后出现页面的内容。如果动画效果是用 css 实现的,js 不提取也没关系。

    要点

    1. 提取后,要有清晰,整洁的 html, css (js)结构,方便我以后进行定制
    2. 提取后所有 css ( js)不能引用第三方网站
    3. 提取后,比如放在这个 html 文件里 sample.html, 我可以通过 python -m SimpleHTTPServer 预览效果

    Markdown

    76 条回复    2021-05-21 07:56:44 +08:00
    xnode
        1
    xnode  
       2019-09-23 09:00:03 +08:00
    ..... 老哥 手工写就行了,这个没什么复杂的
    www6688w
        2
    www6688w  
       2019-09-23 09:00:38 +08:00
    所以呢,,联系方式呢 ( ̄△ ̄;)
    www6688w
        3
    www6688w  
       2019-09-23 09:00:57 +08:00
    抓 css 很简单吧
    catsky
        4
    catsky  
    OP
       2019-09-23 09:01:14 +08:00
    @xnode 哥,主要我 css 技术不过关啊,😂
    Sor
        5
    Sor  
       2019-09-23 09:01:38 +08:00
    怎么联系你呢?
    taoche
        6
    taoche  
       2019-09-23 09:03:48 +08:00   ❤️ 1
    如果你可以帮我一个 ruby 的忙,作为交换我可以免费帮你处理这个问题
    shaojz2005
        7
    shaojz2005  
       2019-09-23 09:04:01 +08:00
    就是一个异形的按钮和一个类似呼吸的动态效果嘛
    shaojz2005
        8
    shaojz2005  
       2019-09-23 09:04:24 +08:00
    这个没有 js,就是 css 实现的效果
    catsky
        9
    catsky  
    OP
       2019-09-23 09:04:37 +08:00
    联系我📮好了,多谢了
    ee5bf2b7c593561f3cf772350015d3a8
    redbuck
        10
    redbuck  
       2019-09-23 09:06:19 +08:00   ❤️ 27
    .box {
    width: 500px;
    height: 200px;
    background-color: #8e764a;
    position: absolute;
    bottom: -100px;
    left: -50px;
    transform: rotate(5deg);
    animation: popup 1s infinite;
    }

    @keyframes popup {
    0% {
    background: #8e764a;
    bottom: -105px;
    }
    50% {
    background: #80673b;
    bottom: -100px;
    }
    100% {
    background: #8e764a;
    bottom: -105px;
    }
    }


    html

    <div class="box"></div>
    yunhu
        11
    yunhu  
       2019-09-23 09:08:11 +08:00
    右键 审查元素 查看源代码
    catsky
        12
    catsky  
    OP
       2019-09-23 09:13:20 +08:00
    不好意思,用这个 email

    emhkaHVpQGdtYWlsLmNvbQ==
    Sor
        14
    Sor  
       2019-09-23 09:14:26 +08:00   ❤️ 2
    http://139.9.90.195/sample.html
    livnimasileid
        15
    livnimasileid  
       2019-09-23 09:15:53 +08:00
    @redbuck #10 我的 200 元泡汤了
    catsky
        16
    catsky  
    OP
       2019-09-23 09:15:56 +08:00
    @redbuck 哇塞 你太厉害,短短几行
    Sor
        17
    Sor  
       2019-09-23 09:17:58 +08:00
    @redbuck 给力 赞
    telami
        18
    telami  
       2019-09-23 09:18:03 +08:00
    各路神仙
    catsky
        19
    catsky  
    OP
       2019-09-23 09:21:57 +08:00   ❤️ 1
    @redbuck 把你的微信私信给我吧,转钱给你。 你是第一个给出方案的,而且简洁好用,👍

    如果是稍微做下 responsive 就更好了
    VancleefL
        20
    VancleefL  
       2019-09-23 09:22:11 +08:00
    我为什么没早点看到这条帖子
    LZYBB
        21
    LZYBB  
       2019-09-23 09:22:52 +08:00
    @redbuck
    sugars
        22
    sugars  
       2019-09-23 09:24:36 +08:00
    唉,来晚了,不然 200 到手
    justrand
        23
    justrand  
       2019-09-23 09:26:04 +08:00   ❤️ 2
    @Sor 建议不要把 ip 暴露哦,把你的放在这里就行了
    效果: https://output.jsbin.com/roqicarike
    代码: https://jsbin.com/roqicarike/edit?html,css,js,output
    redbuck
        24
    redbuck  
       2019-09-23 09:36:04 +08:00   ❤️ 3
    @catsky
    哈哈,不用了,反正也是闲着
    Motoi
        25
    Motoi  
       2019-09-23 09:36:12 +08:00   ❤️ 1
    来晚了
    supersonic13
        26
    supersonic13  
       2019-09-23 09:38:22 +08:00
    钱真好赚。。。
    Sor
        27
    Sor  
       2019-09-23 09:38:39 +08:00
    @justrand 嘿嘿 感谢! 闲置小鸡马上到期了
    redbuck
        28
    redbuck  
       2019-09-23 09:39:11 +08:00
    @livnimasileid 哈哈

    @catsky 其实基本是原网站的
    momocraft
        29
    momocraft  
       2019-09-23 09:39:52 +08:00
    找人给钱是好文明
    hyy1995
        30
    hyy1995  
       2019-09-23 10:10:47 +08:00
    哇,这钱太容易赚了吧。。真的很简单的。。。
    hitoriga
        31
    hitoriga  
       2019-09-23 10:11:35 +08:00
    @redbuck 哇 大佬 nb !
    xutao881
        32
    xutao881  
       2019-09-23 10:34:34 +08:00
    专业前端,ODI0MzMyMzYy


    以后有这种活直接打钱,哈哈哈哈
    violetlai
        33
    violetlai  
       2019-09-23 10:45:00 +08:00
    f12 直接就看到啊
    123s
        34
    123s  
       2019-09-23 10:45:02 +08:00
    送钱啊
    wolfan
        35
    wolfan  
       2019-09-23 10:48:00 +08:00
    lz 好心人吖,这样子发红 @包,下次一定要喊上俺吖
    aapon
        36
    aapon  
       2019-09-23 10:49:17 +08:00
    真是送钱啊
    v2elephant
        37
    v2elephant  
       2019-09-23 10:56:43 +08:00
    老哥,谈钱就有点看不起我们了
    catsky
        38
    catsky  
    OP
       2019-09-23 11:03:28 +08:00
    @redbuck 多谢啊,只能多送你几个铜板了
    v3xe
        39
    v3xe  
       2019-09-23 11:28:02 +08:00 via iPhone
    喜欢你这样有价值的问题,希望多来两个给我。
    grewer
        40
    grewer  
       2019-09-23 11:31:55 +08:00
    这么简单还能得 200..
    wuweijia
        41
    wuweijia  
       2019-09-23 11:46:50 +08:00
    在 v 站这个级别的技术问题 谈钱看不起人啊
    zxcslove
        42
    zxcslove  
       2019-09-23 13:21:01 +08:00   ❤️ 3
    《子贡赎人》
    ugu
        43
    ugu  
       2019-09-23 13:22:25 +08:00
    f12,自己看
    melvin
        44
    melvin  
       2019-09-23 15:05:35 +08:00
    2 行代码搞定的事情,这居然还花钱买,原谅我笑 cry ~
    gbin
        45
    gbin  
       2019-09-23 15:10:54 +08:00 via Android   ❤️ 13
    不花钱会被骂伸手党,花钱少会被骂看不起程序员的时间,花钱“多”了还要被骂看不起人?

    V 站要求真高
    catsky
        46
    catsky  
    OP
       2019-09-23 15:35:09 +08:00   ❤️ 1
    报酬参考的是澳洲初中级程序员时薪,我本来预估这个至少也得半小时-1 小时的工作量,现在发现技术水平限制了我的想象 😆
    LlvlDd
        47
    LlvlDd  
       2019-09-23 15:50:29 +08:00
    @catsky #46 CSS 已然成为一门玄学
    cjc2017
        48
    cjc2017  
       2019-09-23 18:06:02 +08:00
    @catsky 老哥以后这种脏活累活请直接 @我
    scukmh
        49
    scukmh  
       2019-09-23 18:28:19 +08:00 via iPhone
    以后有这种好活直接打钱就完事了🥺
    gIrl1990
        50
    gIrl1990  
       2019-09-23 18:30:33 +08:00
    脏活累活我拿手滴,让我来。
    qiukun
        51
    qiukun  
       2019-09-23 18:59:41 +08:00
    @catsky #46 初中级
    hzhengy
        52
    hzhengy  
       2019-09-23 19:43:55 +08:00 via Android
    来晚了
    strugglexiang
        53
    strugglexiang  
       2019-09-23 19:53:44 +08:00
    @justrand 老哥有点强啊,我怎么写不出来
    MIMEIK
        54
    MIMEIK  
       2019-09-23 19:57:48 +08:00
    我还以为 CSS 有啥骚操作?真就白给啊
    jason19659
        55
    jason19659  
       2019-09-24 01:01:24 +08:00
    下次带我一个
    KasuganoSoras
        56
    KasuganoSoras  
       2019-09-24 05:21:24 +08:00   ❤️ 3
    给你完美还原了一下,纯手工写的,搞了一个多小时,前端比较渣没办法。。

    Demo: https://cdn.zerodream.net/code/test.html
    源码: https://github.com/kasuganosoras/SomeCodes/blob/master/v2ex_603187.html

    效果图:
    KasuganoSoras
        57
    KasuganoSoras  
       2019-09-24 05:28:17 +08:00   ❤️ 1
    因为有点困了所以就没做移动端适配。。凑合着用吧,如果有需要其他的私信我 QQ 204034
    catsky
        58
    catsky  
    OP
       2019-09-24 07:27:58 +08:00
    @KasuganoSoras 👍,多谢,你的网站我在澳洲打不开 :)
    KasuganoSoras
        59
    KasuganoSoras  
       2019-09-24 07:34:16 +08:00
    @catsky #58 那就直接看 github 上的源码吧,我有两台国内的服务器没 peer 国外,所以打不开,你直接 clone 到本地打开 html 就可以看到了。
    Junn
        60
    Junn  
       2019-09-24 07:48:29 +08:00 via iPhone
    突然觉东西这东西好值钱
    BarZu
        61
    BarZu  
       2019-09-24 08:25:46 +08:00 via Android
    快点加楼主微信,说不定以后还有好多这类需求
    catsky
        62
    catsky  
    OP
       2019-09-24 09:03:08 +08:00
    是的,类似的前端任务以后还会有,有兴趣的可以合作
    catsky
        63
    catsky  
    OP
       2019-09-24 09:03:28 +08:00
    LyleRockkk
        64
    LyleRockkk  
       2019-09-24 09:20:32 +08:00
    @KasuganoSoras 这位老哥可真用心,点个赞
    zhiguang
        65
    zhiguang  
       2019-09-24 10:00:02 +08:00
    @zxcslove 子路受牛
    geying
        66
    geying  
       2019-09-24 10:18:51 +08:00
    评论什么风气

    看了一下按钮是 div 旋转了 5 度,一个上下移动的动画
    @-webkit-keyframes angle_highlight_PCH3CK { 0% { background:#00aeef; top:-35px; } 50% { background:#018cc0; top:-40px; } 100% { background:#00aeef; top:-35px; }}
    zxcslove
        67
    zxcslove  
       2019-09-24 10:49:22 +08:00
    @zhiguang 怪李眼儿红咯...........doge
    justin2018
        68
    justin2018  
       2019-09-24 11:19:57 +08:00
    楼主 以后还有类似需求么 😁 求加个好友~
    justin2018
        69
    justin2018  
       2019-09-24 12:03:30 +08:00
    justin2018
        70
    justin2018  
       2019-09-24 12:04:13 +08:00
    @KasuganoSoras 借用了一下你的背景图哈~
    KasuganoSoras
        71
    KasuganoSoras  
       2019-09-24 12:07:32 +08:00
    正好我网站能用上,就改了下应用上去了,效果还不错
    catsky
        72
    catsky  
    OP
       2019-09-24 12:42:52 +08:00
    @justin2018 多谢,我微信号 Y2F0c2t5
    ayase252
        73
    ayase252  
       2019-09-24 15:58:19 +08:00
    来晚了,F12 一看 rotate(5deg)感觉自己还是想象力不够啊
    iMusic
        74
    iMusic  
       2019-09-24 16:28:52 +08:00
    来,200 平分了啊
    catsky
        75
    catsky  
    OP
       2021-05-21 07:51:44 +08:00
    @KasuganoSoras 我刚才发了最后一条消息,我的 qq 就把我强制退出了,提示涉嫌发布虚假信息,我去~~ 你能加我微信吗 我微信号 Y2F0c2t5
    KasuganoSoras
        76
    KasuganoSoras  
       2021-05-21 07:56:44 +08:00
    @catsky #75 啊 这 我加了
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   2480 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 37ms · UTC 15:46 · PVG 23:46 · LAX 08:46 · JFK 11:46
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.