Break Out of Frames Using JavaScript

By  on  

I thought frames went out of style a decade ago but apparently everyone feels the need to duplicate the Digg Bar. I don't trust these framed services so I choose to use a JavaScript snippet that prevents my site from being in someone else's frame.

The JavaScript

if (top.location != self.location) {
	top.location = self.location;
}

Don't let your site be framed in! Use this JavaScript snippet!

Recent Features

  • By
    How to Create a RetroPie on Raspberry Pi – Graphical Guide

    Today we get to play amazing games on our super powered game consoles, PCs, VR headsets, and even mobile devices.  While I enjoy playing new games these days, I do long for the retro gaming systems I had when I was a kid: the original Nintendo...

  • By
    CSS Animations Between Media Queries

    CSS animations are right up there with sliced bread. CSS animations are efficient because they can be hardware accelerated, they require no JavaScript overhead, and they are composed of very little CSS code. Quite often we add CSS transforms to elements via CSS during...

Incredible Demos

  • By
    DWRequest: MooTools 1.2 AJAX Listener & Message Display

    Though MooTools 1.2 is in its second beta stage, its basic syntax and theory changes have been hashed out. The JavaScript library continues to improve and become more flexible. Fellow DZone Zone Leader Boyan Kostadinov wrote a very useful article detailing how you can add a...

  • By
    Creating the Treehouse Frog Animation

    Before we start, I want to say thank you to David for giving me this awesome opportunity to share this experience with you guys and say that I'm really flattered. I think that CSS animations are really great. When I first learned how CSS...

Discussion

  1. haha, I really like this. I agree with your thoughts on frames.

  2. I thought I’d seen that for the last time last millennium! Although I also agree with the nasty framed services – so might have to join in and add it to my site too :) Obvious, but very easy to not think of

  3. This is the very same basic technique for preventing clickjacking. Basic, because it doesn’t work in IE, if your site is framed with security=”restricted”

  4. As seen on The Good Parts… shouldn’t you use !== instead of != for comparisons like this one?

    d.

  5. haha!
    this is first javascript that i learn when i was baby :D

  6. David,

    i agree. I saw a few articles ranting about the Digg bar when it came out and one of them had this same solution – so I added it. Works great!

    Just had an idea though – what if you could recognize where the bar was coming from (like Digg) and get rid of the bar but add some little area to your page that recognizes the user and the functionality they might want. For Digg, just add a little Digg this button or whatever the Digg bar offers. Facebook, Hootsuite, a few others that I know of.

    It would be similar to the WP Greet Box Plugin that gives a quick message depending on where visitors come from.

    This way you lose the bar, but keep the sharing aspects and make it look like it fits your site.

    -Marty

  7. Ben

    I like frames sometimes. I think the Diggbar is really useful. However frames can be over used like you say.

  8. I use this on one of my sites. It works OK and you need just 2 lines of javascript. Personaly I hate frames. This was popular years years ago.

  9. Wow, haven’t seen this piece of code in 8-10 years, when using frame was the norm.

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