Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

General Discussion

Pop Up Box


I am making a virtual airline which is a gropu of pilot enthusiast and I need to make a box appear the first 5 or 6 you go to the site that is in a small box with an image that I'll make and then there will be an X and the opetion to click anywhere on the page besides the image to exit out of the box, and if you click on the iamge it takes you to flyfrontier.com any help?

3 Answers

Kenneth Love
Kenneth Love
Treehouse Guest Teacher

Look into lightboxes. Most of them are aimed at showing images (which you want to do anyway) but a lot of them are very customizable for both appearance and content.

But I need it to show when it first loads up the page.

Kenneth Love
Kenneth Love
Treehouse Guest Teacher

You should be able to trigger the lightbox when the DOM loads.

Can you please provide the code?

Kenneth Love
Kenneth Love
Treehouse Guest Teacher

I'm not a Javascript/jQuery teacher and don't know all of the details of what you'll be using, so consider this a very rough concept.

var lightboxObject = $('#lightbox').lightbox();

$(document).ready(function() {

A lot of this will depend on the lightbox script that you pick (sorry, it's been years since I've looked through them so I can't recommend one), especially the 1st line in my code sample above where I initialize the lightbox and the one line inside the ready function where I show the lightbox.