Jump to content

smgrant

Circle Member
  • Posts

    12
  • Joined

  • Last visited

Reputation Activity

  1. Thanks
    smgrant reacted to creedon in Add Multiple Links on Top of Image   
    Here you go.
    <!--   responsive image map      Version     : 0.1d0      SS Versions : 7.0, 7.1      Note        : adapted from code on stackoverflow < https://bit.ly/3eIcJUB > by                 hungerstar < https://bit.ly/3aMG6DU >                    By          : Thomas Creedon < http://www.tomsWeb.consulting/ >      -->      <style>        .image-overlay-wrap {            display : inline-block; /* shrinks container to image size */       fill : transparent;       position : relative;              }            .image-overlay-wrap img { /* optional, for responsiveness */            display : block;       height : auto;       max-width : 100%;              }            .image-overlay-wrap svg {            left : 0;       position : absolute;       top : 0;              }            /*            the following can be used for diagnostic purposes, uncomment the code and       the target areas for the links will be shown in red              */            /*            .image-overlay-wrap a {                fill : red;                  }                */            </style>        <div class="image-overlay-wrap">        <img src="https://static1.squarespace.com/static/5e4c5392a45d2b3075129063/t/61645324ef0cae11364cc50d/1633964837430/strauss-sales-areas-contact.png" />          <svg viewBox="0 0 4295 2791">            <a alt="Chris Gorder" href="mailto:cgorder@straussfeeds.com" title="Chris Gorder" xlink:href="mailto:cgorder@straussfeeds.com">                <polygon points="1110,1888,1189,1441,884,1380,944,974,500,854,549,557,576,489,655,384,681,278,587,229,448,260,429,508,335,711,324,809,278,907,301,1117,335,1260,380,1426,384,1474,557,1617,587,1696,275,1832,177,1866,218,1952,305,1888,542,2076,467,2125,497,2204,421,2189,436,2276,380,2343,361,2392,391,2471,467,2535,406,2603,248,2625,154,2652,403,2625,500,2588,583,2558,689,2528,805,2543,929,2648,997,2746,1053,2716,997,2614,847,2152,1084,2291,1306,2362,1520,2543,1535,2625,1629,2569,1546,2483,1437,2381,1159,2257,726,2088,587,2035,316,1843,775,1757,643,1693" />                  </a>                <a alt="Erin Bronson" href="mailto:ebronson@straussfeeds.com" title="Erin Bronson" xlink:href="mailto:ebronson@straussfeeds.com">                <polygon points="1200,1418,895,1365,948,970,512,831,561,549,689,278,865,316,862,241,843,150,907,124,963,162,914,244,910,323,1622,448,1610,636,1565,1121,1257,1095" />                  </a>                <a alt="Dan Catherman" href="mailto:catherman@straussfeeds.com" title="Dan Catherman" xlink:href="mailto:catherman@straussfeeds.com">                <polygon points="1633,440,2009,459,2043,733,1614,707,1595,910,1580,1061,1576,1125,1264,1113,1211,1426,1618,1474,1618,1520,1809,1538,1809,1689,2009,1749,2231,1779,2257,2091,2411,2140,2615,2144,2585,2042,2795,2001,2878,2073,2987,2024,3081,2110,3130,2264,3250,2407,3326,2396,3329,2279,3217,2061,3156,1937,3175,1821,3228,1760,3307,1775,3314,1843,3363,1877,3427,1873,3446,1821,3427,1760,3378,1734,3341,1753,3247,1723,3307,1648,3363,1606,3397,1550,3435,1520,3469,1448,3457,1373,3412,1313,3329,1230,3250,1174,3081,1166,3025,1226,2968,1298,2841,1279,2664,1388,2607,1392,2630,1313,2630,1222,2626,1132,2618,1076,2585,1016,2453,1061,2430,1019,2419,1106,2396,1177,2212,1177,2118,1185,2122,1226,2016,1238,1693,1207,1704,1151,1610,1132,1516,1117,1550,1136" />                  </a>                <a alt="Suanne Blackwell" href="mailto:sblackwell@straussfeeds.com" title="Suanne Blackwell" xlink:href="mailto:sblackwell@straussfeeds.com">                <polygon points="1851,2392,1995,2438,1984,2355,1991,2295,2149,2332,2161,2370,2187,2404,2232,2404,2262,2362,2255,2325,2228,2302,2179,2298,2018,2238,2085,2193,2153,2174,2187,2137,2258,2110,2247,1794,1875,1719,1807,1682,1811,1550,1626,1527,1630,1486,1212,1441,1148,1900,1200,1911,1234,1866,1389,1941,1438,2028,1457,2088,1543,2156,1622,2092,1697,2114,1746,2189,1802,2291" />                  </a>                <a alt="Brian Briner" href="mailto:bbriner@straussfeeds.com" title="Brian Briner" xlink:href="mailto:bbriner@straussfeeds.com">                <polygon points="2141,471,2020,474,2050,738,1622,726,1576,1121,1689,1148,1704,1208,2111,1227,2118,1182,2389,1174,2419,1027,2596,1009,2585,918,2604,869,2607,817,2573,836,2585,794,2555,741,2408,697,2385,655,2325,666,2374,610,2430,572,2385,542,2284,515,2227,365,2269,354,2291,305,2272,267,2224,252,2182,275,2171,316,2190,354,2231,508" />                  </a>                <a alt="Alan Lauer" href="mailto:alauer@straussfeeds.com" title="Alan Lauer" xlink:href="mailto:alauer@straussfeeds.com">                <polygon points="2438,651,2498,617,2525,639,2577,643,2630,666,2671,651,2728,628,2750,654,2788,654,2871,560,2844,527,2867,478,2897,455,2935,463,2961,497,2965,534,2946,560,2908,576,2795,677,2810,722,2848,752,2856,801,2841,839,2837,888,2874,858,2901,846,2916,895,2927,929,2916,959,2897,982,2893,1019,2905,1049,2953,1064,2995,1046,3032,1023,3048,997,3059,1046,3070,1083,3070,1128,3066,1166,3017,1222,2972,1286,2844,1275,2739,1347,2622,1380,2637,1076,2694,1016,2683,914,2671,854,2701,779,2739,737,2705,681,2649,733,2592,775,2502,696,2442,685" />                  </a>                <a alt="Tim MacDonald" href="mailto:tmacdonald@straussfeeds.com" title="Tim MacDonald" xlink:href="mailto:tmacdonald@straussfeeds.com">                <polygon points="3059,986,3085,1151,3213,1162,3311,1196,3386,1271,3435,1324,3476,1189,3503,1091,3589,1091,3616,1125,3661,1132,3695,1110,3706,1061,3687,1023,3638,1008,3597,1019,3593,1053,3484,1061,3495,1001,3537,952,3623,929,3680,884,3729,854,3653,809,3642,730,3680,658,3721,624,3777,609,3815,564,3774,508,3744,451,3698,380,3634,372,3589,425,3589,497,3586,560,3507,613,3401,647,3307,673,3303,730,3288,801,3228,839,3134,850,3145,884,3123,937" />                  </a>                </svg>            </div> Let us know how it goes.
×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.