AccueilCodesTutorielsForumsEmploiLivresConnexion

  • Javascript / Ajax / DHTML CodeS-SourceS
  • RSS CodeS-SourceS
  • CodyxBot, le Bot GTalk & MSN qu'il vous faut !
  • Générez des revenus avec vos codes, scripts et tutoriaux
  • Aide à la navigation du site
begin process at 2009 01 10 02:25:06
Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum. Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !

PROTÉGER L'ACCÈS À UNE IMAGE PAR UN DIV TRANSPARENT


Information sur la source

Catégorie :Divers Niveau : Débutant Date de création : 17/06/2003 Date de mise à jour : 17/06/2003 17:12:34 Vu / téléchargé: 10 279 / 406
Auteur : Kenaghdar Ecrire un message privé
Note :
10 / 10 - par 1 personne
10,00 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Commentaire sur cette source (20)
Ajouter un commentaire et/ou une note

Description

Hello,

Suite à une conversation avec Sebguess, voici un bout de code permettant de protéger une image à l'aide d'un DIV transparent.

Inutile de me dire qu'il s'agit d'un code ridicule, je suis au courant... à condition que vous connaissiez un peu l'HTML :)

Le principe est simple: placer un DIV transparent devant l'image, en jouant sur le z-index et sur l'alpha(opacity) de la DIV.
 

Source

  • <html>
  • <head>
  • <title>How to protect a picture?</title>
  • <style>
  • .hideIMG {
  • filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
  • position:absolute;
  • width:100%;
  • height:100%;
  • z-index:10;
  • margin:0px
  • }
  • </style>
  • </head>
  • <body>
  • <DIV class="hideIMG"></DIV>
  • <IMG src='ProtectPicture.gif' border="0" style='z-index:1;' />
  • </body>
  • </html> 
<html>
    <head>
        <title>How to protect a picture?</title>
        <style>
        .hideIMG {
            filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
            position:absolute;
            width:100%;
            height:100%;
            z-index:10;
            margin:0px
        }
        </style>
    </head>
    <body>
        <DIV class="hideIMG"></DIV>
        <IMG src='ProtectPicture.gif' border="0" style='z-index:1;' />
    </body>
</html>

Conclusion

Bug: une sous version d'IE5.0 gère mal la transparence d'une DIV, ce qui signifie que l'image sera totalement cachée par la DIV.


Question: Afin d'éviter de 'polluer' les sources, y a-t-il un autre moyen d'envoyer un fichier à un membre de CodeS-SourceS?
 

Fichier Zip

Pour les "Membres Club", vous pouvez télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

Télécharger le zip

Commentaires et avis

signaler à un administrateur
Commentaire de jerms le 17/06/2003 17:43:52

on peut aussi protéger l'image en affichant un message quand on clic dessus :
&lt;img src="tip.bmp" OnMousedown="alert('Message')"&gt;

signaler à un administrateur
Commentaire de StephVBF le 18/06/2003 09:50:30

Cette astuce est aussi utilisée pour empêcher de recopier facilement le contenu d'une autre layer. Je ne trouve pas ce genre d'astuce sympa ;-(

signaler à un administrateur
Commentaire de Kenaghdar le 18/06/2003 10:12:42

Tout dépend du contenu de la layer en question. Je suis un adepte du libre, mais je peux comprendre que quelqu'un veuille protéger sa propriété intellectuelle. Imagines un graphiste qui veut mettre sur le web quelques exemples de son talent, mais qui ne veut pas voir tout le monde utiliser ses oeuvres comme fond d'écrans... Tu ne trouves pas normal qu'il protège l'accès à ces images?
On peut être idéaliste, mais penser que tout le monde est bien gentil et respecte les droits d'auteurs (quelque soit la manière de l'exprimer) est à la limite de la débilité :) Sauf ton respect, naturellement.

Ken.

signaler à un administrateur
Commentaire de FredT le 18/06/2003 11:03:51

Sans vouloir lancer un débat sur le "libre", je trouve aussi tout à fait normal, de vouloir empêcher le bouton droit ou la sélection de contenus. Pas seulement pour protéger, mais aussi tout simplement, pour rendre le contenu plus difficilement consultable localement. On peut ainsi plus ou moins obliger le visiteur à revenir consulter les mises à jour. Et de toutes façon, je n'ai pas encor trouvé de site où il est complètement impossible de récupérer les images.
Au passage :
oncontextmenu="return false"  onselectstart="return false" ondragstart="return false"&gt;

signaler à un administrateur
Commentaire de Kenaghdar le 18/06/2003 11:50:46

Tu as raison pour les events. J'en avais parlé dans ma réponse à Meridius dans le forum. Rien ne sert de mettre une DIV devant une image si le visiteur peut consulter la source de la page :)

signaler à un administrateur
Commentaire de StephVBF le 18/06/2003 15:32:52

les pages peuvent être récupérées et visionner sous un wysywig et les objets flash décompilés.
le seul truc irrécupérable c'est les pages asp ou php.

signaler à un administrateur
Commentaire de Kenaghdar le 18/06/2003 15:51:30

On parle juste d'une manière qui bloque la plupart des visiteurs. Si un visiteur connait la technologie, il est évident que cette manière ne le bloquera pas longtemps, même en bloquant les events onContextMenu, etc.

signaler à un administrateur
Commentaire de bob3000 le 18/06/2003 18:44:36

cest bon, bravo. mais le seul probleme cest que tu peux aller dans la barre d'addresse et ajouter  "lenomdelimage.gif" apres laddresse et tu as limage.

signaler à un administrateur
Commentaire de StephVBF le 18/06/2003 19:27:45

jsute une remarque sur les posts concernant le javascript, moi j'en suis à vrai dire très friand. Et puis moi-même sur mon site j'évoque la possibilité d'empêcher par exemple l'accès à des page,s mais disons que ce qui m'intéresse n'est non pas de le faire mais de savoir comment le faire, je suis surtout intéressé par le côté technique ;-)

pour ceux qui veulent des scripts javascripts, il y a aussi http://javascript.faqts.com (en anglais, la partie française n'étant pas très développée)

bye
bye

signaler à un administrateur
Commentaire de spEps le 18/06/2003 20:05:05

Il existe un moyen de connaître les sources et éviter les protections.
Aller sur http://validator.w3.org et entrer l'adresse du site.
Vous aurez la source complète du site en question.

signaler à un administrateur
Commentaire de iubito le 20/06/2003 15:25:39

lol, et le p'tit capture d'écran.
Mais c vrai j'utilise les quelques évent dans mon script. ça complik un tout petit peu pour celui ki connait la technologie. Mon frère arriverai sur la page et voudrai récupérer l'image (un glissé-déplacé pour déposer dans word... pas terrible comme méthode) il me demanderai comment faire, mais kk'1 ki connait un peu c très bien récupérer.
De manière générale je suis pour le libre, mais je l'utilise dans un de mes script, voilà. Et j'au horreur des sites où y'a des divs ki se superposent, même des div tout simplement, car parfois y'en a ki se chevauchent c le bordel souvent !

signaler à un administrateur
Commentaire de meh le 07/12/2004 17:21:24

Franchement, on s'en br... des copyrights d'images backgrounds sur le net ! Si quelqu'un est assez ridicule pour reprendre les même backgrounds sur son site par ex. après avoir copier une image, c'est son problème. Sur le net on apprend tous les uns des autres, on donne et on reçoit. Je trouve dommage qu'on veuille, même ici, tout verrouiller. Quelle tristesse! Mais heureusement y a toujours moyen de contrecarrer ce genres d'initiatives toutes petites-petites...
Alors, ce script, ce que j'en pense...

signaler à un administrateur
Commentaire de ifebo le 11/05/2005 04:49:13

A mon avis c'est juste un défi qu'un débutant aura envie de relever. et forcément il y arrivera.

signaler à un administrateur
Commentaire de ifebo le 11/05/2005 05:13:15

De toute façon il y a plus sûr et plus simple quant à la mise en page des images dans un document html.
Il faut :
1) créer un tableau pour chaques images.
2) créer un gif transparent de 1x1 pixel
3) mettre ses images en background dans chacun des tableaux.
3) Dans la cellulle <TD> de chaque tableaux contenant une image écrire :
<img border="0" width="longueur img en pixels" height="hauteur img en pixels" src="images/vide.gif">
</TD>
vide.gif étant le gif transparent de 1x1 pixel.
On peut même donner au gif transparent un nom trompeur qui fera croire qu'on enregistre bien l'image choisie avec le clic droit.
Arf! arf ! Mais bon ça ne dure qu'un temps.
Ceci dit je suis convaincu que ça peut ouvrir des horizons à qq. pour autre chose.

signaler à un administrateur
Commentaire de MadM@tt le 02/08/2005 23:21:07

Ta qu'a faire clic droit : code source de la page
Puis repérer le nom de tes images, les taper dans la barre d'adresse, et hop le tour est joué...

signaler à un administrateur
Commentaire de arfang le 07/07/2006 18:11:48

Pas si simple si on combine tout çà et qu'en plus on "crypte" le contenu... amha, çà va être assez dur de prendre, surtout si le développeur met un HTACCESS en aspiration à la racine ! ;)) D'ailleurs il peut être encore plus vicieux en mettant un DENY FOR IP-IP où la plage IP est celle des pays dont il ne veut pas la présence ! Par exemple une PME française a un redoutable concurrent US ou CN, il met çà et tintin pour voir le site qui sera toujours indisponible pour ce visiteur. Si en plus il met un événement que j'appelerai 'come-back', il renverra automatiquement le visteur d'où il vient... ;)) bref il le jette !

signaler à un administrateur
Commentaire de MadM@tt le 07/07/2006 18:42:19

Arfang > Dans ce cas la ta pme française elle est mal barrée (je parle de ton DENY FOR IP-IP), elle laisse directement ses concurrents gagner tous les visiteurs US (ou CN ou autres) car elle les refuse, autrement dit elle se refuse un marché... Enfin j'ai pas compris l'intérêt de ton truc quoi.
Comment veux-tu crypter le contenu et qu'il soit en meme temps lisible par le visiteur du site ? ça sous-entend que le visiteur a le moyen de le décrypter, sinon autant pas le mettre sur internet... (donc possibilité de decrypter quoi..)
Franchement il y a très peu d'images qui sont affichables dans ton navigateur, mais non récuperables...
Et au pire, un bon capture d'ecran lol... (nan mais je rigole ça c'est vraiment la dernière solution).

signaler à un administrateur
Commentaire de Zeroc00l le 01/07/2007 22:05:39

Tout ça ne sert (encore) strictement à rien ...
Il suffit de vider les fichier temporaires de votre navigateur,
d'aller dans le dossier temporaire ("Content.IE5" pour IE6 et 7) et on trouve toutes les videos, images, musiques, fichiers de toutes sortes ... de n'importe quel site !
Absolument rien n'est caché ... (sauf ce dossier Content.IE5 :) et cela MEME si on affiche les dossiers et fichiers cachés... d'ailleur j'aimerais bien savoir comment fait IE pour le cacher avec ce niveau "inconnu" de protection)

En définitif ces protections ne font que ralentir un peu !
Un p'tit logiciel qui va fouiller dans ce type de repertoire intelligement (genre qui cherche les grosses images si on veut récuperer des images grand format) et hop on récupère tout rapidement.
Cependant ce genre d'astuce m'interesse, car il est utile pour verrouiller les choses aux gens qui n'y connaissent rien...
Et si il veulent vraiment quelquechose et qu'ils ont un grand frere ou une grande soeur qui s'y connait alors il auront ce qu'ils veulent

Ce genre d'astuce aiderait plutôt les gens à se mettre au hack :)
En parant ce genre de protection ils acquierent plus de confiance en eux. Et la prochaine fois qu'il voudront quelquechose et que leur "méthode" echouera ils ne perdront pas espoir en s'imaginant que c'est une variante de ce qu'il connaissent deja (psychologiquement) :)
Si ils butent dès le départ sur des méthodes difficiles il perdent espoir plus vite ...

Le problème étant que toutes les méthodes perdent de leur difficultés avec le temps ...

signaler à un administrateur
Commentaire de arthurmetro le 14/05/2008 18:05:11

c nul, ca protege rien, tu as juste à désactiver le css lol!

signaler à un administrateur
Commentaire de zen69 le 05/01/2009 22:11:33

D'une maniere ou d'une autre un print screen et le tour est jouer... :P

Ajouter un commentaire

Nos sponsors

Sondage...

CalendriCode

Janvier 2009
LMMJVSD
   1234
567891011
12131415161718
19202122232425
262728293031 

Consulter la suite du CalendriCode


Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel BAÏSE, Merci à Vincent pour ses précieux conseils
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés
Temps d'éxécution de la page : 0,234 sec

Google Coop CodeS-SourceS Google Coop CodeS-SourceS


Certaines images présentes sur le site (notament certains avatars) sont issues des collections IconShock, donc si vous souhaitez utiliser ces icons vous devez les acheter, ne les copiez pas et ne utilisez pas dans vos sites et applications sans les avoir commandé.