hello guys, i'm one step closer to launching my website with this incredible template, this canvas just unbelieveable work, great work semicolon!
so i'm having this issue, i want to show a different image subscription modal on laptop, tablet and smartphone.
i mean, in laptop i want to show, laptop.jpg. , on tablet tablet.jpg, on smartphone smartphone.jpg. how can i achieve this?
Hello,
Thank You so much for the Kind Words! :)
This is Definitely Possible and can be achieved using the Responsive Classes:
<div class="block custom-modal-bg divcenter">
<div class="center" style="padding: 50px;">
<h3>A Simple Example of a Text Modal</h3>
<p class="nobottommargin">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nostrum delectus, tenetur obcaecati porro! Expedita nostrum tempora quia provident perspiciatis inventore, autem eaque, quod explicabo, ipsum, facilis aliquid! Sapiente, possimus quo!</p>
</div>
<div class="section center nomargin" style="padding: 30px;">
<a href="#" class="button" onClick="$.magnificPopup.close();return false;">Close this Modal</a>
</div>
</div>.device-lg .custom-modal-bg { background-image: url(images/bg-desktop.jpg); }
.device-md .custom-modal-bg { background-image: url(images/bg-notebook.jpg); }
.device-sm .custom-modal-bg { background-image: url(images/bg-ipad.jpg); }
.device-xs .custom-modal-bg { background-image: url(images/bg-iphone-landscape.jpg); }
.device-xxs .custom-modal-bg { background-image: url(images/bg-iphone-portrait.jpg); }This will definitely work fine. Hope this Helps!
Let us know if we can help you with anything else or if you find any further issues.
Have the same question, or something new?
Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.
Reply on the dashboard