Graphisches Navmodul

arillus · Beitrag von **arillus** » So 22. Sep 2002, 11:09

Bin auf der suche nach einem graphischen Nav-modul wie auf contenido.de
zum dran rum basteln!

bin leider noch nicht so gut um selber eines zu schreiben, würde mir aber sehr helfen, wenn ich den quellcode zum umbauen bekommen könnte!

Danke im voraus!!

Sven777b · Beitrag von **Sven777b** » So 22. Sep 2002, 18:17

von welchem grafischen Menü redest du? auf Contenido.de ist alles Textbasierend und per CSS ein wenig optsch aufgewertet.
Grafisches Menü besteht bei mir aus Buttons. Und das geht natürlich mit Contenido nicht - zumindest würdest du flexibilität einbüßen. Du müsstest ja jedem Menüpunkt ein eigenes Bild zuordnen.
Zu diesem Punkt habe ich mich schonmal geäußert und gefragt, was dabei rauskommen soll - aber da hab ich keine Antwort erhalten.

ekke · Beitrag von **ekke** » So 22. Sep 2002, 19:02

Buttons automatisch zu generieren geht natürlich, beispiel unter
http://www.circle.ch/scripts/ das müßte man mit einer Cachefunktion für die Bilder verbinden, sonst ist die CPU-Belastung zu groß,

Gruss ekke

arillus · Beitrag von **arillus** » So 22. Sep 2002, 19:39

Geht mir hier mehr um diesen Grünen Punkt!! der mir (dem user) anzeigt, wo er ist

Sven777b · Beitrag von **Sven777b** » So 22. Sep 2002, 20:15

ähm.. der Punkt ? das ist bei dem Navmodul welches ich gebastelt habe kein Problem - kann ich auch mit "grünem Punkt" schreiben. Ich habe mich jetzt bei meiner Spielwiese darauf beschränkt, die farbe zu ändern

idea-tec · Beitrag von **idea-tec** » So 22. Sep 2002, 20:34

@Sven
du kannst auch die buttons per CSS einbinden ...

wir haben das auf der www.alugas.de so gemacht ... der text kommt aus dem css, der button wird in der foreach und einer rechenfunktion für die positionierung des <div> gesetzt

han · Beitrag von **han** » So 27. Okt 2002, 22:38

Mit CSS kommt man sehr weit. Habe das navigationsmodul ein bischen angepasst:



<?php
//-----------------------------------------------------------------------------//
$nav_start = '3';
$nav_col_on = "#1c64d1";
// offenen Pfad finden //
$nav_path = array();
$nav_tree = array();
$tmp_idcat = $idcat;
while($tmp_idcat > 0){
array_push($nav_path, $tmp_idcat);
$tmp_idcat = $con_tree[$tmp_idcat][parent];
};
$nav_path = array_reverse($nav_path);
if($nav_path[0] != $nav_start){$nav_path = array($nav_start);};
// Baum sortieren //
for($i = 0;$i < sizeof($nav_path);$i++){
$tmp_found=0;
for($nr = 0; $nr <= $con_tree_max; $nr++){
if($con_tree[$nr][parent] == $nav_path[$i] && $con_tree[$nr][preid] == '0'){$tmp_found=1;break;}
}
unset($tmp_level);$tmp_level = array();
do{
array_push($tmp_level , $nr);
$nr = $con_tree[$nr][postid];
} while($nr != '0' && $tmp_found==1);
if($i == 0){$nav_tree = $tmp_level;}
else {
$x = array_search("$nav_path[$i]", $nav_tree);
array_splice($nav_tree, $x+1, 0, $tmp_level);
};
};
// Baum ausgeben //
echo "<table width=100% cellspacing=\"5\" cellpadding=\"0\" border=\"0\">\n";
echo "<div id=\"Button\"><ul>";
foreach($nav_tree as $nr){
if(($con_tree[$nr][public] == '1' or $auth->auth["uid"] != "nobody") and $con_tree[$nr][visible] == '1') {
unset($mod_space);$mod_space = array();
$mod_space = array_pad($mod_space,($con_tree[$nr][level] - 1)," ");
if($nr == $idcat){
echo "<li> <a style='background-color:".$nav_col_on."' href=\"".$con_tree[$nr][link]."\" >".implode("",$mod_space)." ".$con_tree[$nr][titel]."</a></li>"; }
else {
echo "<li> <a href=\"".$con_tree[$nr][link]."\" >".implode("",$mod_space)." ".$con_tree[$nr][titel]."</a></li>";
};

};
};
unset($nav_tree);unset($nav_path);
echo "</ul></div></table>";
?>



und folgendes im STYLES.CSS eingebunden:

#button { color: white; font-style: normal; font-weight: bold; font-size: xx-small; font-family: "Trebuchet MS", "Lucida Grande", Verdana, Lucida, Geneva, Helvetica, Arial, sans-serif; background-color: #8ac0d2; margin-top: 1em; margin-bottom: 0em; padding: 0; width: 155px }
#button li a { color: #fff; text-decoration: none; background-color: #8ac0d2; display: block; padding: 3px 3px 3px 0.5em; border-right: 1px solid #508fc4; border-left: 10px solid #1958b7; width: 100% }
html>body #button li a { width: auto }
#button li a:hover { color: #5a128f; background: #8ac0d2 url(../img/logokerk.gif) no-repeat; border-right: 1px solid #5ba3e0; border-left: 10px solid #1c64d1 }
#button ul { background-color: #8ac0d2; list-style-type: none; list-style-position: outside; margin: 0; padding: 0; border: none }
#button li { background-color: #8ac0d2; margin: 0; border-bottom: 1px solid #90bade }
#button li a:active { color: #5a128f; background: #8ac0d2 url(../img/logokerk.gif) no-repeat; border-right: 1px solid #5ba3e0; border-left: 10px solid #ff1027 }

Selbstverständlich sollte im ID #button li a:active ein passendes hintergrundbild gesetzt werden...

ekke · Beitrag von **ekke** » So 27. Okt 2002, 22:52

mit automatischer Buttongenerierung als gif/png/jpg:

http://contenido.de/forum/viewtopic.php?p=1164#1164

Gruss ekke