Personen auf Bild markieren - Abstand Problem [Archiv] - PHP-Scripte PHP-Tutorials PHP-Jobs und vieles mehr

Archiv verlassen und diese Seite im Standarddesign anzeigen :
Personen auf Bild markieren - Abstand Problem

Hendrik33

23-08-2010, 17:42

Hallo,

habe folgendes Problem. Habe ein Script auf dem ich Personen markieren kann auf Bildern ...

Wenn ich auf das Bild klicke kommt ein Fenster ... Der Abstand ist aber zuweit weg von der Position auf die geklickt wurde beim Bild...

Hat wer ne Lösung für mich an was das liegt?

Der Code:

<style type="text/css">

</style>

<link rel="stylesheet" type="text/css" href="http://images.mainpix.de/styles/layout.css">

<script language="JavaScript" type="text/javascript">
var setX="";
var setY="";
function visible(Ereignis){
if(!Ereignis){
Ereignis = window.event;
}
document.getElementById("nms_auswahl").style.marginLeft = Ereignis.clientX-7;
setX=Ereignis.clientX-7;
document.getElementById("nms_auswahl").style.marginTop = Ereignis.clientY-7;
setY=Ereignis.clientY-7;
document.getElementById("nms_auswahl").style.display = "block";
document.getElementById("nms_auswahl").style.visibility="visible";

document.getElementById("antwort").style.top = setY;
document.getElementById("antwort").style.left = setX;
//document.getElementById("antwort").innerHTML = setX +'-'+setY;
}
function over(newID){
document.getElementById("nms_auswahl_"+newID).style.backgroundColor ="#efefef";
document.getElementById("nms_auswahl_"+newID).style.cursor="pointer";
document.getElementById("nms_auswahl_"+newID).style.hand="pointer"
}
function out(newID){
document.getElementById("nms_auswahl_"+newID).style.backgroundColor ="#ffffff";
}
function name_suchen(){
if(navigator.appName.search("Microsoft") > -1){
http_request = new ActiveXObject("MSXML2.XMLHTTP");
}
else {
http_request = new XMLHttpRequest();
}
}
function namenInhalt(){
if (http_request.readyState == 4){
document.getElementById("antwort").innerHTML = http_request.responseText
}else{
document.getElementById("antwort").innerHTML = '<img src="" border="0">';
}
}
function v_close(){
document.getElementById("nms_auswahl").style.display = "none";
document.getElementById("nms_auswahl").style.visibility="hidden";
}
function v_insert(userID,userNAME){
if(navigator.appName.search("Microsoft") > -1){
http_request = new ActiveXObject("MSXML2.XMLHTTP");
}
else {
http_request = new XMLHttpRequest();
}
document.getElementById("nms_auswahl").style.display = "none";
document.getElementById("nms_auswahl").style.visibility="hidden";
//alert(setX+" - "+setY);
}
function insertInhalt(){
if (http_request.readyState == 4){
bild_neuladen();
}else{
}
}
function bild_neuladen(){
if(navigator.appName.search("Microsoft") > -1){
http_request = new ActiveXObject("MSXML2.XMLHTTP");
}
else {
http_request = new XMLHttpRequest();
}
}
function bildInhalt(){
if (http_request.readyState == 4){
document.getElementById("nms_user").innerHTML = http_request.responseText
}else{
}
}
</script>

<body onload="bild_neuladen();">

<span id="nms_user" class="nms_user"></span>
<div id="gogo">
<div id="nms_bild" class="nms_bild"></div>
<div id="nms_click" class="nms_click" onclick="JavaScript:visible(event);"></div>
<div id="nms_auswahl" class="nms_auswahl">
<form name="fl">
<input type="text" name="name" size="20" value="suche einen Namen" onclick="this.value='';" onkeyup="name_suchen();"><br>
<span id="antwort" class="antwort"></span>
</form>
</div>
</div>
</body>
</html>

unset

23-08-2010, 18:56

Erstmal schön umbrechen, mein Bester!

Hendrik33

23-08-2010, 19:42

Hää?
Wo was wie?

Kropff

23-08-2010, 19:44

Auf "ändern" klicken und dann die extrem langen Zeilen umbrechen.

Peter

Hendrik33

23-08-2010, 20:59

So gemacht ;)
Jetzt hoffe ich auf euch ;)

Hendrik33

25-08-2010, 13:52

Weiß keiner was?

AmicaNoctis

25-08-2010, 14:57

Hallo,

hast du zufällig ein Onlinebeispiel zur Hand? Mit dem Code alleine kann ich das grad nicht nachvollziehen.

Gruß,

Amica

Hendrik33

25-08-2010, 15:13

Kopiere dir einfach den Code ;)
Das langt schon um das Problem nachzuvollziehen

AmicaNoctis

25-08-2010, 15:21

Kopiere dir einfach den Code ;)

Hab ich schon lange. Das ist erstmal schlechtes HTML, der JS-Code ergibt keinen Sinn und von Bildern und neuen Fenstern ist auch nichts zu sehen.

Das langt schon um das Problem nachzuvollziehen

Das langt gerade dafür, zu der Frage zu kommen, wen du hier veralbern willst.

Liefere eine nachvollziehbare und vernünftige Problembeschreibung oder das hier landet im Müll.

Hendrik33

25-08-2010, 16:25

Es geht deshalb nicht da ich umbrechen musste im Code laut euren Moderatoren hier ...
Deshalb wird das Bild auch nicht angezeigt ...

Hier die URL: http://www.ff-mittelsinn.de/test.html

wenn der crossfader kommt dann klicke mal und dann siehste das ne box kommt ...
die ist zu weit von der stelle entfernt wo man geklickt hat. wie kriege ich die näher dran? dass meine ich

eagle275

25-08-2010, 16:37

hm .. auf der Testseite sind es ca 50px rechts, 50 px runter .. was mich irgendwie an eine deiner Styleanweisungen erinnert (left: 50px , top: 50px )...

was passiert denn, wenn du die Werte im "Abschnitt " #gogo mal kleiner machst ?

Hendrik33

25-08-2010, 16:41

dann würde es gehen wenn ich auf 1px mache bei beiden werten...
das problem ist aber, dass der div erst links und von oben bei 50px platziert werden soll (dort wo das bild geladen werden soll)

eagle275

25-08-2010, 16:54

dann mach margin-left und margin-top bei deiner Berechnung jeweils kleiner als nur Ereignis.clientX ( bzw clientY) und passe die Werte für document.getElementById("antwort").style.top / style.left entsprechend mit an

mit

if(!Ereignis){
Ereignis = window.event;
}
document.getElementById("nms_auswahl").style.marginLeft = Ereignis.clientX-48;
setX=Ereignis.clientX-7;
document.getElementById("nms_auswahl").style.marginTop = Ereignis.clientY-48;
setY=Ereignis.clientY-7;
document.getElementById("nms_auswahl").style.display = "block";
document.getElementById("nms_auswahl").style.visibility="visible";

document.getElementById("antwort").style.top = setY-48;
document.getElementById("antwort").style.left = setX-48;
liegt die Antwort-Box schön dicht am Crosshair (zum bleistift)

nur mal so am Rande .. nimm Firefox mit Firebug für die Tests von "sowas" .. da kann man recht schön die Abmessungen solcher berechneter Divs anzeigen lassen

- -