Button grafisch darstellen

Status
Nicht offen für weitere Antworten.

binichnicht

Mitglied
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 ... 🙁

Code:
<!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
 
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. :?
 
danke, habs geschafft. am einfachsten lässt es sich realisieren, wenn man ein <input ...> tag verwendet und die parameter überträgt.
 
Status
Nicht offen für weitere Antworten.

Zurück
Oben