Popups

Home › Forums › Spiral HTML5 Template › Popups

This topic contains 6 replies, has 2 voices, and was last updated by  ab-themes 7 years, 11 months ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • June 9, 2016 at 8:11 pm #17078

    diogo91
    Participant

    Hi,

    I have looked for a popup, but haven’t found it. Is popups included in the Spiral theme?

    Diogo

    June 10, 2016 at 6:47 am #17087

    ab-themes
    Keymaster

    Hello,

    yes Spiral theme does have popup shortcode, but it is not completely settled.

    This is an example of how to use this shortcode in HTML:

    <div class="tcvpb-popup-shadow" style="display: none;">
	<div class="tcvpb-popup-content  bottom_right" data-animation="flip" data-duration="1000" data-delay="300" style="display: block; position: fixed;">
		<img src="image_example.jpg">
		<p class="p_tc">Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old.</p>
		<i class="tmf-close"></i>
	</div>
</div>

    this HTML should go to the very bottom of the page.
    And now I can see that the entire CSS is missing for that shortcode, so we are sending you the CSS in attachments.

    Please, let us know if that helped you.

    Cheers

    June 13, 2016 at 7:23 pm #17135

    diogo91
    Participant

    Hello,

    I have added the code and the css. How do I open the popup? I want to open it when I click on a tag.

    Thanks.

    June 13, 2016 at 7:25 pm #17136

    diogo91
    Participant

    The above message got messed up and I didn’t find where to edit it. I want to open the popup when I click on a <a> tag.

    Thanks.

    June 14, 2016 at 5:55 am #17146

    ab-themes
    Keymaster

    Ok, we may have misunderstood each other. By popup you mean modal window like on our demo when you click on the play button http://preview.magnior.com/spiral-html/?

    If that’s the case, just copy that code and replace the image with anchor, or just a text. The content of the modal go before the closing the <body> tag.

    Button:

    
<div id="spiral-modal-1" class="spiral-modal">
    <div class="spiral-modal-button" data-button_id="1">
	<img src="images/play.png" alt="image button" />
    </div>
</div>

    Modal content:

    
<div class="spiral-modal-content-wrapper" id="spiral-modal_wrapper_1">
     <div class="spiral-modal-content " id="spiral-modal_content_1" style="top: 201px;">
	<div class="spiral-videoWrapper-vimeo">
	    <iframe src="http://player.vimeo.com/video/57005606?title=0&byline=0&portrait=0&autoplay=0&loop=0&color=ff503f" frameborder="0" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen=""></iframe>
	</div>
        <div class="spiral-modal-close"></div>
    </div>
</div>

    Hope this helps.

    June 15, 2016 at 5:08 am #17169

    diogo91
    Participant

    Thanks, it worked!

    June 15, 2016 at 6:14 am #17179

    ab-themes
    Keymaster

    No problem, glad that we could help :)
    Let us know if you’ll need anything else.

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)

The topic ‘Popups’ is closed to new replies.