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

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

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

    目标:提取 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

    74 条回复    2019-09-24 16:28:52 +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   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   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   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   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   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   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   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   364 天前
    下次带我一个
    KasuganoSoras
        56
    KasuganoSoras   364 天前   ❤️ 3
    给你完美还原了一下,纯手工写的,搞了一个多小时,前端比较渣没办法。。

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

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

    看了一下按钮是 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   364 天前
    @zhiguang 怪李眼儿红咯...........doge
    justin2018
        68
    justin2018   364 天前
    楼主 以后还有类似需求么 😁 求加个好友~
    justin2018
        70
    justin2018   364 天前
    @KasuganoSoras 借用了一下你的背景图哈~
    KasuganoSoras
        71
    KasuganoSoras   364 天前
    正好我网站能用上,就改了下应用上去了,效果还不错
    catsky
        72
    catsky   364 天前
    @justin2018 多谢,我微信号 Y2F0c2t5
    ayase252
        73
    ayase252   364 天前
    来晚了,F12 一看 rotate(5deg)感觉自己还是想象力不够啊
    iMusic
        74
    iMusic   364 天前
    来,200 平分了啊
    关于   ·   FAQ   ·   API   ·   我们的愿景   ·   广告投放   ·   感谢   ·   实用小工具   ·   3010 人在线   最高记录 5168   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 49ms · UTC 13:13 · PVG 21:13 · LAX 06:13 · JFK 09:13
    ♥ Do have faith in what you're doing.