Eingabefeld (textarea) vergrössern / verkleinern

[remopeter]

Hou

Ich habe folgendes Problem:

Auf meiner Seite befindet sich ein textarea. Es ist 400px breit und 100px hoch. Daneben befindet sich ein Icon, dem ein über ein onClick-Event ein Javascript hinterlegt ist. Dieses Script holt sich ein textarea von 400*200px. das kleine textarea wird also aufgeklappt. Nun möchte ich das textarea aber auch wieder zuklappen lassen. Hat jemand so was schon einmal gemacht und wenn ja, wie funktioniert das?

Grüsse aus dem Bärengraben

[kills]

Hi,

ich würd sagen, schau doch einfach mal in die "Antworen-Maske" dieses Forums.

Dort kannst du auch per Link die Textarea vergrößeren und verkleinern.

Gruß,

Markus

[remopeter]

Danke für den Hinweis, aber der bringt mir gar nichts! Mit zwei Icons (oder Links) ist das ganze natürlich kein Problem. Ich habe allerdings nur ein Icon, das zudem noch ändert von (-) nach (+).

[kills]

Du willst also bloß zwischen den beiden Zuständen Wechseln?

[remopeter]

Nein! Ich will, dass das Icon ein (+) anzeigt wenn das Textarea klein ist. Wenn ich auf das Icon klicke soll das textarea gross werden und das Icon soll (-) anzeigen. Wenn ich erneut das Icon anklicke soll das textarea wieder klein werden und das Icon soll wieder (+) anzeigen.

[kingofbrain]

Dann musst Du Dir halt den State des Icons merken und den angezeigten Text ändern.

Ich arbeite nicht mit JavaScript, aber vom Prinzip her funktioniert es so:

ist die textarea gerade gross (=> ist der Button mit "-" beschriftet oder sonst ein gemerktes Merkmal)?

    mach die textarea klein und ändere den Buttontext

ansonsten

    mach die textarea gross und ändere den Buttontext

[/PHP]

Peter

[kills]

Nein! Ich will, dass das Icon ein (+) anzeigt wenn das Textarea klein ist. Wenn ich auf das Icon klicke soll das textarea gross werden und das Icon soll (-) anzeigen. Wenn ich erneut das Icon anklicke soll das textarea wieder klein werden und das Icon soll wieder (+) anzeigen.

nichts anderes hab ich auch gesagt....

function toggleTextarea( boxid) {

	var box = fetch_object(boxid);

	var boxheight = parseInt(box.style.height);

        if ( boxheight == 200) {

            alter_box_height( box, 500);

        } else {

            alter_box_height( box, 200);

        }


}


function alter_box_height(box, pixelvalue)

{

	var boxheight = parseInt(box.style.height);

	var newheight = boxheight + pixelvalue;

	if (newheight > 0)

	{

		box.style.height = newheight + "px";

	}

	return false;

}

// #############################################################################

// let's find out what DOM functions we can use

var vbDOMtype = '';

if (document.getElementById)

{

	vbDOMtype = "std";

}

else if (document.all)

{

	vbDOMtype = "ie4";

}

else if (document.layers)

{

	vbDOMtype = "ns4";

}


// make an array to store cached locations of objects called by fetch_object

var vBobjects = new Array();


// #############################################################################

// function to emulate document.getElementById

function fetch_object(idname, forcefetch)

{

	if (forcefetch || typeof(vBobjects[idname]) == "undefined")

	{

		switch (vbDOMtype)

		{

			case "std":

			{

				vBobjects[idname] = document.getElementById(idname);

			}

			break;


			case "ie4":

			{

				vBobjects[idname] = document.all[idname];

			}

			break;


			case "ns4":

			{

				vBobjects[idname] = document.layers[idname];

			}

			break;

		}

	}

	return vBobjects[idname];

}

musst nur das bild noch drehen....