• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

"Einblendung" bei klick auf einen Link

<div id="loginbutton"><a href="" onclick="toggle('logincontainer'); return false"><img src="images/login.png" alt="loginbutton" /></a></div>
Nochmal: Wozu ist das div?

was soll ich denn be href einsetzten?
Na, das Linkziel. Du setzt einen Link, der muss ja irgendwo hinführen. Es hat nicht jeder JavaScript aktiviert, also musst Du in href eine Alternative anbieten.
 
Werbung:
Das div habe ich für den Button hingesetzt, das der nicht irgendwo rumschwirrt, und wegen dem href, soll ich dann extra zu dem auszufahrendem Login ne Seite für den Login machen?
 
Das div habe ich für den Button hingesetzt, das der nicht irgendwo rumschwirrt, und wegen dem href, soll ich dann extra zu dem auszufahrendem Login ne Seite für den Login machen?
Efchen hat schon recht, der Div-Container ist völlig sinnlos, da du genausogut das anchor-Tag positionieren kannst!

Damit das Script funktioniert, muss natürlich ein div-Container mit der id "logincontainer" vorhanden sein! Im Moment ist es jedoch noch so, dass es erst beim zweiten Mal klicken zu- bzw. aufklappt.
 
Werbung:
Das div habe ich für den Button hingesetzt, das der nicht irgendwo rumschwirrt
Das "irgendwo rummschwirren" ist aber eine Sache des Layouts und wird somit durch passende CSS-Eigenschaften für den Link umgesetzt und nicht durch zusätzliche, semantisch überflüssige, Block-Elemente.

Das ist so, als ob Du Deine Weihnachtsgeschenke zweimal einpacken würdest.
 
Ok, ich hoffe es passt jetzt so:

<a id="loginbutton" href="login.php" onclick="toggle('logincontainer'); return false"><img src="images/login.png" alt="loginbutton" /></a>

Aber ich werde dann immer auf die login.php weiter geleitet, er soll aber einfach nur den kleinen logincontainer einblenden.

Grüsse, Joken
 
Dann ist ein Fehler in Deinem JavaScript. Schau in der Fehlerkonsole nach der Fehlermeldung.
 
Werbung:
function toggle(id){
var mydiv = document.getElementById(id);
mydiv.style.display = (mydiv.style.display=='block'?'none':'block');
}

Ist das so korrekt, welche fehlerkonsole meinst du?

Oder kommt bei (id) logincotainer rein.
Sorry, javascript ist für mich völliges neugebiet..
 
Ich meine die Fehlerkonsole, die Dir JavaScript und CSS-Fehler anzeigt.

Im Firefox unter Extras -> Fehlerkonsole.

Ohne Fehlermeldung nach Programmierfehlern zu suchen, ist gemein :-)

Und, syntaktisch mag Dein Script okay sein, aber die Laufzeitfehler sind es ja, die schwierig sind zu finden. Möglicherweise ist bei Dir id NULL. Das siehst Du dann aber in der Fehlerkonsole.
 
Werbung:
Ja das ist die SHCClan.de // Home

Aber nur die index, nicht in den anderen, da ist nur der link drinne. ich poste mal den inhalt der kompletten index.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="sheets/style.css"/>
<script type="text/javascript" src="sheets/javascript.js"></script>
<title>SHCClan.de // Home</title>
</head>
<body>
<div id="header"><?php include ('includes/header.php') ?></div>
<div id="container">
<?php include ('includes/corner.php') ?>
<a id="loginbutton" href="login.php" onclick="toggle('logincontainer'); return false"><img src="http://www.html.de/images/login.png" alt="loginbutton" /></a>
<div id="menu">
<?php include ('includes/menu.php') ?>
</div>
<div id="textcontainer">
<div id="headline">
Home
</div>
<div id="text"><br />Hello and Welcome on the SHC Clan Page.<br />
This is the Homepage of a MTA:SA Race Clanserver.<br />
If you want to Connect to our Server then Browse it or use this Link:<br /><br />
<a href="mtasa://[email protected]:20002/">>Connect&lt;</a></div>
</div>
<div id="footer">
<?php include ('includes/footer.php') ?>
</div>
</div>
</body>
</html>

Und dann habe ich noch eine Frage, ich mache gerade eine Galerie, da mach ich die Thumbnails rein, und verlinke die dann zu den richtigen bildern, ist es irgendwie möglich die richtigen Bilder jeweils in die Seite zu interpretieren anstatt nur die Bilder anzeigen zu lassen?
 
Zuletzt bearbeitet:
Das liegt an dem href="login.php". Damit es funktioniert, solltest du also href="javascript:toggle('logincontainer'); return false" schreiben.
Um das Einloggen nun noch für diejenigen zu ermöglichen, die JavaScript deaktivert haben, müsstest du dafür sorgen, dass dann wieder href="login.php" dort steht, oder andersrum, dass nur für diejenigen href="javascript:toggle('logincontainer'); return false" dort steht, die JavaScript aktiviert haben.

Dabei hilft dir innerHTML (welches Text nur ersetzt, wenn JS aktiviert ist, da es selbst ein JS ist ;)):
Javascript Tutorial - innerHTML

Und dann habe ich noch eine Frage, ich mache gerade eine Galerie, da mach ich die Thumbnails rein, und verlinke die dann zu den richtigen bildern, ist es irgendwie möglich die richtigen Bilder jeweils in die Seite zu interpretieren anstatt nur die Bilder anzeigen zu lassen?
Ich verstehe leider nicht was du meinst... ich habe noch nie Bilder in eine Seite interpretiert! Weißt du überhaupt was interpretieren ist?

Edit: Mal so 'ne Frage nebenbei, warum verwendest du für Passwort und Benutzername das Tag textarea? Schon mal was von input (type="text") gehört?
 
Also das sollte jetzt nur vorrübergehend sein, bis ich mich ein bisschen besser mit php auskenne

Ich probiers mal aus, danke

Also das mit dem javascript funktioniert leider immer noch nicht

Fehlerkonsole sagt:

name: TypeError
message: Statement on line 3: Cannot convert undefined or null to Object
Line 3 of linked script http://shcclan.de/sheets/javascript.js: In function toggle
mydiv.style.display = (mydiv.style.display=='block'?'none':'block');
Line 1 of unknown script
toggle('id'); return false
stacktrace: n/a; see 'opera:config#UserPrefs|Exceptions Have Stacktrace'
 
Zuletzt bearbeitet:
Werbung:
Komando zurück! innerHTML brauchst du dafür gar nicht! Es geht auch so:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Toggle</title>
<script type="text/javascript">
function toggle(id){
    var mydiv = document.getElementById(id);
    mydiv.style.display = (mydiv.style.display=='block'?'none':'block');
}
</script>
</head>
<body>

<a href="login.php" onclick="toggle('logincontainer'); return false">DIV aus-/einklappen</a>

<div id="logincontainer" style="display:none;">
 <form action="">
 <p>
 Benutzername:<br /><input type="text" />
 </p>
 <p>
 Passwort:<br /><input type="password" />
 </p>
 </form>
</div>
</body>
</html>
 
Super, danke, es funktioniert mit dem ausklappen.

So, also nochmal zu der Galerie, also ich wollte ein paar Bilder einfügen, (thumbnails (100px x 75px)), wenn man auf eins der Thumbnails raufklickt, erscheint das bild in groß, nur ich wollte nicht das er es alleine anzeigt, sondern er soll das bild sozusagen auf die seite setzen, hier mal mein versuch das darzustellen

shc.png
 
Dazu gibt es 3 Mögichkeiten:
  1. JavaScript (kann abgeschaltet werden)
  2. manuell für jedes Bild eine neue Seite erstellen (sehr aufwändig)
  3. PHP erstellt dir die Seite (unter Verwendung von GET-Variablen)
 
Werbung:
Am einfachsten ist es auf jeden Fall, wenn du es nicht manuell tun musst, also entweder mit JavaScript oder PHP.
Bei JavaScript gäbe es die Lightbox als vorgefertigtes Script.
Bei PHP wärs ne gute Übung für dich, falls du vor hast, PHP zu lernen.
 
@fiedel: solche drop down menus, wie das auf deiner seite kann man auch mit css machen :p nur so als kleine info ;-)

@joken: vorteil von js ist, dass du tolle übergangseffekte in so einer gallerie einbauen kannst. nachteil: abschaltbar.

ich persönlich würde es mit php machen und versuchen js und deren übergangseffekte da einzubauen. es funktioniert dann immer und sieht bei den meisten noch gut aus ;-)

grüße hokage
 
Werbung:
@fiedel: solche drop down menus, wie das auf deiner seite kann man auch mit css machen :p nur so als kleine info ;-)
Ich kenne nur 2 Möglichkeiten:
  1. mit a:hover, was den Login-Container nicht mit Mausklick, sondern mit Überfahren der Maus ausklappt
  2. mit a:focus, was der IE 6 nicht kapiert
kennst du noch eine 3. Möglichkeit?

Edit: ich bin mir jetzt nicht sicher, ob du "auf deiner Seite" (also auf meiner) oder "auf seiner Seite" meintest...
Doch meine steht gar nicht zur Bewertung aus.
 
@fiedel: ich meinte deine seite. dass sie nicht zur bewertung aussteht ist mir klar. ich habe auch nicht bewertet. ich habe dir einen tipp gegeben.
es gibt natürlich keine weitere css eigenschaft mit der du ein drop down menu basteln kannst. aber unter einbindung von hover, display und noch ei paar anderen sachen geht das ganz prime ;-)
hab ich selbst schon gemacht.
bei interesse, hier mal ein link, wo das erklärt ist:

Drop-Down-Navigationsmenü mit CSS und (fast) ohne Javascript - Tutorial • Peter Kröner, Webdesigner & Frontendentwickler

grüße hokage
 
Zurück
Oben