Aymeric Jacquet, Me, Myself and I…

Les frame sont à la mode ? Wikio ? Exalead ? jQuery est votre ami.

Pour ça, rien de plus simple; nous allons mixer différents scripts javascripts déjà existants : un script anti frames et un petit script Jquery permettant, aisément, d’attribuer un attribut précis à vos liens, en l’occurrence, un bon vieux _top des familles.

Et sans plus attendre voici…

Le script anti-frame « je veux bien être sympa mais faut pas abuser » :

<script type="text/javascript">
	if (top != self) {
	$(document).ready(function () {
   $("a").attr("target", "_top");
});
	}
	
</script>

A coller dans le head de vos pages.

Bon, d’accord, il faut utiliser la librairie JQuery, mais au moins, en 3 lignes, c’est plié.

Pourquoi pas un simple script tueur de Frame me direz-vous ? Tout simplement, parce que dans certains cas, elles ont leur utilité : j’utilise par exemple le service Blogasty et certains utilisateurs de netvibes visualisent les sites dans la frame netvibes.

Que fait le script :

  1. En gros, il détecte si la page se trouve affichée dans une frame if (top != self)
  2. Si une frame est détectée rajoute automatiquement à tous vos liens l’attribut target="_top" qui, en gros, replace la page ouverte via le lien en pleine page $("a").attr("target", "_top"); si on clique sur un lien.

Si votre site n’est pas affiché dans une frame, le script ne se déclenche pas, donc le target=_top n’est effectif que dans le cas d’affichage dans une frame.

Comme ça, les visiteurs de passage retournent d’où il sont venus, et ceux qui veulent visiter votre site « rentrent » réellement dedans.

Ceci dit, encore plus simple, si pour vous, le javascript c’est du chinois, et que vous vous fichez comme de votre premier amstrad de la validité de votre code html vous pouvez rajouter cette simple ligne dans le head de vos pages : <base target="_top">.

Ca fait la même chose, en plus court, mais en moins « puriste » (quoi que les puristes du javascript trouveront forcément à se plaindre de mon script).

Voila, maintenant vous pouvez faire la paix avec ces méchantes Frames.

Edit : voir aussi le billet Script élégant de contournement de frame sans jQuery si vous n’utilisez pas jQuery.

Aymeric Jacquet

,

24 réponses à “Les frame sont à la mode ? Wikio ? Exalead ? jQuery est votre ami.”

  1. Le frame Wikio permet aux lecteurs de promouvoir les articles qu’ils préfèrent, et de s’abonner hyper-facilement à ton blog. Mais s’il est contre ta religion, no souci, ne te complique pas la vie: on va te l’enlèver.

  3. Taratata, tu as là un simple tueur de Frame, je propose, pour ma part, une solutions beaucoup plus élégante.
    Je reconnais bien là une solution bourrine de développeur.

  4. Pierre Chappaz : le but de ce script est justement d’avoir la double utilité, et non pas de simplement « tuer la frame ».

    En clair, sur les sites utilisant un affichage via frame pour des raisons « utiles » de votes par exemple (Wikio, Blogasty), le script ne tue pas la frame directement, elle laisse la possibilité à l’utilisateur de lire l’article, de commenter, de noter via le système du site « parent ». Par contre, dés que la personne veut aller plus loin, en lisant par exemple un autre article du blog ou un lien externe, le script fait quitter la Frame, tout simplement.

    Comme quoi, je ne suis pas à 100% anti Frames, quand elles ont une utilité potentielle.

  6. Ce script est super pratique effectivement, car le plus gros défaut des frames est que l’on continu à surfer dans la frame. Excellente idée !

  7. [Mode Super Pas Crédible ON]
    Than : si tu veux des conseils en javascript hein, tu sais à qui demander maintenant.

    Note que je me suis rabattu sur jQuery car je n’arrivais pas à finaliser mon script à base de getElementsByTagName et de setAttribute.

    [Mode Super Pas Crédible OFF]

    Xavier : Ahhh, au moins un utilisateur qui a compris l’utilité du script. Merci.

  8. Je vois que tu nous l’a ressortie à la mode, à la mode de jQuery : très bonne idée, je ne vois pas en quoi celà gêne P. Chappaz plus haut, puisque comme tu le précises bien dans ton billet, celà n’empêche nullement d’ouvrir le site dans une frame comme celles de netvibes, wikio ou blogasty. Bon, en même temps, il n’est peut-être pas développeur et la subtilité du script lui aura peut-être échappée.

    +1 donc : http://www.css4design.com/blog/killing-me-softly-with-this-script

  9. C’est revenu à la mode ces frames et c’est vrai que ça peut avoir une utilité mais bon la meilleure frame que je connaisse c’est la fenêtre du navigateur donc mon message pour ces services : développez des plugins pour les navigateurs !

  10. En lisant le début du billet j’allais faire la même boulette que Than :D

    Mais en fait t’as eu une idée de génie sur ce coup là ;)

  11. Bruno : En fait j pense que je me suis mal exprimé, et comme on voit refleurir des tonnes de scripts « tueurs de frames », j’ai l’impression que beaucoup de monde perçoit mon script comme faisant al même chose. :(

    David : chutttt, t’es en train de pourrir le sujet de mon futur article sur le sujet.

    Julien : j’ai l’impression que vous êtes nombreux dans le même cas, comme quoi les gens survolent les articles plus qu’ils ne les lisent vraiment. ;)

  12. @Aymeric > je pense que l’incompréhension de certains est du à l’URL de ton billet : « script jquery anti frame wikio exalead » qui prête vraiment à confusion, alors que le titre du billet reflète mieux l’esprit du script.

  15. C’est dommage que le framing sans autorisation préalable ne soit pas tout simplement interdit par la lois :=)

    @bruno : Excellent le titre de ton billet :)

  16. Aymeric j’avais lu un peu rapidement, je n’avais pas saisi la subtilité de ton script , je pensais que c’était un « vulgaire » script anti-frame ce pourquoi je te proposais d’enlever nous mêmes le frame de ton blog pour te simplifier la vie. Mais la solution que tu proposes est plus subtile! pourquoi pas?

  17. Pierre Chappaz : pas de problèmes, comme précisé, tu n’es pas le seul à ne pas avoir compris directement l’intérêt du script.

    D’ailleurs, une chose qui pourrait être intéressante pour Wikio, et là, les spécialistes du javascript sauront me contredire au cas où, je me demande si il n’est pas possible de manipuler le DOM directement à partir de la frame Wikio pour injecter ce code dans les sites affichés, ce qui pourrait contenter tout le monde. Mais là je m’avance un peu.

  19. Le même résultat, sans javascript :

    Dans la partie HEAD de votre page, insérez <base target= »_top » /> et basta ;)

    Le tag <base target= » »> va conditionner l’attribut target de chaque lien de votre page. Ce tag fonctionne même pour ceux qui ne bénéficient pas du javascript.

    le tag <base>, une balise oubliée ? Elle reste pourtant très pratique et n’a pas d’autre équivalent HTML.

  20. ocarbone : je m’auto cite un morceau de l’article.

    Ceci dit, encore plus simple, si pour vous, le javascript c’est du chinois, et que vous vous fichez comme de votre premier amstrad de la validité de votre code html vous pouvez rajouter cette simple ligne dans le head de vos pages : <base target= »_top »>.

    Et toc !

    Elle a été oubliée car non « valide » tout simplement, du moins en xhtml.

  21. Killing me softly (with this script)

    Strumming my pain with his frame
    Singing my life with wordpress
    Killing me softly with his script
    Killing me softly… with his script
    Telling my whole life with wordpress
    Killing me softly… with his script…

    Avant, lorsqu’on vou…

  23. sans jquery en bas de page :
    if (top != self) {
    var i, a = document.getElementsByTagName(‘a’);
    for(i=0;i < a.length;i++) a i .target=’_top’;
    }