Anchor example

This modal can be opened by clicking the anchor icon in the pre-header. Because the link uses an href anchor (instead of data-open-modal) you'll see #example_modal in your address bar. If you want to see the hidden modal, manually change the url in your address bar to #hidden_modal.

data-open-modal example

This modal can be opened by clicking the window icon in the pre-header. Because the link uses data-open-modal (instead of an href anchor) nothing appears in the address bar. You also can't use the back/forward buttons to close or reopen the modal. However, if you know the ID of the modal, you can still manually type the anchor link in your address bar and it will open (handy for client previews).

To simulate an extremely long modal and show how modals scroll, here's a ton of lorem ipsum:

Welcome!

GAME FACED

Just another day on the corner of Rosewood & Fairfax. You know, music video shoots for teenybopper celebrities, vintage sports cars, whatever.

Sal’s (SLB) been busy running the manliest store this side of Castle Grayskull.

He’s also gearing up for the weekend, as SLB and the FISM crew are throwing a block party on this same corner, on Saturday, between noon and 5. The party’s also doubling as a Sinful Things summer sale, so get there early.

Then later that night, Fast Eddie will host the re-launch party for Sjobeck at his shop downtown, Fast Eddie’s Garage.