[mike-b]

Servus,

Ich möchte gerne das mouseover eines div-containers per java script ändern. Im mouseover wird jedoch eine funktion ausgeführt.

Die grösse und der Z-index lassen sich soweit ändern, leider das mouseover nicht:

card = document.getElementById('t'+array[1]);	
card.style.top = 470;
card.style.left = 270;
card.style.zIndex = 200;

card.onmousevver = 'Tip(\'test\')';

Gibts hier eine lösung?

Grus
Mike

[RoToRa]

Im DOM verlangen Event-Handler eine Funktionsreferenz und nicht einen String. Wenn deraufzurufende Funktion keine Parameter ubergeben werden sollen, reicht eine direkte Zuweisung:

card.onmouseover = Tip;

Wenn Parameter übergeben werden müssen, kann man eine anonoyme Funktion verwenden:

card.onmouseover = function() {
   Tip("test");
};

Hier gibt es übrigens auch ein JavaScrip Sub-Forum.

Robin

[mike-b]

hi danke soweit so gut.

Nun setz ich also die mouseovers per javascript. Wie lang ist das mouseover dann gültig? Das ursprüngliche element hat selber ja kein mouseover, denn es wird erst per javascriptfunktionsaufruf zugewiesen.

Ich habe nun das problem, dass wenn ich die funktion 2 mal aufrufe, zwar das 2. element sein mouseover erhält, das erste es aber verliert ... (seite wird nicht neu geladen)

Ausschnitt:

	function reveal_card(){
		card = document.getElementById('card'+karten[1]);
		mouseovertext = document.getElementById('mouseovertext'+karten[1]);
		
		//set visible
		card.style.visibility = 'visible';
		
	
		switch(picked)
		{
			case 1: card.style.top = target_t[picked];
					card.style.left = 270;
					card.onmouseover = function() {Tip('<div align=center><b>1:</b><br><br>' + mouseovertext.innerHTML + '</div>')};
			break;
			case 2: card.style.top = target_t[picked];
					card.style.left = target_l[picked];
					card.onmouseover = function() {Tip('<div align=center><b>2:</b><br><br>' + mouseovertext.innerHTML + '</div>')};
			break;
			case 3: card.style.top = target_t[picked];
					card.style.left = target_l[picked];
					card.onmouseover = function() {Tip('<div align=center><b>3:</b><br><br>' + mouseovertext.innerHTML + '</div>')};
			break;
			case 4: card.style.top = target_t[picked];
					card.style.left = target_l[picked];
					card.onmouseover = function()
					{Tip('<div align=center><b>4:</b><br><br>' + mouseovertext.innerHTML + '</div>')};
			break;
			case 5: card.style.top = target_t[picked];
					card.style.left = target_l[picked];
					card.onmouseover = function() {Tip('<div align=center><b>5:</b><br><br>' + mouseovertext.innerHTML + '</div>')};
			break;
			case 6: card.style.top = target_t[picked];
					card.style.left = target_l[picked];
					card.onmouseover = function() {Tip('<div align=center><b>6:</b><br><br>' + mouseovertext.innerHTML + '</div>')};
			break;
			case 7: card.style.top = target_t[picked];
					card.style.left = target_l[picked];
					card.onmouseover = function() {Tip('<div align=center><b>7:</b><br><br>' + mouseovertext.innerHTML + '</div>')};
			break;
			case 8: card.style.top = target_t[picked];
					card.style.left = target_l[picked];
					card.onmouseover = function() {Tip('<div align=center><b>8:</b><br><br>' + mouseovertext.innerHTML + '</div>')};
			break;
			case 9: card.style.top = target_t[picked];
					card.style.left = target_l[picked];
					card.onmouseover = function() {Tip('<div align=center><b>9:</b><br><br>' + mouseovertext.innerHTML + '</div>')};
			break;
			case 10: card.style.top = target_t[picked];
					 card.style.left = target_l[picked];
					 card.onmouseover = function() {Tip('<div align=center><b>10:</b><br><br>' + mouseovertext.innerHTML + '</div>')};
			break;
		}
	}

Mit mouseovertext.innerHTML hol ich aus DIVs mit den ensprechenden IDs die Texte raus.

[mike-b]

Hat jemand eine Idee?

Gruss Mike

PS: man könnte den post ins javascript-forum verschieben.

[mike-b]

brauchts noch mehr infos? Unklar?

Gruss
Mike

[RoToRa]

Zitat von mike-b

Wie lang ist das mouseover dann gültig?

Solange es nicht überschrieben wird.

Das ursprüngliche element hat selber ja kein mouseover, denn es wird erst per javascriptfunktionsaufruf zugewiesen.

Ich habe nun das problem, dass wenn ich die funktion 2 mal aufrufe, zwar das 2. element sein mouseover erhält, das erste es aber verliert ... (seite wird nicht neu geladen)

Diese Aussagen verstehe ich nicht ganz.

	function reveal_card(){
		card = document.getElementById('card'+karten[1]);

Wo/wie genau wird bestimmt das ein anderes Element angespochen wird? Ändert sich karten[1] zwischen den Aufrufen? Überhaupt finde ich die Verwendung eines hartcodierten Array-Indexes hier etwas merkwürdig.

		switch(picked)
		{
			case 1: card.style.top = target_t[picked];
					card.style.left = 270;
					card.onmouseover = function() {Tip('<div align=center><b>1:</b><br><br>' + mouseovertext.innerHTML + '</div>')};
			break;
			case 2: card.style.top = target_t[picked];
					card.style.left = target_l[picked];
					card.onmouseover = function() {Tip('<div align=center><b>2:</b><br><br>' + mouseovertext.innerHTML + '</div>')};
			break;

Dieser Switch ist auch etwas ungewöhnlich. Es müsste doch auch ohne gehen:

card.style.top = target_t[picked];
card.style.left = picked == 1 ? 270 : target_l[picked];
card.onmouseover = function() {Tip('<div align=center><b>' + picked + ':</b><br><br>' + mouseovertext.innerHTML + '</div>')};

Mit mouseovertext.innerHTML hol ich aus DIVs mit den ensprechenden IDs die Texte raus.

Das hört sich auch nicht besonders sauber an. Werden die mouseovertext-DIVs noch für was anderes verwendet? Wenn nicht wäre es meiner Meinung nach sinnvoller die Texte z.B. in einem JavaScript-Array unterzubringen.

Ansonsten bräuchte ich eine vollständiges funktionierendes Beispiel, am besten als URL, wosie eine Erklärung was passieren soll.

Robin

[mike-b]

"Das hört sich auch nicht besonders sauber an. Werden die mouseovertext-DIVs noch für was anderes verwendet? Wenn nicht wäre es meiner Meinung nach sinnvoller die Texte z.B. in einem JavaScript-Array unterzubringen."

Sind auch Bilder und Formatierungen:

Ein solcher DIV sieht so aus:

<div id="mouseovertext1" style="visibility: hidden;">
<img src="Bilder_gross/1g.jpg" border="0"><br><br><b>Karte 1:</b> Hier steht die Beschreibung der Karte 1.
</div>


"Dieser Switch ist auch etwas ungewöhnlich. Es müsste doch auch ohne gehen:"

->Sollte jedoch nicht den Fehler verursachen

[RoToRa]

Zitat von mike-b

Sind auch Bilder und Formatierungen:

Das ist kein Hindenis.

<div id="mouseovertext1" style="visibility: hidden;">
<img src="Bilder_gross/1g.jpg" border="0"><br><br><b>Karte 1:</b> Hier steht die Beschreibung der Karte 1.
</div>

var mouseovertexte = [
   "<img src=\"Bilder_gross/1g.jpg\" border=\"0\"><br><br><b>Karte 1:</b> Hier steht die Beschreibung der Karte 1.",
   "...",
   "..."
];

(Das HTML könnte auch sauberer sein.)

->Sollte jedoch nicht den Fehler verursachen

Nein, aber ohne funktionierenes Beispiel kann ich den Fehler nicht nachvollziehen.

Robin

[mike-b]

habe nun ziemlich lange rumgeschraubt, die mouseoverbilder krieg ich einfach nicht hin.

Das Problem: Ab die zuletzt gezogene Karte überschreibt die mouseoverbilder der vorhergehenden Karten!

Hier live:

Tarot

hätte jemand einen tip, wo der fehler liegt?

[Hasso]

	function reveal_card(){
		card = document.getElementById('card'+karten[picked]);
		switch(picked)
		{
		
			case 1: card.style.top = target_t[picked];
					card.style.left = target_l[picked];
					card.onmouseover = function() 
(...)

Vielleicht habe ich ja gerade eine Denkhemmung - aber welche Funktion (eine namens function??) rufst du denn beim card.onmouseover auf?