Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • May 9, 2015 at 8:12 pm #441989
    bursell

    On the page specified – I have set up several images, each with an enlarged hotspot that displays a tooltip on hover. This works beautifully on the desktop – however, in mobile, the numbers are back on my hotspots and there is another numbers hotspot under each photo – next to each tooltip. I do not want to do anything to the desktop functionality of this page because it is working great there – however, for mobile devices, I’d like to turn off the hotspots and only display the tooltips under each photo. I’d like the tooltips to always be there and I’d like them to be the same size as the photo above each of them. I want to enable this for mobile only though. Can you help me with some quick CSS to make this happen?

    May 10, 2015 at 4:23 am #442037
    bursell

    Any idea, guys?

    May 11, 2015 at 11:57 am #442376
    Ismael

    Hey!

    Thank you for using Enfold.

    Add this in the Quick CSS field:

    @media only screen and (max-width: 767px) {
.responsive .av-hotspot-image-container.av-hotspot-blank.av-mobile-fallback-active .av-image-hotspot_inner {
  display: none;
}}

    Remove browser cache then reload the page.

    Regards,
    Ismael

    May 11, 2015 at 5:56 pm #442596
    bursell

    Hi Ismael – thank you for your reply. I put the data in the quick CSS code that you sent and then cleared the cache on my phone and there is no change. It is still showing as before.

    May 12, 2015 at 4:32 pm #443129
    bursell

    I really could use somebody’s help with this – because we are set to go live here in the next day or so. Please and thank you a ton!!

    May 12, 2015 at 4:44 pm #443138
    Yigit

    Hi!

    Please add following code to Quick CSS as well 

    @media only screen and (max-width: 767px) {
.av-hotspot-fallback-tooltip-count {
  display: none !important;
}
.av-hotspot-fallback-tooltip-inner {
  margin-left: 0 !important;
}}

    Cheers!
    Yigit

    May 12, 2015 at 6:42 pm #443251
    bursell

    Yeah! Almost there. It got rid of the numbered dot to the left – however, I put a hotspot on the bottom of each photo – and used some CSS to enlarge the dot – so it is floating in front of the tool tip that is below it so you can’t read the first sentence of the tool tip below each picture. I am imagining that the easiest solution to this might be to have the tool tip come to front – so that it doesn’t sit behind anything that is in front of it. Not sure that will work though… Take a look at this page on your phone – hopefully it will show up as I’m seeing it. http://fastcoindustries.com/processes/

    May 12, 2015 at 6:46 pm #443253
    bursell

    Okay – got it – perfect!!! Had to clear my cache and be sure I used both codes from Yigit and Ismael. Thank you so much!!

    May 12, 2015 at 7:33 pm #443278
    Yigit

    Hi!

    You are welcome, we are always happy to help :)
    For your information, you can take a look at Enfold documentation here – http://kriesi.at/documentation/enfold/
    And if there are features that you wish Enfold had, you can request them and vote the requested ones here – https://kriesi.at/support/enfold-feature-requests/
    For any other questions or issues, feel free to post them here on the forum and we will gladly try to help you :)

    Cheers!
    Yigit

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘Mobile hotspot problems…’ is closed to new replies.