suche navigation die Bilder tauschen kann

irmen · 5. April 2010

Hallo,
ich habe eigentlich zwei Fragen - hab schon seit Stunden gesucht, aber finde nichts, was mir weiterführend erscheint - deshalb bitte ich um einen Tipp:

und gleich vorweg - so soll es im Prinzip sein, wie auf dieser Seite:
http://hasebikes.com/128-0-tandem-liegerad-handbike-Uebersicht.html

erstens:
ich suche eine navigation, die Bilder tauschen kann (wie in der Produktauflistung direkt neben dem Bild)

zweitens:
ich habe eigentlich zwei Navigationen: eine oben (mit Über uns, Produkte, Kontakt und so weiter) und eine, die dann nur auf der Produkteseite wie eine sidebar erscheint - dort sollen die Produkte per rollover auf der Übersichtsseite jeweils angezeigt werden. Kann ich die erste Ebene meiner Seiten in der Oberen Navi anzeigen lassen und die Zweite Ebene (also alle unterseiten von Produkte) in der sidebar?

Ich erwarte hier natürlich keine Fertiglösung - aber vielleicht weiß jemand einen link, der mir weiterhilft - ein jquery oder ein plugin oder nur den Hinweis, dass ich ganz blöd was übersehen habe, und das ganz leicht irgendwo in WP einzustellen ist.

Vielen Dank, für alles was euch einfällt.
irmen

Kirchenschnack · 5. April 2010

Anfänger schreibt mal was

Also das ganze ist nen JS Effekt per Mouseover mit den Bildern sollte also irgendwie durchaus programmierbar sein. Nur wie kann ich leider nicht sagen, da bin ich leider zu blutiger Anfänger für.
Du kannst deine Seiten Navigation durchaus teilen mit dem List Page und include kannst Du nur bestimmte Seiten in einer Navigation anzeigen lassen und an unterschiedlichen Stellen deiner Seite.

Stefan

irmen · 8. April 2010

Hallo ich habe mir aushilfsweise eine navi mit der hand gebaut.
die funktioniert auch.
was ich gerne hier fragen möchte ist:
wie kriege ich das in meine wp-navigation rein. wo muss ich das reinschreiben?
Wie kann ich diesen javascriptbefehl verallgemeinern ...

hier erst mein handgeschribener code:

<div id="einfachnav">
<a href="<?php bloginfo('url'); ?>/?page_id=31" ONMOUSEOVER="document.images['vorschau'].src='<?php bloginfo('template_url'); ?>/images/s-600.jpg';"
ONMOUSEOUT="document.images['vorschau'].src='/images/leer.gif';" ONFOCUS="this.blur()" class="einfachnav-li">S-600</a><br />
<a href="<?php bloginfo('url'); ?>/?page_id=38" ONMOUSEOVER="document.images['vorschau'].src='<?php bloginfo('template_url'); ?>/images/c-500.jpg';"
ONMOUSEOUT="document.images['vorschau'].src='/images/leer.gif';" ONFOCUS="this.blur()" class="einfachnav-li">C-500</a><br />
<a href="<?php bloginfo('url'); ?>/?page_id=33" ONMOUSEOVER="document.images['vorschau'].src='<?php bloginfo('template_url'); ?>/images/s-800.jpg';"
ONMOUSEOUT="document.images['vorschau'].src='/images/leer.gif';" ONFOCUS="this.blur()" class="einfachnav-li">S-800</a><br />
<a href="<?php bloginfo('url'); ?>/?page_id=40" ONMOUSEOVER="document.images['vorschau'].src='<?php bloginfo('template_url'); ?>/images/scomp.jpg';"
ONMOUSEOUT="document.images['vorschau'].src='/images/leer.gif';" ONFOCUS="this.blur()" class="einfachnav-li">SCOMP</a>
</div>
Klicke in dieses Feld, um es in vollständiger Größe anzuzeigen.

und hier wie die wp_navi aussieht in die das können soll:

<div id="produktnav">
<?php
if($post->post_parent)
$children = wp_list_pages("title_li=&child_of=".$post->post_parent."&echo=0");
else
$children = wp_list_pages("title_li=&child_of=".$post->ID."&echo=0");
if ($children) { ?>
<ul>
<?php echo $children; ?>
</ul>
<?php } ?>
</div>
Klicke in dieses Feld, um es in vollständiger Größe anzuzeigen.

vielen Dank für tipp - gerne auch, wo ich das nachlesen kann wie man in die Navi einen javascriptbefehl reinbekommt
Vielen Dank

kaiser · 8. April 2010

Probier lieber einmal nach einer css-Lösung zu suchen: "sliding doors" oder "sprites" oder "und genau das richtige fällt mir jetzt nicht ein"...

... unterm strich machst du block-elemente mit overflow: hidden; und bei .element:hover {background-posistion: 0 -XYpx;}. Dann wandert das Hintergrundbild beim darüber fahren aus dem Viewport weg und ein anderer Teil (Hover-State) wird sichtbar. Ist einfach und problemlos. Außerdem weniger Code und Du kannst nachwievor die normalen wp_list_pages, etc. verwenden.

irmen · 9. April 2010

Ich glaube das geht nicht.
Denn on mouseover soll ja ein Bild an ganz anderer Stelle ausgetauscht werden. zusätzlich zum css rollover.
Und es sollen auch verschiedene bilder eingeblendet werden!

Oder hab ich dich nicht verstanden?

WPDE.org

suche navigation die Bilder tauschen kann

irmen Well-Known Member

Kirchenschnack Well-Known Member

irmen Well-Known Member

kaiser Well-Known Member

irmen Well-Known Member

Nützliche Suchen

suche navigation die Bilder tauschen kann

irmen Well-Known Member

Kirchenschnack Well-Known Member

irmen Well-Known Member

kaiser Well-Known Member

irmen Well-Known Member