# Button grafisch darstellen



## binichnicht (9. Jul 2007)

Hallo,

ich benötige hilfe bei einem Button.

Der folgende code beinhaltet einen Button der beschriftet ist. Ich möchte anstelle des Buttons ein Bild nutzen.
Eigentlich nichts großes, aber ich komm trotzdem nicht dahinter ...   


```
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html>
<head>
<title>Hide/Show Cookie Save</title>
<script type="text/javascript">

var BUTTONTEXT = [ "0" , "1" ];

function initPage() // ...wird nach dem Laden der Seite aufgerufen
{
	// "Shortcuts" für die benutzten HTML-Elemente
	oMyDiv = document.getElementById( "myDiv" );
	oMyButton = document.getElementById( "myButton" );
	

	// Gibt's hier Cookie? Wenn ja, speichere sie in einem assoziativen Array 
	myCookies = getCookies();
	
	// Gibt's ein Cookie mit Namen "HIDEDIV"? Wenn dieser den Wert "0" hat, blende den Layer ein 
	if ( myCookies[ "HIDEDIV" ] == 0 )
	{
		oMyDiv.style.display = "block";
		oMyButton.firstChild.nodeValue = BUTTONTEXT[ 0 ];
	}
};

function doIt()
{
	var isHidden = ( oMyDiv.style.display != "none" ) ? 1 : 0;
	oMyDiv.style.display = ( isHidden ) ? "none" : "block";
	oMyButton.firstChild.nodeValue = BUTTONTEXT[ isHidden ];

    // Ich habe den Button gedrückt. Je nach Status ist "isHidden" 1 oder 0. Dieser Wert wird gespeichert.	
	setCookie( "HIDEDIV" , isHidden );
}

// ********************** cookie Funktionen ************************

function getCookies()
{
    var result = [] , i , values ,
    storedCookies = document.cookie.split(";"); 
    // Der Cookie ist ein ";"-getrennter String. Bsp:   AAA=1;BBB=C
    // Lese den Cookie ein und erzeuge daraus ein Array
    // storedCookie[0]="AAA=1";
    // storedCookie[1]="BBB=C";
    
    for ( i=0;i<storedCookies.length;i++)
    {
            values = storedCookies[ i ].split("=");  
			/// AAA=1 wird zu values[0]="AAA" und values[1]=1;
			
		    result[ values[0].replace(/^ /,'') ] = values[ 1 ]; // Leerzeichen entfernen
		    // result["AAA"]=1
    };
    return result;
}

function setCookieTime( days )
{
    if ( !days ) // Wenn keine Anzahl Tage angeben wurde, nehmen einen sehr weit entfernten Tag, d.h. der Cookie bleibt sehr lange gültig
       return ( new Date( 2037 , 0 , 1 )).toGMTString();
       
    return new Date( ( new Date().getTime() + 1000 * 3600 * 24 * days ) ).toGMTString();
}



function setCookie( name , value )
{
	// Hier wird ein  Cookie gesetzt, der "ewig" bestehen bleibt
    document.cookie = name + "=" + unescape( value ) + ";"+
       "expires=" + setCookieTime()  + ";";
}

function deleteCookie( cookieName )
{
	// Lösche den Cookie: Das Ablaufdatum ist gestern und somit wird der Cookie gelöscht
    document.cookie = coookieName + "=;expires=" + setCookieTime( -1 );
}

// ********************** cookie Funktionen ( END ) ************************


-->
</script>

<style type="text/css">

</style>
</head>

<body onload="initPage()">
<button onclick="doIt()" id="myButton">Show</button>
<div id="myDiv" style="display:none">Dies ist ein Text</div>

</body>
</html>
```

wär echt nett wenn ihr mir helfen könntet.

ps: hab die suchfunktion benutzt aber nichts gefunden


----------



## The_S (9. Jul 2007)

Java ist nicht JavaScript


----------



## binichnicht (9. Jul 2007)

sry, wusste ich nicht. würd mich über ne antwort freuen, ansonsten kann das thema geschlossen werden.


----------



## merlin2 (9. Jul 2007)

Na ja, wenn ich die Frage richtig verstehe, kann man doch einfach anstatt des Button-Tags ein Img-Tag verwenden. :?: 
Ich werde keinen Code posten, unter anderem, weil dein Code bei mir nicht funktioniert. :?


----------



## Wildcard (9. Jul 2007)

*verschieb*


----------



## binichnicht (12. Jul 2007)

danke, habs geschafft. am einfachsten lässt es sich realisieren, wenn man ein <input ...> tag verwendet und die parameter überträgt.


----------



## merlin2 (13. Jul 2007)

Abharken!


----------

