php-resource



Zurück   PHP-Scripte PHP-Tutorials PHP-Jobs und vieles mehr > Entwicklung > HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS
 

Login

 
eingeloggt bleiben
star Jetzt registrieren   star Passwort vergessen
 

 

 


HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS Probleme mit HTML5, Bootstrap oder jQuery ?

Antwort
 
LinkBack Themen-Optionen Bewertung: Bewertung: 1 Stimmen, 5,00 durchschnittlich.
  #1 (permalink)  
Alt 22-05-2010, 18:32
PHP-Master07
 Registrierter Benutzer
Links : Onlinestatus : PHP-Master07 ist offline
Registriert seit: Nov 2007
Ort: Austria (currently US)
Beiträge: 33
PHP-Master07 ist zur Zeit noch ein unbeschriebenes Blatt
PHP-Master07 eine Nachricht über ICQ schicken PHP-Master07 eine Nachricht über AIM schicken PHP-Master07 eine Nachricht über Yahoo! schicken
Standard [JavaScript] Fehler aufgrund eines "Verbotszeichen"

Hallo!

Hier erst einmal mein Quell-Code, darunter dann die Beschreibung des Fehlers:

HTML-Code:
<html>
	<head>
		<title>
			Notes 0.4a
		</title>
		<style type="text/css">
			body {
				background-color: #ccc;
				overflow: auto;
			}
			p {
				margin: 0px;
			}
			div {
				border: 1px solid black;
				background-color: #ffc;
				position: absolute;
				padding: 0px;
			}
		</style>
		<script type="text/javascript">
			//Variablen für Neue Notizen
			var createNote = false;
			var firstMouseMove = false;
			var startLeft = false;
			var startTop = false;
			var activeNote = false;
			var newWidth = false;
			var newHeight = false;
			var i = 1;

			//Variablen für Änderung der Größe
			var resizeNote = false;
			var resizeWidthLeft = false;
			var resizeWidthRight = false;
			var resizeHeightTop = false;
			var resizeHeightButtom = false;
			var offsetX = false;
			var offsetY = false;
			var startWidth = false;
			var startHeight = false;

			//document.onmousedown
			document.onmousedown = function(e) {
				if(!e) {
					e = window.event;
				}
				//Wenn linke Maustaste gedrückt wird!
				if(e.which == 1) {
					//Evtl. Bug-Fix für IE (?)
					if(!e.pageX) {
						e.pageX = e.clientX;
						e.pageY = e.clientY;
					}
					//Wenn nicht auf die Scrollbar gedrückt wird
					if(e.pageX < document.body.scrollWidth) {
						//Wenn auf leere Fläche gedrückt wird
						if(e.target.tagName == "HTML" || e.target.tagName == "BODY") {
							createNote = true;
							startLeft = e.pageX;
							startTop = e.pageY;
							newdiv = document.createElement("div");
							document.body.appendChild(newdiv);
							activeNote = document.body.lastChild;
							activeNote.setAttribute("id", i);
							i++;
							activeNote.style.left = startLeft + "px";
							activeNote.style.top = startTop + "px";
							activeNote.style.width = "0px";
							activeNote.style.height = "0px";
						}
						//Wenn auf vorhandene Notiz gedrückt wird
						if(e.target.tagName == "DIV") {
							startLeft = parseInt(e.target.style.left);
							startTop = parseInt(e.target.style.top);
							startWidth = parseInt(e.target.style.width);
							startHeight = parseInt(e.target.style.height);
							offsetX = e.pageX - startLeft;
							offsetY = e.pageY - startTop;
							if(offsetX < 5) {
								resizeWidthLeft = true;
							}
							if(startWidth-offsetX < 5) {
								resizeWidthRight = true;
							}
							if(offsetY < 5) {
								resizeHeightTop = true;
							}
							if(startHeight-offsetY < 5) {
								resizeHeightButtom = true;
							}
							if(resizeWidthLeft || resizeWidthRight || resizeHeightTop || resizeHeightButtom ) {
								resizeNote = true;
								activeNote = e.target;
							}
						}
					}
				}
			};

			//document.onmousemove
			document.onmousemove = function(e) {
				//Platzhalter: Hier wird die Größe der Notiz gleich bestimmt während dem "Ziehen" mit der Maus
			};

			//document.onmouseup
			document.onmouseup = function(e) {
				if(!e) {
					e = window.event;
				}
				//Mindestgröße 150x75 und Notizen nicht über die Scrollleisten schauen lassen
				if(createNote || resizeNote) {
					if(newWidth < 150 || !newWidth) {
						activeNote.style.width = "150px";
					}
					if(newHeight < 75 || !newHeight) {
						activeNote.style.height = "75px";
					}
					if(parseInt(activeNote.style.left)+parseInt(activeNote.style.width) > window.innerWidth) {
						activeNote.style.left = (window.innerWidth-parseInt(activeNote.style.width)-2) + "px";
					}
					if(parseInt(activeNote.style.top)+parseInt(activeNote.style.height) > window.innerHeight) {
						activeNote.style.top = (window.innerHeight-parseInt(activeNote.style.height)-2) + "px";
					}
				}
				//Alle Werte zurücksetzen
				createNote = false;
				startLeft = false;
				startTop = false;
				activeNote = false;
				newWidth = false;
				newHeight = false;
				resizeNote = false;
				resizeWidthLeft = false;
				resizeWidthRight = false;
				resizeHeightTop = false;
				resizeHeightButtom = false;
				offsetX = false;
				offsetY = false;
				startWidth = false;
				startHeight = false;
			};
		</script>
	</head>
	<body>
	</body>
</html>
Ich habe zwar die wichtigsten Sachen im Code kommentiert, will aber trotzdem noch einmal die Funktionsweise erklären: Klickt man auf das Dokument, so wird ein neues DIV-Element erstellt und die Variable createNote auf true gesetzt. Bewegt man dann die Maus, wird die Größe des soeben erzeugten DIV-Elements sofort mitgeändert. (Zurzeit existiert diese Funktion noch nicht und wurde mit einem Platzhalter im Skript versehen.) Beim Loslassen der Maustaste wird überprüft, ob die Standardgröße nicht unterschritten wurde und ob das DIV-Element auch nicht den Rand des Dokuments überschreitet. (Sodass das Dokument nicht unendlich wachsen kann.)

Klickt man auf ein bereits vorhandenes DIV-Element, so wird die Variable resizeNote (sowie resizeWidthLeft, resizeWidthRight, resizeHeightTop und/oder resizeHeightButtom) auf true gesetzt. Bewegt man die Maus, so weiß dann das Skript, was es zu tun hat. (Auch hier steht zurzeit nur ein Platzhalter.) Und beim Loslassen der Maustaste passiert dieselbe Überprüfung wie bei einem neuen DIV-Element.

Das Problem ist nun Folgendes: Wenn ich die Größe ändern will (also auf die äußeren 5 Pixel des DIV-Elementes klicke), entsteht manchmal ein Fehler. Sobald ich die Maus bewege, wird der Cursor durch ein Verbotszeichen (Kreis mit einem schrägen Strich durch - so wie auf den Verkehrszeichen) ersetzt. Dies hat zur Folge, dass das Skript das Loslassen der Maustaste nicht bemerkt und den Teil von onmousemove weiterhin ausführt. Dadurch wird die Variable resizeNote nicht zurückgesetzt und bei einer Mausbewegung wird die Größe weiterhin geändert, obwohl die Maustaste gar nicht gedrückt ist! (Ich habe das Überprüft, indem ich bei onmousemove ein neues P-Element mit irgendeinem Text in den Body geschrieben habe.)

Ich weiß nicht, ob der Fehler browserbedingt ist, oder wie man ihn beheben kann. Ich habe schon alle möglichen Analysen gemacht, doch konnte ich den Fehler nicht feststellen. Könnt ihr mir helfen? Falls das Problem wirklich am Browser liegt, habt ihr vielleicht eine Idee, wie man dieses umgehen kann?

vorerst einmal fürs Lesen.
bereits im Voraus für eure Antworten.
Mit Zitat antworten
  #2 (permalink)  
Alt 22-05-2010, 21:04
AmicaNoctis
  Moderatorin
Links : Onlinestatus : AmicaNoctis ist offline
Registriert seit: Jul 2009
Beiträge: 5.709
Blog-Einträge: 9
AmicaNoctis sorgt für eine eindrucksvolle AtmosphäreAmicaNoctis sorgt für eine eindrucksvolle Atmosphäre
Standard

Hallo,

ja, das kommt vom Brower und du bekommst das weg, indem du in den Events onmousedown und onmousemove false zurückgibst. Zusätzlich könnte es hilfreich sein, einen onselectstart-Handler hinzuzufügen, der ebenfalls false zurückgibt.

Gruß,

Amica
__________________
Hast du die Grundlagen zur Fehlersuche gelesen? Hast du Code-Tags benutzt?
Hast du als URL oder Domain-Beispiele example.com, example.net oder example.org benutzt?
Super, danke!
Mit Zitat antworten
  #3 (permalink)  
Alt 22-05-2010, 23:18
PHP-Master07
 Registrierter Benutzer
Links : Onlinestatus : PHP-Master07 ist offline
Registriert seit: Nov 2007
Ort: Austria (currently US)
Beiträge: 33
PHP-Master07 ist zur Zeit noch ein unbeschriebenes Blatt
PHP-Master07 eine Nachricht über ICQ schicken PHP-Master07 eine Nachricht über AIM schicken PHP-Master07 eine Nachricht über Yahoo! schicken
Standard

Hallo Freundin der Nacht!

Vielen Dank für deine Hilfe. Nun klappt alles so, wie es soll.
Mit Zitat antworten
Antwort

Lesezeichen


Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)
 

Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
5x Praktikum: "Marketing" oder "Webdesign" o. "Kommunikation" ... transparent Jobgesuche 4 18-06-2007 17:02
[JavaScript] "ist Null oder kein Objekt" Fehler MoRpH2k2 HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS 5 18-10-2006 21:14
Soap "Could not connect to host" "HTTP" Fehler. Funktioniert auf localhost aber Tormentor PHP Developer Forum 1 29-09-2006 15:26
[JavaScript] 2 Probleme: "Rückschaltung" und "Ladebildschirm" Sportfreund HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS 2 20-11-2005 11:50
[JavaScript] XHTML 1.0 und Javascript "document.body.scrollLeft" MTCook HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS 1 09-11-2004 18:52

Themen-Optionen
Thema bewerten
Thema bewerten:

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are an


PHP News

ebiz-trader 7.5.0 mit PHP7 Unterstützung veröffentlicht
ebiz-trader 7.5.0 mit PHP7 Unterstützung veröffentlichtDie bekannte Marktplatzsoftware ebiz-trader ist in der Version 7.5.0 veröffentlicht worden.

28.05.2018 | Berni

Wissensbestand in Unternehmen
Wissensbestand in UnternehmenLebenslanges Lernen und Weiterbilden sichert Wissensbestand in Unternehmen

25.05.2018 | Berni


 

Aktuelle PHP Scripte

PHP Server Monitor

PHP Server Monitor ist ein Skript, das prüft, ob Ihre Websites und Server betriebsbereit sind.

11.09.2018 Berni | Kategorie: PHP/ Security
PHP WEB STATISTIK ansehen PHP WEB STATISTIK

Die PHP Web Statistik bietet Ihnen ein einfach zu konfigurierendes Script zur Aufzeichnung und grafischen und textuellen Auswertung der Besuchern Ihrer Webseite. Folgende zeitlichen Module sind verfügbar: Jahr, Monat, Tag, Wochentag, Stunde Folgende son

28.08.2018 phpwebstat | Kategorie: PHP/ Counter
Affilinator - Affilinet XML Produktlisten Skript

Die Affilinator Affilinet XML Edition ist ein vollautomatisches Skript zum einlesen und darstellen der Affili.net (Partnerprogramm Netzwerk) Produktlisten und Produktdaten. Im Grunde gibt der Webmaster seine Affilinet PartnerID ein und hat dann unmittelb

27.08.2018 freefrank@ | Kategorie: PHP/ Partnerprogramme
 Alle PHP Scripte anzeigen

Alle Zeitangaben in WEZ +2. Es ist jetzt 12:53 Uhr.