Gästebuch Inhalte bei "hover" ersichtlich machen

[dremox]

Hallo,

bei meiner PHP/ SQL Seite gibts ein Gästebuch,
ich will nun das ganze so bewerkstelligen das im normal zustand der Seite (sprich die Maus ist irgendwo am Bildschirmrand) nur der Name, Datum und Zeit Balken vorhanden ist (sprich div-Bereich 'gbTitle'). (Ausgabe siehe unten)

			//Abfragen ausgeben  
			printf("<div class=\"gbEintrag\">");  
				printf("<div class=\"gbTitle\">");  
					printf("<b>".$r['gbErs']."</b> hat am <b>".$datum."</b> um <b>".$time."</b> geschrieben:");  
				printf("</div>");  
				printf("<div class=\"gbText\">");  
					printf("<b>Betreff: ".$r['gbBet']."</b><br/>");  
					echo $r['gbText'];  
				printf("</div>");  
				printf("<div class=\"clearer\">");  
				printf("</div>");  
			printf("</div>");  
		}

Wenn man nun aber über eines solche "Kopfzeile" drüber fährt bzw. draufklickt soll der Inhalt (sprich der div-Bereich 'gbText') erscheinen.

Wie kann man das bewerkssstelligen? Mit "onmouseover" etc. hats bei mir auf jeden fall nicht geklappt, vielleicht hab ich da auch was falsch gemacht. (Hab nämmlich versucht den div-Bereich damit einzufassen)
Hoffe ihr versteht mein Problem. Bei weiteren Code Ausschnitten sagts mir.

Danke für eure Hilfe!

[dedlfix]

Hi!

ich will nun das ganze so bewerkstelligen das im normal zustand der Seite (sprich die Maus ist irgendwo am Bildschirmrand) nur der Name, Datum und Zeit Balken vorhanden ist (sprich div-Bereich 'gbTitle'). (Ausgabe siehe unten)

PHP hat keine Ahnung, was eine Maus und ein Bildschirmrand ist. Das findet alles im Browser statt. Es ist daher irrelevant, wie das was letzlich der Browser zu Gesicht bekommt, erzeugt wird. Erstelle zunächst das Ergebnis, wie du es haben willst, zur Not mit festen Dummy-Werten. Erst wenn das wie gewünscht funktioniert, setze es serverseitig mit den passenden Daten zusammen.

  	printf("<div class=\"gbEintrag\">");  
  		printf("<div class=\"gbTitle\">");  
  			printf("<b>".$r['gbErs']."</b> hat am <b>".$datum."</b> um <b>".$time."</b> geschrieben:");  

Du verwendest printf() obwohl du dessen Möglichkeit, mit Platzhaltern zu arbeiten, gar nicht nutzt. Stattdessen nimmst du feststehende String oder stückelst die Strings per Hand selbst zusammen. Dafür kannst du auch echo oder print (ohne f) nehmen.

Größere Texte können auch mit der Heredoc-Syntax mit weniger Aufwand im Script notiert werden.

Außerdem beachtest du die Problematik des Kontextwechsels nicht. Siehe Kontextwechsel erkennen und behandeln (Vorabversion).

Wie kann man das bewerkssstelligen? Mit "onmouseover" etc. hats bei mir auf jeden fall nicht geklappt, vielleicht hab ich da auch was falsch gemacht. (Hab nämmlich versucht den div-Bereich damit einzufassen)

Zum eigentlichen Problem kann ich nichts sagen, weil du den dafür relevanten Code nicht zeigst. Das was dein PHP erzeugt enthält keinerlei sichtbares Javascript. Es sei denn du bringst das beabsichtigt oder unbeabsichtigt durch deine unbehandelten variablen Werte in deine Ausgabe.

Lo!

[dremox]

Hallo, erstmal danke für die Antwort

PHP hat keine Ahnung, was eine Maus und ein Bildschirmrand ist. Das findet alles im Browser statt. Es ist daher irrelevant, wie das was letzlich der Browser zu Gesicht bekommt, erzeugt wird. Erstelle zunächst das Ergebnis, wie du es haben willst, zur Not mit festen Dummy-Werten. Erst wenn das wie gewünscht funktioniert, setze es serverseitig mit den passenden Daten zusammen.

Also bei mir soll die Gästebuchseite so aussehen wie jetzt zum Beispiel die News hier , also vom Prinzip her, bei mir siehts im moment so aus Klick mich!...

Du verwendest printf() obwohl du dessen Möglichkeit, mit Platzhaltern zu arbeiten, gar nicht nutzt. Stattdessen nimmst du feststehende String oder stückelst die Strings per Hand selbst zusammen. Dafür kannst du auch echo oder print (ohne f) nehmen.

was macht das für einen unterschied??

Zum eigentlichen Problem kann ich nichts sagen, weil du den dafür relevanten Code nicht zeigst. Das was dein PHP erzeugt enthält keinerlei sichtbares Javascript. Es sei denn du bringst das beabsichtigt oder unbeabsichtigt durch deine unbehandelten variablen Werte in deine Ausgabe.

was meinst du damit?? willst du den ganzen Code haben?
also bei mir ist eine Tabelle in SQL vorhanden

  
CREATE TABLE `gb` (  
  `gbID` int(11) NOT NULL auto_increment,  
  `gbErs` text,  
  `gbText` text,  
  `gbDate` datetime default NULL,  
  `gbMail` text,  
  `gbBet` text,  
  `gbIP` text,  
  PRIMARY KEY  (`gbID`)  
) ENGINE=MyISAM  DEFAULT CHARSET=latin1 AUTO_INCREMENT=4 ;  

in dieser Tabelle werden die Daten gespeichert, die hier

  
<?php  
	if(isset($_GET['func'])) {  
		switch($_GET['func']) {  
			case 1:  
				showEint();  
			break;  
			case 2:  
				newForm();  
			break;  
			default:  
				showEint();  
			break;  
		}  
	} else {  
		showEint();  
	}  
	function showEint() {  
		printf("<a href=\"?id=3&sub_id=8&func=2\"><span style=\"text-decoration:none; font-size: 14px;\" />>Einen Eintrag hinzuf&uuml;gen<</a><br/><br/>");  
		$sql = "SELECT * FROM gb ORDER BY `gb`.`gbDate` DESC";  
		$result = mysql_query($sql);  
		while ($r = mysql_fetch_array($result)) {  
			## Ausgabe eines Eintrages ##  
			//Datum berechnen  
			$date = date_parse($r['gbDate']);  
			$datum = $date[day].".".$date[month].".".$date[year];  
			if($date[minute] < 10) {  
				$time = $date[hour].":0".$date[minute];  
			} else {  
				$time = $date[hour].":".$date[minute];  
			}  
			//Abfragen ausgeben  
			printf("<div class=\"gbEintrag\">");  
				printf("<div class=\"gbTitle\">");  
					printf("<b>".$r['gbErs']."</b> hat am <b>".$datum."</b> um <b>".$time."</b> geschrieben:");  
				printf("</div>");  
				printf("<div class=\"gbText\">");  
					printf("<b>Betreff: ".$r['gbBet']."</b><br/>");  
					echo $r['gbText'];  
				printf("</div>");  
				printf("<div class=\"clearer\">");  
				printf("</div>");  
			printf("</div>");  
		}  
	}  
	function sendEint() {  
		$name = $_POST['name'];  
		$mail = $_POST['mail'];  
		$betreff = $_POST['betreff'];  
		$text = $_POST['inhalt'];  
		$ip = $_SERVER['REMOTE_ADDR'];  
		## Datum und Uhrzeit bestimmen ##  
		printf("$name");  
		$timestamp = time();  
		$date = date("Y-m-d",$timestamp)." ".date("H:i:s",$timestamp);  
		$fehler_beg = "<ul>";  
		$fehler_end = "</ul>";  
		if($name == "") {  
			$fehler = $fehler."<li>Bitte geben Sie Ihren Namen an.</li>";  
		}  
		if($betreff == "") {  
			$fehler = $fehler."<li>Bitte geben Sie einen Betreff an.</li>";  
		}  
		if($text == "") {  
			$fehler = $fehler."<li>Bitte geben Sie einen Kommentar ab.</li>";  
		}  
		if(!($fehler == "")) {  
			echo $fehler_beg.$fehler.$fehler_end;  
			newForm();  
		} else {  
			$sql = "INSERT INTO `poker`.`gbuch` (`gbID`, `gbErs`, `gbText`, `gbDate`, `gbMail`, `gbBet`, `gbIP`) VALUES (NULL, '$name', '$text', '$date', '$mail', '$betreff', '$ip');";  
			$result = mysql_query($sql);  
		}  
  
	}  
  
	function newForm() {  
		if(isset($_GET['ok'])) {  
			$name = $_POST['name'];  
			$mail = $_POST['mail'];  
			$betreff = $_POST['betreff'];  
			$text = $_POST['inhalt'];  
			$ip = $_SERVER['REMOTE_ADDR'];  
			## Datum und Uhrzeit bestimmen ##  
			$timestamp = time();  
			$date = date("Y-m-d",$timestamp)." ".date("H:i:s",$timestamp);  
			$fehler_beg = "<ul>";  
			$fehler_end = "</ul>";  
			if($name == "") {  
				$fehler = $fehler."<li>Bitte geben Sie Ihren Namen an.</li>";  
			}  
			if($betreff == "") {  
				$fehler = $fehler."<li>Bitte geben Sie einen Betreff an.</li>";  
			}  
			if($text == "") {  
				$fehler = $fehler."<li>Bitte geben Sie einen Kommentar ab.</li>";  
			}  
			if(!($fehler == "")) {  
				echo $fehler_beg.$fehler.$fehler_end;  
			} else {  
				$sql = "INSERT INTO `gimp`.`gb` (`gbID`, `gbErs`, `gbText`, `gbDate`, `gbMail`, `gbBet`, `gbIP`) VALUES (NULL, '$name', '$text', '$date', '$mail', '$betreff', '$ip');";  
				$result = mysql_query($sql);  
				$set = 1;  
			}  
		}  
		if(!($set == 1)) {  
		printf("<form action=\"?id=3&sub_id=8&func=2&ok=yes\" method=\"post\">");  
			printf("<table>");  
			printf("<tr>");  
				printf("<td>Name: </td>");  
			printf("</tr>");  
			printf("<tr>");  
				printf("<td><input type=\"text\" class=\"formulareingabe1\" id=\"gbname\" name=\"name\" value=\"$name\" maxlength=\"40\"></td>");  
			printf("</tr>");  
			printf("<tr>");  
				printf("<td>Mail: </td>");  
			printf("</tr>");  
			printf("<tr>");  
				printf("<td><input type=\"text\" class=\"formulareingabe1\" id=\"gbmail\" name=\"mail\" value=\"$mail\" maxlength=\"50\"></td>");  
			printf("</tr>");  
			printf("<tr>");  
				printf("<td>Betreff: </td>");  
			printf("</tr>");  
			printf("<tr>");  
				printf("<td><input type=\"text\" class=\"formulareingabe1\" id=\"gbbetreff\" name=\"betreff\" value=\"$betreff\" maxlength=\"60\"></td>");  
			printf("</tr>");  
			printf("<tr>");  
				printf("<td style=\"vertical-align:top;\">Kommentar: </td>");  
			printf("</tr>");  
			printf("<tr>");  
				printf("<td><textarea class=\"formulareingabe2\" id=\"gbinhalt\" name=\"inhalt\">$text</textarea></td>");  
			printf("</tr>");  
			printf("<tr>");  
				printf("<td><input type=\"submit\" id=\"gbsubmit\" value=\"Eintragen\"</td>");  
			printf("</tr>");  
			printf("<td>");  
			echo "";  
			printf("</td>");  
		printf("</table>");  
		} else {  
			printf("Danke für Ihren Eintrag. <a href=\"?id=3&sub_id=8\">Hier gehts zum G&auml;stebuch</a><script type=\"text/javascript\">window.location='?id=3&sub_id=8';</script>");  
		}  
	}  
?>  

erfasst und ausgegeben werden...

Hoffe konnte dir das ganze ein bisschen näher bringen.

Danke für die Antwort

[Matze]

Hallo!

Autsch, da hast du dedlfix aber gründlich missverstanden.
Noch einmal deutlich: Alles was in deinem Code PHP und MySQL ist, ist bei deinem Problem irrelevant. Dein Problem findet sich im Browser, nicht auf dem Server, deshalb musst du bei deinen HTML und JS-Teilen ansetzen.

echo/print vs printf: Wenn du printf nur zur Ausgabe verwendest wären echo oder print deutlich performanter. Einfach weniger Arbeit für den Server - schnellere Abarbeitung deines Scripts.

Wie dedlfix bereits vorgeschlagen hat solltest du erst einmal das HTML so schreiben, dass es wie gewünscht aussieht (vor und nach dem Klick). Dann rufst du mit dem kleinen "+/- Link" ein JavaScript auf, das aus dem vorher-HTML das nachher-HTML macht.

Nochmal, mit PHP hat das nichts zu tun. Eher mit HTML und JavaScript.

Grüße, Matze

[dremox]

Hallo Matze,

achso ja da hab ich was falsch verstanden.

Hmm das mit dem HTML scheint zu klappen.

Aber was für ein Java Script soll ich da verwenden? (kenne da xpmenu v2.1)... Nach was soll man da suchen??

Danke für die Antwort

PS: Ausser Performance unterschiede gibts ja bei Printf() keine andere grosse unterschiede, sehe ich das richtig?

[Deus Figendi]

Da du nach "hover" fragst lässt sich das auch ohne JavaScript lösen und ich finde wenn man was ohne JS lösen kann sollte man das auch tun.
Ungetestet müsste z.B. sowas gehen (ich habe mich jetzt nicht durch deinen Code gegraben, daher denke ich mir was eigenes aus):

<ul>  
 <li class="gaestebuch_eintrag">  
  Verfasser am Datum um Uhrzeit  
  <h4>Titel des G&auml;stebucheintrags</h4>  
  <div class="gbe_inhalt">  
   Inhalt des Gaestebucheintrags  
  </div>  
 </li>

Und das passende CSS dazu:

.gbe_inhalt {  
 display:none;  
}  
.gaestebuch_eintrag:hover .gbe_inhalt {  
 display:block;  
}  

Zuzüglich sonstiger Formatierungen, aber so in etwa nochmal die Technik in Kurz:
Verborgenen Inhalt in ein eigenes Element innerhalb des einblendenden Elements notieren.
Verborgenes Element verbergen ;)
Das verborgene Element als Kind von dem einblendenden Element wenn es "gehovert" wird selektieren und einblenden.
Das ganze in php übersetzt:

<?php  
include ('make_mysql_connection.php');  
include ('get_guestbook_entries_from_database.php');  
include ('output_html_declaration.php');  
echo ('<head>  
 <title>Gaestebuch</title>  
 <style type="text/css">  
  .gbe_content {  
   display:none;  
  }  
  .gb_entry:hover .gbe_content {  
   display:block;  
  }  
 </style>  
</head>  
<body>  
 <h1>Mein G&auml;stebuch</h1>  
 <ul id="gb_list">');  
foreach ($guestbook_entries as $key => $value) {  
  echo ('  
  <li class="gb_entry">  
   '.htmlspecialchars($value['author']).' am '.date("d.m.Y",$value['makedate']).' um '.date("h:i",$value['makedate']).'  
   <h2>'.htmlspecialchars($value['subject']).'</h2>  
   <div class="class="gbe_content">'.nl2br(htmlspecialchars($value['content'])).'</div>  
  </li>');  
}  
  echo ('  
 </ul>  
</body>  
</html>');  
?>