![Check out Enfold](https://kriesi.at/wp-content/themes/kriesi/images/banner-enfold.jpg)
-
AuthorPosts
-
June 12, 2020 at 11:59 am #1222005
Hello,
For the needs of my client, I would like to change the numbers on the hotspots. Each hotspot represents an apartment, and these apartments are numbered, so the apartment number must match the hotspot number.
Take a look at the screenshot of what I need : https://www.dropbox.com/s/k1zj14ux0muys7t/whatIneed.jpg?dl=0Site : https://lesterrassesdu6.fr/
I tried this:
Blank hotspot with this piece of code in a code block:<style type = "text/css"> .av-hotspot-container-inner-wrap > .av-image-hotspot:nth-child(3) .av-image-hotspot_inner::after { color: black; content: "A"; position: relative; right: 3px; } </Style.
If I put “blank hotspot” nothing shows up : https://www.dropbox.com/s/k80nwgbsbkz6u1s/blank-hotspot.jpg?dl=0
If I put numbered hotspot, the A (from “content”) and the number of the hotspot is displayed (and that changes all the hotspots with the number 3) : https://www.dropbox.com/s/ia1id1qo93w9xfe/numbered-hotspot.jpg?dl=0Can you help me?
Thanks ;)
-
This topic was modified 4 years, 2 months ago by
CADCOM.
June 15, 2020 at 11:20 am #1222602Can you help me ? ;)
June 18, 2020 at 4:19 pm #1223777Hi,
Sorry for the delay. What do you mean by “blank hotspots”? Your code above looks fine and should append the extra content beside the default number.
.av-image-hotspot_inner::after { content: ''; color: black; left: -3px; position: relative; } div .av-image-hotspot:nth-child(1) .av-image-hotspot_inner::after { content: '3A'; } div .av-image-hotspot:nth-child(2) .av-image-hotspot_inner::after { content: '2A'; }
You can hide the default content with this one:
.av-image-hotspot_inner { color: transparent !important; }
Make sure to add it above this css:
.av-image-hotspot_inner::after { content: ''; color: black; left: -3px; position: relative; }
Best regards,
IsmaelMarch 19, 2021 at 1:46 pm #1289167Hi! Your css code above is working, only the numbers are now next to the original numbers (1,2,3,4). When I add this code:
.av-image-hotspot_inner {
color: transparent !important;
}It hides the numbers, but also the letters I’ve added with the code.
Can you help me?
Thanks a lot!
Janneke
March 23, 2021 at 5:06 am #1289755Hi Janneke,
I can see 1A, 2B and so on, on your actual site. Could you try to explain the problem you are having a bit further please?
Best regards,
RikardMarch 23, 2021 at 9:11 am #1289790Hi! Yes, that’s true. But I don’t want the numbers 1 2 3 4. I can’t remove them! I added A B C D, but when I add the code to remove the standard 1-4 nothing happens and I still see 1A etc.
So I just want the numbers to be A B C D!
March 24, 2021 at 4:36 pm #1290166When I add this code:
.av-image-hotspot_inner {
color: transparent !important;
}All the letters and numbers are gone. So also the letters A B C D I’ve added in the after.
Any ideas?
March 26, 2021 at 7:18 am #1290484 -
This topic was modified 4 years, 2 months ago by
-
AuthorPosts
- You must be logged in to reply to this topic.