Link to home
Start Free TrialLog in
Avatar of Graeme McGilvray
Graeme McGilvrayFlag for Australia

asked on

Need help coding a pop-out on a website

Hi all and thanks in advance! I am looking to do a static pop-out on my website, something that looks like below
User generated imagewww.thegoodguys.com.au

Can anyone point me in the right direction?

Site is ASP Classic
Avatar of Scott Fell
Scott Fell
Flag of United States of America image

Are you talking about the boxes that look like cards? That is simply a div using box-shadow https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow
Avatar of Graeme McGilvray

ASKER

I am unsure which you mean. The part is the Box that says 'Seen a lower price' with the girl attached. That part is what I want to pop out automatically and close if the user chooses to
Ok, I was  on the site using my phone. I see what you mean now.

What you are looking for is a modal. I see on the site when you click on her a modal already pops out.  Are you using bootstrap 3?  https://getbootstrap.com/docs/3.4/javascript/#modals

Just set the modal to active on page load.
I don't know what bootstrap 3 is sorry
That is what is being used on your website. I think you are using version 3 https://getbootstrap.com/docs/3.4/

The tell tale are classes like, "<div class="col-xs-2 visible-xs nav-toggle">"

That is saying to make the column width 2 (out of 12) columns widehttps://getbootstrap.com/docs/3.4/css/#grid   for screen width extra small (phones) and larger. it is also set to visible https://getbootstrap.com/docs/3.4/css/#helper-classes-show-hide.

For the div with the women, make that a modal https://getbootstrap.com/docs/3.4/javascript/#modals that is open to start with. At the very least, make a container div wtih class="modal". The css is already in your code.  Give that div an id and in your js, use $('#myModal').modal("show"); to open it on the page load.  The trick is when the girl is clicked, it already opens up a modal.
This question needs an answer!
Become an EE member today
7 DAY FREE TRIAL
Members can start a 7-Day Free trial then enjoy unlimited access to the platform.
View membership options
or
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.