Copy link to clipboard
Copied
Hello, Need help to put a border on a link in a Map area , where the border need to be blur and sharpen on event of mouse roll over. please assist with a sample code Thanks.
I'm going to say this once, to make myself feel better for what I'm about to do...
NOBODY SHOULD EVER DO THIS, IT'S NOT 1995 ANYMORE!1!!ELEVEN!!
There, now here's a cheap and dirty way to do what you want with the tools and resources at your disposal:
1. Create an "off state" for your map with nothing glowing (full map, all locations, no glowing sign posts)
2. Create an "on state" for each individual sign post (full map, all locations, 1 glowing sign each)
3. In DW, insert your "Off State" imag
...Copy link to clipboard
Copied
Here's some sample code using an SVG map and some simple rollovers: https://codepen.io/okeul/pen/LVjbdE
Without more info about your page, and what you actually want to have happen, there's really nothing more I'm willing to add here.
What you want to do may sound simple to you, but I'm guessing it may ultimately be hours worth of billable time in the end.
Copy link to clipboard
Copied
that's exactly what I need, but my pictures are not svg.
let's have a look at a part of the project here :
http://www.dessinateur.biz/mr/carte4
for the moment, few pictures are in animated gif format, to highlight links of the area map (all are not already active, this is just for testing).
Creating all the pictures of the entire project in svg format is not an option (too much work). That's why I'm looking for how color or make visible border on this type of link (area map) without complex coding (I'm not a specialist)
Thanks a lot for you answer
Copy link to clipboard
Copied
I'm going to say this once, to make myself feel better for what I'm about to do...
NOBODY SHOULD EVER DO THIS, IT'S NOT 1995 ANYMORE!1!!ELEVEN!!
There, now here's a cheap and dirty way to do what you want with the tools and resources at your disposal:
1. Create an "off state" for your map with nothing glowing (full map, all locations, no glowing sign posts)
2. Create an "on state" for each individual sign post (full map, all locations, 1 glowing sign each)
3. In DW, insert your "Off State" image and give it an ID in the Properties Window
4. In the Properties window, select the the Polygon Hotspot Tool tool in bottom left. You MUST be in Design View and the tiny triangle in the bottom right of the Properties Window must also be pointing up, or the tools won't appear
5. Trace a polygon shape over your first zone. Click the Pointer Hotspot Tool (arrow icon in bottom left of Properties Window) and click a non-hotspot on the image (this locks the first zone in). Click the Polygon Tool again and draw your next zone. Repeat the process for each "linked" area of the map (do not overlap areas).
6. Select the Pointer Hotspot Tool again and click your first polygon (the corners will highlight with anchor points) then go to Window > Behaviors (if your Behaviors window is not open)
7. In the Behaviors Window, hit the Add Behavior (+ icon) button and choose Swap Image
8. Be sure the ID from step 3 is selected from the list of images, and browse to the correct "On State" image for the zone you have selected.
9. Be sure "restore Image onMouseOut" is checked and hit "OK"
10. Repeat steps 6-10 for the remainder of your hotspots
That should do it.
Copy link to clipboard
Copied
Thanks a lot Jon,
1995 was a great year 😉 I understood everything and, miracle, it works !
Your guide is clear and precise, perfect for my level.
For the moment the project doesn't need more, but if it has to be more advanced, I would contact professionals to do the work with 2024's level 😉
Copy link to clipboard
Copied
This is doable with SVG shapes over a responsive bitmap. See example below.
As for the blinking animated GIF, that's an emphatic NO!!!! It's a legal liability for the site owner. Rapid blinking poses health risks for people with epilepsy and photo sensitivities to flashing lights. It just takes one person to file a complaint & lawsuit to put you out of business. Do not go there.
Copy link to clipboard
Copied
thanks Nancy,
got it for the blinking, thanks! for the code, I'll see that tomorow, it's late in the night here 😉