Slidermenu für Newsletter

cmfa · 04.03.2011

Hallo Freunde der Nacht,

sicher wird meine Frage im falschen Forumsbereich sein, jedoch möchte ich sie mal stellen. Also bitte nicht gleich los meckern..

Ich bin auf der Suche nach Slidermenu für einen Newsletter. Es soll ein Button sein der beim drücken nach Links die Felder für den Namen und die E-Mail Adresse und den submit Button "ausfährt".
Gesehen habe ich einen solches Menu schonmal, leider habe ich die Seite nicht mehr.
Vlt. weiß ja jemand von euch wo und wie ich da ran komme um für meine Seite so her zu richten.

VG

CMFA

Lueh · 05.03.2011

AW: Slidermenu für Newsletter

Solls animiert sein oder einfach nur erscheinen?

Wenns einfach nur erscheinen soll kannst dus mit $_GET machen!

Mal angenommen der button ist eine Grafik in der index.php, dann kannst du deine Grafik als Hyperlink auf die index.php + einem Parameter verwenden:

PHP:

<a href="index.php?eintragen=true"><img src="button.png"></a>

Natürlich musst du dann in der index.php auch prüfen ob der Parameter "eintragen" gesetzt ist:

PHP:

$formdisplay: 'none';

if(isset($_GET['eintragen'])) {
  $formdisplay: 'block';
}

Weiter unten in der index.php kannst du dann den style für das Formular-div anpassen:

PHP:

echo "<div id=\"form\" style=\"display: $formdisplay\"> --formularcode-- </div>"

Wenns reinsliden soll.... wirds wohl Java werden ^^

Hoffe das hilft dir

mfg Lueh

cmfa · 05.03.2011

AW: Slidermenu für Newsletter

Hi,

danke für deine Antwort. ich bau mir das mal zusammen und dann schaue ich mal.
Ja animiert wäre toll, ist aber am Anfang meines Test nicht sinnvoll und auch nicht erforderlich.

VG

CMFA

fakerer · 05.03.2011

AW: Slidermenu für Newsletter

mit jquery ist das ganze nicht so aufregent
.toggle() – jQuery API

cmfa · 05.03.2011

AW: Slidermenu für Newsletter

Hi fakerer,

ist dir auf der Seite so etwas als tutorial begegnet?

CMFA

MegaAdi · 05.03.2011

AW: Slidermenu für Newsletter

Schau mal hier: Ich denke das ist sowas wie du meinst oder?

fakerer · 05.03.2011

AW: Slidermenu für Newsletter

HTML:

<!DOCTYPE html>
<html>
<head>
  <style>
p { background:#dad;
font-weight:bold;
font-size:16px; }
</style>
  <script src="http://code.jquery.com/jquery-1.5.js"></script>
</head>
<body>
  <button>Toggle 'em</button>

<p>Hiya</p>
<p>Such interesting text, eh?</p>
<script>
$("button").click(function () {
$("p").toggle("slow");
});    
</script>

</body>
</html>

ist kein Tutorial aber ein super Beispiel

anstatt den p einfach eine id von einem div ind dem dein formular für die newsletteranmeldung steckt und fertig

cmfa · 05.03.2011

AW: Slidermenu für Newsletter

hi,

jupp das sieht ja super aus, der Code den ich angehängt habe muss da rein. Wenn ich den einfüge bleibt der beim zuklappen stehen.
mus da weniger rein?

HTML:

<form action="newsletter.php" method="get"> 
    <table width="100%" border="0" cellpadding="3" cellspacing="1">
        <tr><td width="80" align="right">Nachname:</td><td><input type="text" name="name" value="" style="width:20%;" /></td></tr>
        <tr><td align="right">Vorname:</td><td><input type="text" name="vname" value="" style="width:20%" /></td></tr>
        <tr><td align="right">E-Mail:</td><td><input type="text" name="email" value="" style="width:20%" /></td></tr>
        <tr><td>&nbsp;</td><td>anmelden: <input type="radio" name="action" value="rein" checked="checked" /> abmelden: <input type="radio" name="action" value="raus" /></td></tr>
        <tr><td>&nbsp;</td><td><input type="submit" name="submit" value="absenden" style="width:20%" /></td></tr>
    </table>
</form>

CMFA

cmfa · 06.03.2011

AW: Slidermenu für Newsletter

Hi,

so ne Nacht drüber geschlafen und hin bekommen. Zwei Frage bleiben aber die ich noch nicht abschließend klären konnte. Bekommt man die Abstände zwischen den einzelnen Formularfelder verringert? und wie bekomme ich es hin das der Button standardmäßig geschlosssen ist?:hmpf: zur Zeit ist er ja geöffnet wenn die Seite aufgerufen wird.

HTML:

<!DOCTYPE html>
<html>
<head>
  <style>
p { background:#fff;
font-weight:normal;
font-size:12px; }
</style>
  <script src="http://code.jquery.com/jquery-1.5.js"></script>
</head>
<body>
  <button>Newsletter</button>
    <form action="newsletter.php" method="get">
    <p><td>&nbsp;</td><td align="right">Nachname:</td><td>&nbsp;</td><td>&nbsp;</td><td><input type="text" name="name" value="" style="width:10%;" /></td></p>
    <p><td>&nbsp;</td><td align="right">Vorname:</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td><input type="text" name="vname" value="" style="width:10%" /></td></p>
    <p><td>&nbsp;</td><td align="right">E-Mail:</td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<td><input type="text" name="email" value="" style="width:10%" /></td></p>
    <p><td>&nbsp;</td><td>anmelden: <input type="radio" name="action" value="rein" checked="checked" /> abmelden: <input type="radio" name="action" value="raus" /></td></p>
    <p><td>&nbsp;</td><td><input type="submit" name="submit" value="absenden" style="width:5%" /></td></p>
  </form>
<script>
$("button").click(function () {
$("p").toggle("slow");
});    
</script>

</body>
</html>

CMFA