-
Posts
-
Hi,
I’m revamping a site for a sci-fi book author. He has a couple pages where he’s using a hotspot plugin to create pretty detailed images of ships in his books. On mobile views, these pages are all out of alignment – the hotspots are all messed up and not where they should be. (He’s using a different plugin for hotspots he’s familiar with).Is there a way to disable mobile responsiveness on select pages, so these particular pages can just shrink, instead of rearranging? The hotspots are created in the plugin’s interface, then you insert the hotspot with a shortcode into your page. I’ve tried wrapping the hotspot with [raw][/raw], but that doesn’t work. I’m hoping there’s some custom CSS I can use, and just apply that to the page id’s I need to not be mobile responsive?
Thanks!
OMG – can’t believe I forgot that. :)
There are two – these are the links on the development site:
http://www.avenstar.com/the-minian-side-view/http://www.avenstar.com/the-lilly/
Here are links to these two pages on his current site – these two pages need to behave like this on the new site:
http://www.markwaynemcginnis.com/the-minian-side-view/http://www.markwaynemcginnis.com/the-lilly/
Thank you! :)
Hey!
Try adding this code to the Quick CSS:
html, body, #wrap_all{ overflow: visible !important; } .hotspot-container { min-width: 1000px; }Cheers!
JosueHmmm – that does help with the image, but it makes the rest of the page look really ugly on mobile. Any way to get the whole page to do that? Or maybe just white where the dark void is on mobile? I don’t see a way to attach a screenshot, or I would.
Thanks!
Hi!
Use imgur or dropbox in order to provide a screenshot. Try to replace the code with this:
@media only screen and (min-width: 1000px) { html, body, #wrap_all{ overflow: visible !important; } .hotspot-container { min-width: 1000px; } }Regards,
IsmaelThat code didn’t work at all, so I put back the code I got previously.
Here are a couple screenshots of mobile view:
https://www.dropbox.com/s/y3gda1kli8nmnb6/Screenshot_2015-10-09-10-35-51.png?dl=0
https://www.dropbox.com/s/wdxronubt04yxjy/Screenshot_2015-10-09-10-48-40.png?dl=0The hotspot image itself is larger and you can swipe left to right to view it, but the rest of the page is confined so when you swipe left or right to view the hotspot image, then there’s a dark grey void above and below it.
Here are the affected pages:
http://www.avenstar.com/the-lilly/
http://www.avenstar.com/the-minian-side-view/Thanks so much!
Hi!
Could disabling the responsiveness on the Page work? if so, you can edit header.php and change this line:
$responsive = avia_get_option('responsive_active') != "disabled" ? "responsive" : "fixed_layout";To:
if(!is_page(array(2, 3))) { $responsive = avia_get_option('responsive_active') != "disabled" ? "responsive" : "fixed_layout"; }Change 2, 3 for the Page IDs you want to disable the resposiveness.
Cheers!
JosueThank you sooo much – that might work. I also may be able to just get my client to switch from the plugin he’s used to using for this to yours. :)
- You must be logged in to reply to this topic.