farbverlauf / tab design
-
Hi,
Habe ein kleines Problem.
Bei diesem Treeview mit tabs:http://www.bilder-space.de/bilder/488cc9-1275906341.png
Beim ausgewählten tab, oder wenn man mit der Maus über eins fährt soll es die selbe Farbe wie der Hintergrund des Treeviews haben.
Wie ihr sehen könnt habe ich das soweit.
Nur sollte die div in dem die Tabs ordner und Tickets drinnen sind als Hintergrundfarbe Grau sein(momentan hat sie die selbe wie der Treeview), allerdings wüsste ich nicht wie ich diese Grau machen kann und die Tabs trozdem in genau der Farbe haben kann wie beim Treeview(da die Farbe vom Treeview ja von rechts nach links immer heller wird, und wenn ich für die tabs die selbe Hintergrundfarbe angeben würde dan würde Tcikets nicht zum Treeview passen.)
Und der Border-Bottom sollte die selbe farbe wie das ausgewählte tab haben.Hoffe konnte mein problem verständlich rüber bringen, und danke jetzt schonmal für jegliche Hilfe.
Gruss,
JCarlson
-
Hallo,
du legst das Hintergrundbild in den Treeview-Div und positionierst es nicht an Stelle 0,0 sondern außerhalb des Containers (zum Beispiel -50,-50) => Voraussetzung ist natürlich dass das Bild breit (hoch) genug ist um dann den Treeview-Tab und die Tabs ansich auszufüllen. Dann kannst du den zugrundeliegenden Container und die nicht aktivien Tabs grau einfärben. Den Border des aktiven Tabs kann man mit border-bottom:0px; ausblenden, dann ist der Übergang fließend.
Edit: Noch was vergessen. Der unterste Container hat z-index:0 und alle anderen z-index:1. Dadurch erreichst du dass das Bild auch wirklich nur auf Ebene 1 und nicht auf Ebene 0 zu sehen ist ^^.
VlG
-
Hey Random,
Bei dem Background-Design geht das auf diese Art nicht, da ich kein Bild verwende sondern ein filter: gradient: .
Und zum Border, habe 0px und none bereits ausprobiert, dabei wäre das problem dan allerdings das er den kompletten Border nicht anzeigt anstatt nur den kleinen Part des ausgewählten divs.
-
Hallo,
1. CSS-Filter funktionieren nur im IE! Es wäre aus Kompatibilitätsgründen sicher besser ein Bild zu verwenden.
2. versuch das gleiche mal mit border-bottom anstelle von nur border
VlG
-
1. Das ganze mit einem Bild machen soll ich vermeiden. Daher erhoffe ich mir eigentlich einen anderen Vorschlag.
Und, der Farbverlauf geht auch mit anderen Browsern
http://matthiasschuetz.com/css-cross-browser-farbverlaeufe-erstellen2. Habe natürlich ein Border-bottom probiert gehabt.
-
Hallo,
ok dann Folgendes:
nimm einen großen Container und gib ihm den Hintergrund. leg alle anderen Container die du benötigst über diesen drüber, aber lass sie transparent. Färbe lediglich die inaktiven Tabs ein. Für den Bereich in dem sich kein Tab befindet, nimmst du ebenfalls einen div, den du nach belieben einfärbst.
Dein Border-Problem kann ich ehrlich gesagt nicht wirklich nachvollziehen.
VlG
