Désactiver le Ctrl-clic d'Opera pour enregistrer une image par programme?

Je développe une application web qui émule un navigateur de fichiers génériques pour le bureau, mais pour les fichiers téléchargés. Il offre à l'utilisateur plusieurs "vues" pour un dossier, comme une liste, des détails et des vignettes. Il leur permet d'utiliser leurs combinaisons Shift et Ctrl click pour sélectionner plusieurs fichiers à la fois pour des opérations de fichiers en bloc similaires à un navigateur de fichiers traditionnel. Malheureusement, le comportement par défaut d'Opera est de télécharger une image lorsque vous cliquez dessus, ce qui ruine le multi-select Ctrl-Click dans la vue des miniatures. Je suis conscient qu'Opera vous permet de désactiver cela pour votre propre navigateur, mais d'un point de vue UX, je voudrais éviter d'avoir à placer un message sur la page pour expliquer aux utilisateurs comment faire, ou pire encore, avoir à ne pas offrir cette fonctionnalité multi-sélection aux utilisateurs d'Opera.Désactiver le Ctrl-clic d'Opera pour enregistrer une image par programme?

Est-ce qu'il y a peut-être une méta-balise ou une certaine magie javascript que je peux utiliser pour dire à Opera de ne pas télécharger une image lorsqu'un utilisateur clique dessus?

Source

2010-12-09 Pewpewarrows

Vous cliquez sur un fichier et sélectionnez-le séparément? –

@ Álvaro, Un simple clic gauche normal sans modificateurs sélectionne un fichier. Maj-clic sélectionne tous les fichiers entre le dernier sélectionné et celui sur lequel vous avez cliqué. Ctrl-clic ajoute ou supprime la sélection de fichiers individuels. C'est exactement comme ça que fonctionnent les navigateurs de fichiers normaux. – Pewpewarrows

JavaScript n'est pas destiné à faire ce genre de choses - et il ne serait certainement pas agréable de changer le comportement par défaut, quand par exemple, un utilisateur a vraiment l'intention d'utiliser Ctrl-clic pour enregistrer l'image. – casablanca

Voici un petit extrait de code qui illustre le problème (s'il vous plaît noter qu'il est un test rapide et il ne fonctionne pas dans IE):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head><title></title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
<style type="text/css"><!-- 
.selected{ 
    border: 3px solid navy; 
} 
--></style> 
<script type="text/javascript"><!-- 
window.onload = function(){ 
    var pictures = document.getElementsByTagName("img"); 
    for(var i=0, len=pictures.length; i<len; i++){ 
     pictures[i].onclick = function(e){ 
      e.target.className = e.target.className=="selected" ? "" : "selected"; 
     } 
    } 
} 
//--></script> 
</head> 
<body> 

<ul> 
    <li><img src="http://www.gravatar.com/avatar/684a6ebc2185161978cefc855e2b20b4?s=32&d=identicon&r=PG" width="32" height="32" alt="" title=""></li> 
    <li><img src="http://www.gravatar.com/avatar/684a6ebc2185161978cefc855e2b20b4?s=32&d=identicon&r=PG" width="32" height="32" alt="" title=""></li> 
    <li><img src="http://www.gravatar.com/avatar/684a6ebc2185161978cefc855e2b20b4?s=32&d=identicon&r=PG" width="32" height="32" alt="" title=""></li> 
</ul> 

</body> 
</html>

Lorsque vous Ctrl + clic sur une image Opera ouvre un « Enregistrer comme dialogue "seulement parce que c'est un tag <img>. Il convient de noter que l'annulation de l'événement régulier ne fonctionne pas:

e.preventDefault(); 
e.stopPropagation();

images d'arrière-plan ne semblent pas affectés:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head><title></title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
<style type="text/css"><!-- 
.selected{ 
    border: 3px solid navy; 
} 
div{ 
    width: 32px; 
    height: 32px; 
    background: white url(http://www.gravatar.com/avatar/684a6ebc2185161978cefc855e2b20b4?s=32&d=identicon&r=PG) left top no-repeat; 
} 
--></style> 
<script type="text/javascript"><!-- 
window.onload = function(){ 
    var pictures = document.getElementsByTagName("div"); 
    for(var i=0, len=pictures.length; i<len; i++){ 
     pictures[i].onclick = function(e){ 
      e.target.className = e.target.className=="selected" ? "" : "selected"; 
     } 
    } 
} 
//--></script> 
</head> 
<body> 

<ul> 
    <li><div></div></li> 
    <li><div></div></li> 
    <li><div></div></li> 
</ul> 

</body> 
</html>

Ma meilleure solution à ce jour est d'utiliser toute autre balise au lieu de <img>. Je rapporterai si je trouve quelque chose de mieux.

Source

2010-12-09 15:38:05

A travaillé parfaitement! Je vous remercie. – Pewpewarrows

Désactiver le Ctrl-clic d'Opera pour enregistrer une image par programme?

Répondre

Questions connexes