How To Create A JavaScript Close Link

By  on  

Whenever I create a small JavaScript popup window, I offer a "close" link. Since I'm responsible for the new window, I feel it's my job to help them easily get rid of it.

The XHTML

Create an anchor with the JavaScript "close" call in the "href" attribute:

Close Window

Do not use the onClick attribute of the anchor because not everyone clicks links.

Note: I've gotten out of the habit of using JavaScript popups. They're annoying and as smooth as steel wool. I recommend using a modal box via JavaScript. Most modal box scripts allow for smooth transitions and are just as easy to close as popup windows -- plus, they don't get blocked by popup blockers. I currently use MoodalBox for my projects.

Recent Features

Incredible Demos

  • By
    CSS Ellipsis Beginning of String

    I was incredibly happy when CSS text-overflow: ellipsis (married with fixed width and overflow: hidden was introduced to the CSS spec and browsers; the feature allowed us to stop trying to marry JavaScript width calculation with string width calculation and truncation.  CSS ellipsis was also very friendly to...

  • By
    Translate Content with the Google Translate API and JavaScript

    Note:  For this tutorial, I'm using version1 of the Google Translate API.  A newer REST-based version is available. In an ideal world, all websites would have a feature that allowed the user to translate a website into their native language (or even more ideally, translation would be...

Discussion

    Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!