[gelöst] dynamische Größe von Buttons in NAV_LIST_UL

[Freeder]

Hallo,
Ich würde gern einen dynamischen Button mit der besagten Menüstruktur erstellen.
Mein Button hat runde Ecken und einen Schatten. Damit dieser sich dynamisch an die Länge des Menüpunktes anpasst, habe ich ihn in 2 Teile geteilt. Der Anfang ist kurz und das Ende ist viel länger und passt sich somit an die Länge der Schrift an, da nur der nötige hintere Teil angezeigt wird (durch float:left)

Ich wollte das ganze wie folgt lösen:
der vordere Teil des Buttons wird im CSS für den Linktag (<a>) definiert. Um das hintere Bild anzuzeigen, habe ich dies für einen zusätzlichen <b> tag definiert, welcher in <a href....></a> drin stehen soll.

mein CSS Code lautet wie folgt:

Code: Select all

ul.list_top, ul.list_level {
	padding:5px 0 0 1em;
	margin:0;
	list-style:none;
	height:42px;
	position:relative;
	background:transparent;
	font-size:12px;
}


ul.list_top li, ul.list_level li {
	float:left;
	height:42px;
	margin-right:1px;
}

ul.list_top li a, ul.list_level li a {
	display:block;
	float:left;
	height:42px;
	line-height:55px;
	color:#000;
	text-decoration:none;
	font-family:arial, verdana, sans-serif;
	font-weight:bold;
	text-align:center;
	padding:0 0 0 17px;
	cursor:pointer;
	background:url(../../../bilder/button_links.png) no-repeat;
}

ul.list_top li a b, ul.list_level li a b {
	float:left;
	height:42px;
	display:block;
	padding:0 17px 0 0;
	background:url(../../../bilder/button_rechts.png) no-repeat right top;
}

ul.list_top li a:hover, ul.list_level li a:hover {
	color:#000; background: url(../../../bilder/button_hover_links.png) no-repeat;
}

ul.list_top li a:hover b, ul.list_level li a:hover b {
	background:url(../../../bilder/button_hover_rechts.png) no-repeat right top;
}

ul.list_top li.active a, ul.list_level li.active a {
	color:#000;
        background: url(../../../bilder/button_active_links.png) no-repeat; cursor:default;
}

ul.list_top li.active a b, ul.list_level li.active a b {
	color:#000;
	background:url(../../../bilder/button_active_links.png) no-repeat;
}

Mein Problem ist folgendes: wie bekomme ich in jeden Link noch das <b> rein mit phpwcms?
Ich hab schon ewig gesucht, nach Stellen oder Dateien, die ich verändern muss. Theoretisch könnte das <b> ja auch vorangestellt sein und die Bilder somit umgekehrt definiert sein (so, dass der <b>-Tag das erste Bild beinhaltet und der <a>-Tag das 2.), aber das dürfte dasselbe Problem sein!

Es wäre toll, wenn ihr mir helfen könntet!

[Oliver Georgi]

{NAV_LIST_UL:
menu_type,
start_id,
max_level_depth,
class_path,
class_active,
ul_id_name,
wrap_ul_div(0 = off, 1 = <div>, 2 = <div id="">, 3 = <div class="navLevel-0">),
wrap_link_text(<em>|</em>
}

In Deinem Beispiel also irgendwas in diese Richtung.
{NAV_LIST_UL: , , , , , , , <b>|</b>}

Ergibt dann vereinfacht:
<ul><li><a><b>Text</b></a></li></ul>

Oliver

[flip-flop]

Hier das ganze einmal dargestellt:
-> Horizontaler Schiebetüreffekt Analog anzuwenden mit <b>
-> NAV_LIST_UL (Parameter)

Knut

[Freeder]

Vielen Dank!
anhand des Tutorial konnte ich das ganze gut umsetzen
Ihr habt mir sehr geholfen, ich war mir zwischenzeitlich nicht sicher, ob diese Lösung überhaupt möglich ist!