Tagged: 

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • April 12, 2016 at 11:02 am #611791
    Mathuseo

    Hi,

    how can I change the size of the hotspots? Changing the color works fine with backend. For changing the size I would need to change the CSS (and JavaScript) I think. Do you have any CSS code snippet, how to double the size of the hotspot, for example?

    Many thanks,
    Mathuseo

    April 12, 2016 at 2:24 pm #611886
    Yigit

    Hey Marcel!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab

    @media only screen and (min-width: 990px) {
.responsive .av-image-hotspot {
    height: 32px;
    width: 32px;
    line-height: 32px;
}
.responsive .av-image-hotspot-pulse {
    top: -11px;
    left: -11px;
}}

    Cheers!
    Yigit

    • This reply was modified 7 years, 10 months ago by Yigit.
    January 23, 2017 at 5:43 pm #737367
    Stephan_H

    You forgot an opening { at the end of the the first line.
    Correct code:

    @media only screen and (min-width: 990px) {
.responsive .av-image-hotspot {
    height: 32px;
    width: 32px;
    line-height: 32px;
}
.responsive .av-image-hotspot-pulse {
    top: -11px;
    left: -11px;
}}
    January 23, 2017 at 5:48 pm #737370
    Yigit

    Hi!

    Thanks for pointing that out. I edited my code :)

    Cheers!
    Yigit

    September 12, 2021 at 2:33 pm #1320580
    KeesKaas

    Hi,

    Is there a way to increase the size of the pulse?

    September 13, 2021 at 10:06 am #1320685
    Rikard

    Hi KeesKaas,

    Please try the following in Quick CSS under Enfold->General Styling:

    .av-image-hotspot-pulse {
    height: 84px;
    width: 84px;
    top: -28px;
    left: -29px;
}

    Then adjust the numbers to your liking.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.