onmousedown, onmousemove & onmouseup

Marsh Posté le 10-05-2005 à 21:06:06

Voila, j'ai créé une "pseudo-fenetre" en utilisant une couche CSS, pour un forum perso.
Cette petite fenetre permet de choisir des emoticons pour insérer leur tag dans un message...je crois meme que son code pourrait en intéresser quelques-uns :sarcastic:

Toutefois j'ai un probleme : quand on utilise les événements onmousedown, onmousemove et onmouseup, il n'est plus possible de faire une sélection du texte normale en le surlignant a la souris !! Alors comment faire pour contourner ce probleme :??:

L'idéal serait de déclencher ces évenements sur le clic permettant l'ouverture de la fenetre, puis de les annuler des que la fenetre est fermée...mais je ne vois pas comment.

Voici le code correspondant : mais bon, vous n'aurez pas les images pour la fenetre

Code :

<html>
<head>
<script language="JavaScript">
N = (document.all) ? 0 : 1; // Permet de connaitre le navigateur utilisé
var winObject, X, Y;
function MDown(e)
{
if (N) { winObject = document.layers[e.target.name]; X=e.x; Y=e.y; return false; }
else { winObject = event.srcElement.parentElement.style; X = event.offsetX; Y = event.offsetY; }
}
function MMove(e)
{
if (winObject)
{
windowHead.src = "bar2.png";
if (N) winObject.moveTo( (e.pageX-X), (e.pageY-Y) );
else
{
winObject.pixelLeft = event.clientX-(X+20) + document.body.scrollLeft;
winObject.pixelTop = event.clientY-Y + document.body.scrollTop;
return false;
}
}
}
function MUp() { winObject = null; windowHead.src = "bar.png"; }
if (N) document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE | Event.MOUSEUP);
document.onmousedown = MDown;
document.onmousemove = MMove;
document.onmouseup = MUp;
</script>
<style type="text/css">
.Window { position: absolute; top: 150; left: 0; height: 300; width: 150; margin: 0; padding: 0; border: 1px solid black; visibility: hidden; }
.WindowButton { position: absolute; top: 0; left: 0; margin: 0; }
.WindowBar { position: absolute; top: 0; left: 20; margin: 0; }
</style>
</head>
<body>
<form name="a">
<textarea name="area"></textarea>
</form>
<IMG SRC="test.gif" STYLE="border: 0px;" onClick='eWindow.style.visibility= "visible";'>
<DIV ID="eWindow" CLASS="Window">
<IMG SRC="close.png" NAME="closeButton" CLASS="WindowButton" onClick='eWindow.style.visibility="hidden";'
onMouseOver="closeButton.src='close2.png';" onMouseOut="closeButton.src='close.png';">
<IMG SRC="bar.png" NAME="windowHead" CLASS="WindowBar">
<BR><IMG SRC="test.gif" onClick='document.forms["a"].elements["area"].value+="[test]";'>
</DIV>
</body>
</html>

Reply

Marsh Posté le 10-05-2005 à 21:06:06

Reply

Marsh Posté le 10-05-2005 à 21:36:48

Super intéressant d'enregistrer les évènements sur le document complet :sarcastic:

et puis

Citation :

document.layers
N = (document.all) ? 0 : 1;

Welcome to 1995, last stop of web coding is you :sarcastic:

http://www.quirksmode.org
ça pourrait te servir je pense [:spamafote]

---------------
I mean, true, a cancer will probably destroy its host organism. But what about the cells whose mutations allow them to think outside the box by throwing away the limits imposed by overbearing genetic regulations? Isn't that a good thing?

Reply

onmousedown, onmousemove & onmouseup

Sujets relatifs:

Leave a Replay