Druckversion des Themas

Hier klicken um das Topic im Orginalformat anzusehen

Forum Sefrengo.org _ Anwenderforum _ Bild-Text Navigation mit Mousover. Wie?

Geschrieben von: feniweb Mon. 18. December 2006, 07:46

Hallo und willkommen zu einer neuen Woche

Ich habe da wieder einmal ein Frage zu einer Navigation.

Ich möcht eine Bild-Text Navigation mit Mousover erstellen als Hauptnavigation die dann eine Seiten-Navigation aufruft.

Wie erreiche ich das ich zu jedem Huaptnavigations-Ordner ein passendes Bild auswählen kann, mit entsprechendem Mousover. huh.gif

Eine lösung habe ich mit ContentFlex die muss man aber für jede Seite neu erstellen (erschreckend). blink.gif

Hier ein Bild wie ich mir das Vorstelle:



Gruss

Geschrieben von: andi Mon. 18. December 2006, 08:27

morgen

müssen die bilder über ein bildmodul einsetzbar sein? wenn nicht, dann schau dir http://meyerweb.com/eric/css/edge/popups/demo.html mal an.

edit: das ganze funktioniert natürlich auch mit http://meyerweb.com/eric/css/edge/popups/demo2.html.


update: sehe gerade das kann so nicht funktionieren. dazu müsste man im navigations-modul noch eine «bild-templatevariable» spendieren. wäre glaube ich kein grosses unterfangen, nur leider nicht mein «gebiet» biggrin.gif

gruss andi

Geschrieben von: Ute Mon. 18. December 2006, 10:27

Hallo feniweb,

ich habe mich mit dem Thema noch nicht beschäftigt und ich weiss nicht, ob es das ist, was du suchst, aber vielleicht hilft Dir ja das weiter...

http://forum.sefrengo.org/index.php?showtopic=316&hl=bildnavigation

Liebe Grüße
Ute

Geschrieben von: speedweb Mon. 18. December 2006, 10:37

Hallo,
dies ist mit einem allgemeinen JavaScript für mouse over möglich.
Als Image name wird die ID der Kategorie verwendet (oder eine kombination aus fixem Text und der ID)
Das over Image bekommt dann nur einen Textzusatz z.B.: img_id_over.jpg

Gruss Thomas

Geschrieben von: andi Mon. 18. December 2006, 12:00

eigentlich gehörten die bilder ja auch nicht ins markup (designelement).
warum also das ganze nicht normal per listennavigation ausgeben und den hover per css machen (javascript brauchts da weiss gott nicht).

Geschrieben von: feniweb Tue. 19. December 2006, 15:00

@alle
Danke.

Dank den Links bin ich nun bei der Meta-Navigation am testen. Habe da aber einige Verständigungs schwierigkeiten.

hier meine Einstellungen



für das Aktive Template habe ich folgenden Code:
QUELLTEXT
<div class="bildhauptnavi">
<a href="{url}">
<img src="media/bilder-layout/_sw_300-b_img_3299.jpg" width="80" height="80" id="Portrair" onmouseover="MM_swapImage('Portrair','','media/bilder-layout/300-b_img_3299.jpg',1)" onmouseout="MM_swapImgRestore()" /><br/></a>
<a href="{url}" onmouseover="MM_swapImage('Portrair','','media/bilder-layout/300-b_img_3299.jpg',1)" onmouseout="MM_swapImgRestore()">
{name} </a></div>

das was ich nicht verstehe ist warum stellt er mir das 4 mal dar ohmy.gif



Weiss hier jemand Rat. Oder kann mir jemand ein Beispiel aufzeigen, was ich da Einstellen muss. rolleyes.gif

Gruss

edit: habe da schon unterschieliche Einstellungen durchgespielt zeigt aber mit allen Varianten die Navigation 4 mal an.

Geschrieben von: andi Tue. 19. December 2006, 15:34

habe mir die meta-navigation zwar noch nicht angeschaut. aber fehlt dir nicht noch das {name} im aktven template?

QUELLTEXT
<div class="bildhauptnavi">
<a href="{url}">
<img src="media/bilder-layout/_sw_300-b_img_3299.jpg" width="80" height="80" id="Portrair" onmouseover="MM_swapImage('Portrair','','media/bilder-layout/300-b_img_3299.jpg',1)" onmouseout="MM_swapImgRestore()" /><br/>{name}</a>


ich frage mich allerdings, wie du da 4 verschiedene bilder definieren willst/kannst.

edit: völliger schwachsinn was ich da zusammengeschrieben habe...hatte wohl tomaten auf den augen :-)

Geschrieben von: luxli Tue. 19. December 2006, 15:38

@feniweb
Hier mein Beispiel für das 1.Aktive Template

QUELLTEXT
<p class="nav"><a href="cms://idcat=2"><img src="cms://idfile=21" alt="Start" /></a>

insgesammt habe ich 3 Aktive Template mit drei verschiedenen idcat und idfile

"Seiten, wo aktives Template verwendet werden soll" ist bei mir allerdings leer, weil es auf allen Seiten erscheint. Zudem habe ich kein kein "mouseover" und nur links auf Seiten mit Bilder ohne Text. Alles andere habe ich gleich eingestellt wie auf deinem Bild.

ZITAT
das was ich nicht verstehe ist warum stellt er mir das 4 mal dar ohmy.gif

hast Du vielleicht 4 Navigationspunkte mit identischem Text für das Aktive Template angegeben?

Geschrieben von: paulinsche Tue. 19. December 2006, 15:42

du verwendest ja auch immer das gleiche bild.

ich hab mal vor langer zeit unter dedi das gleich verwendet und hab das so umgesetzt.

QUELLTEXT
<a href="{link}" onMouseOver="MM_swapImage('auswahl','','../bilder/nav_{name}_text.gif','{name}','','../bilder/{name}_f2.gif',1)" onMouseOut="MM_swapImgRestore()"><img src="../bilder/{name}.gif" width="50" height="40" alt="{name}" name="{name}" border="0"></a>


die bilder habe ich nach dem ordnernamen genannt. kann man aber auch im {id} lösen.

Geschrieben von: feniweb Tue. 19. December 2006, 15:56

@luxli

Für wie viele navigationpunkte ist das Beispiel? Nur für einen?

QUELLTEXT
<a href="cms://idcat=2"><img src="cms://idfile=21" alt="Start" />


Hast du die cms://idcat=X so eingetragen oder über { url}?

Muss man den nicht für jeden Navigationpunkt eine eigene Konfiguration setzen?
Also bei 4 Navigationen die ganze Metanavi 4 mal.

@andi
Ich verwende das Bild ja, nur einmal?


@paulinsche

Werde dein Beispiel mal austesten. Verstehe ab immer noch nicht recht warum ich die Navi 4 mal erscheint.

Gruss

Geschrieben von: andi Tue. 19. December 2006, 16:05

sorry, die zwei <a>-tags in einem link haben mich verwirrt.
wenn du mehrere links machen willst brauchst du jedoch nicht 4x die meta-navigation. da kannst du unten einfach spalte hinzufügen wählen...oder kapier ichs einfach immernoch nicht was du möchtest? :-)

Geschrieben von: feniweb Tue. 19. December 2006, 17:22

@andi

Also so wie ich das verstehe kann man mit der Meta-Navigation, individele Navigationen erstellen mit allem "schnickschnack" eben mit Bildern usw.

Für jeden Navigation-Link einen eigenen Navigationpunkt

Also meine Nvigation sieht so aus

Hauptnavi-Verzeichnis

- Portrait-Verzeichnis= 1. Navigationspunkt mit individuellen Konfigurationen
- Team
- Büro
- ...
-Service-Verzeichnis= 2. Navigationspunkt mit individuellen Konfigurationen
- Seite1
- Seite2
- ...
- Aktuell-Verzeichnis= 3. Navigationspunkt mit individuellen Konfigurationen
- Seite1
- Seite2
- ...
- Portfolio-Verzeichnis= 4. Navigationspunkt mit individuellen Konfigurationen
- Seite1
- Seite2
- ...


Nun möchte ich für die Unterverzeicnise von der Hauptnavigation also Portrairt, Service, Aktuelles, Portfolio eine Navigation mit unterschiedlichen Bildern und mit dem Verzeichnisnamen + Mousover.

Mit der Meta-Navigation denke ich kann man das gut lösen. Nur verstehe ich nicht warum bei mir das bei dem Portrairt-Verzeichnis 4mal die geliche Navi erstellt. ohmy.gif

Gruss

Geschrieben von: andi Tue. 19. December 2006, 17:29

schick mir doch mal die zugangsdaten per pm, schaus mir gerne an.
ich bin jedoch noch immer der meinung, dass sich eine solche navigation locker mit der listennavigation und ein bischen css lösen lässt.


gruss andi

Geschrieben von: Olaf Tue. 19. December 2006, 17:36

Mal nebenbei, warum nich die normale Listnavi + CSS??? Nur Ordner auswählen, ne Klasse für aktiven Ordner, Id für die Kennzeichnung und dann der Rest in CSS!? Ich seh da überhaupt keine Veranlassung irgendwas anderes einzusetzen.

Geschrieben von: andi Tue. 19. December 2006, 17:39

sag ich doch...sogar schon ganz am http://forum.sefrengo.org/index.php?s=&showtopic=670&view=findpost&p=5243 biggrin.gif

Geschrieben von: luxli Tue. 19. December 2006, 18:02

@feniweb

1. Das ist bei mir ein Navigationspunkt von 3 verschiedenen.

2. Eintag habe ich genau so eingetragen.

3. Nein das Modul nur einmal und darin in deinem Fall 4 Navigationspunkte individuell festlegen. Dazu gibt es wie bei Contentflex unten rechts "Spalte erstellen - löschen"

Bei mir war das Modul "Meta-Navigation" sinnvoll weil die entsprechenden Seiten in der ganzen Ordnerstruktur verteilt sind. Wenn ich mir jedoch deinen letzten Beitrag ansehe schliesse ich mich Olaf an. Mach es mit der Listennavigation.

Geschrieben von: feniweb Fri. 29. December 2006, 11:20

Hallo @alle

Habe nun meine Navigation auf CSS aufgebaub so sieht das nun aus.




nur leider stimmt die Navigationsreihenfolge mit sf-Baumstrucktur nicht überein ist einfach verdreht. huh.gif

sf-Baum ist
1. Protrait
2. Service
3. Aktuell
4. Portfolio

in der navigation ist
1. Portfolio
2. Aktuell
3. Service
4. Portrait


verstehe ich nicht weis da jemand Rat.

Gruss

Geschrieben von: Olaf Fri. 29. December 2006, 11:40

Der ist gut, feni laugh.gif

Die sind schon richtig, du lässt sie nur nach rechts fließen, nu überleg mal was dabei passiert!?

Geschrieben von: bkm Fri. 29. December 2006, 11:41

Ist das ganze mit der Listnavi. entstanden ?, so gibt es den Punkt Sortierung

Unterstützt von Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)