V2EX = way to explore
V2EX 是一个关于分享和探索的地方
Sign Up Now
For Existing Member  Sign In
ibeta
V2EX  ›  问与答

前端求助:怎么控制不规则的 div

  •  
  •   ibeta · Aug 11, 2015 · 3209 views
    This topic created in 3915 days ago, the information mentioned may be changed or developed.
    需求:
    1. 4个兄弟图片,是如下图的不规则的多边形 图片见 http://loveqq.me/v2sos/m2.png
    2. 每次选取一个元素,高亮(加阴影),进行坐标调整,尺寸变换。

    过程:
    1. 使用span画出一个遮盖层,满足要求,但是兼容性很差,细节完全没法调整。代码见http://loveqq.me/v2sos/help.html
    2. 使用css border画一个多边形遮盖曾,但是无法高亮和尺寸变换。参考了http://t.cn/RLms8Xi
    3. 使用svg 画一个多边形,这个看了一天连阴影都没加上。。。参考了http://t.cn/RLmsjXU

    问题:
    1. 遇到这样的情况,大家会怎么处理呢?希望能给个思路。谢谢
    2. 我是想做一个多边形的div,这样控制阴影,尺寸坐标都会比较好调整,但是不知道怎么实现o(╯□╰)o
    5 replies    2015-08-12 21:50:15 +08:00
    ljbha007
        1
    ljbha007  
       Aug 11, 2015
    直接上成品效果的图片 oh yeah
    ibeta
        2
    ibeta  
    OP
       Aug 11, 2015 via Smartisan T1
    @ljbha007 能上就不用这么纠结了(>﹏<)
    Septembers
        3
    Septembers  
       Aug 11, 2015 via Android
    svg绘制
    P233
        4
    P233  
       Aug 12, 2015   ❤️ 1
    我会这么写吧 http://jsbin.com/jibehagawu
    ibeta
        5
    ibeta  
    OP
       Aug 12, 2015
    @P233 最后用transform 2D 做了个遮盖层解决了,十分感谢。
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   2517 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 28ms · UTC 08:42 · PVG 16:42 · LAX 01:42 · JFK 04:42
    ♥ Do have faith in what you're doing.