mouseover bei Bildern in der Navigation

  • Meret Rudolf
  • Autor
  • Neues Mitglied
  • Neues Mitglied
Mehr
24 Aug. 2012 20:42 #34964 von Meret Rudolf
mouseover bei Bildern in der Navigation wurde erstellt von Meret Rudolf
Hallo zusammen
Ich würde gerne eine Navigation erstellen, die aus Bildern besteht, bei denen das vorhandene Bild, wenn man mit der Maus drüberfährt, ausblendet und ein anderes Bild eingeblendet wird.
Wie kann ich das in Joomla! lösen? Wenn ich das in einem normalen html mit jQuery mache, kann ich es, ich habe aber keine Ahnung, wie ich das innerhalb von Joomla machen muss.
Vielen DANK!

M.Rudolf

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

Mehr
25 Aug. 2012 09:56 #34966 von Tribal6
Hi Rudolf

Das geht mit Joomla ähnlich wie ohne.
Beim erstellen des Menulinks beim Slider 'Einstellungen für Menulinks' kannst du das normale Menubild auswählen, und da unter Punkt 'CSS-Style für Link' dem <a>-tag gleich noch eine eigene Klasse verpassen. Ginge zwar auch ohne, dann wärst du aber von der Itemid des Menupunktes abhängig. Damit solltest du mindestens jetzt genug Selektoren für die Menupunkte haben.

Als reine CSS-Lösung geht das natürlich mit dem Pseudo-Selektor :hover

Bei der Umsetzung mit JavaScript/JQuery kannst du deine zusätzlichen Scripts und CSS-Sheets einfach über die index.php deines aktuellen Templates reinladen:
Code:
$document = JFactory::getDocument(); $document->addScript (string $url, [string $type = "text/javascript"], [boolean $defer = false], [boolean $async = false]); $document->addStyleSheet (string $url, [string $type = 'text/css'], [string $media = null], [array $attribs = array()]);
Die Doku zu den Funktionen findest du hier:
api.joomla.org/Joomla-Platform/Document/...l#sec-method-summary
Und praktische Beispiele hat's z.B. auch im beez_20-Template.

Viels Spass
Roger

Tue das, was du kannst, mit dem was du hast, da wo du bist.

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

Mehr
28 Aug. 2012 23:09 #34971 von Tribal6
Ich sehe, du hast mittlerweile schon deine nächste Frage im Forum gestellt.
Aber was ist mit dieser hier?

War meine Antwort denn so dermassen unbrauchbar? Und selbst wenn....

Einbisschen Feedback deinerseits dazu wäre nett, denn dann haben die anderen User die hier mitlesen auch was davon, ob das eine Lösung zu dem Problem/der Anforderung sein könnte oder nicht.

Und ich wüsste dann auch, ob ich richtig lag, dir helfen konnte und sich das Antworten gelohnt hat.

Bei
Roger

Tue das, was du kannst, mit dem was du hast, da wo du bist.

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

  • Meret Rudolf
  • Autor
  • Neues Mitglied
  • Neues Mitglied
Mehr
29 Aug. 2012 09:24 #34972 von Meret Rudolf
Meret Rudolf antwortete auf Aw: mouseover bei Bildern in der Navigation
Lieber Roger
Deine Antwort war für mich nicht unbrauchbar. Das mit dem :hover-Selektor, da wär ich selber nicht drauf gekommen, ich kenn mich noch nicht so gut aus mit CSS3. Und ich kann verstehen, dass Du ein Feedback erwartest. Es brauch manchmal ein wenig Zeit.
Leider ist es für diesen Fall nicht ganz das Richtige, es ist aber gut, das zu wissen!

Ich binde Dateien so ein:
Code:
<script type="text/javascript" src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/js/jquery-1.4.4.min.js">

Das, was Du mir vorschlägst, verstehe ich nicht, das ist wohl eine Stufe zu hoch für mich. Und darum kam die Antwort nicht prompt, weil ich versucht hab, es zu verstehen und es nicht klappt...

Mein Anliegen hab ich wohl etwas falsch beschrieben: Auf der Site werden Arbeiten von zwei Malerinnen präsentiert, die als kleine Bilder in einem Block aufgelistet sind.
Wenn man mit der Maus über das Bild fährt, kommt ein anderes Bild mit einem Schriftzug, der etwas über die Arbeit aussagt, wenn man drauf klickt, kommt man auf eine neue Seite, wo dann mehr zu sehen ist über die Arbeit.
Es müsste also nicht zwingend ein Menu sein, auch wenn das suchmaschinentechnisch besser wäre, aber die Malerinnen möchten unbedingt, dass sie alles selber warten und auch selber neue Arbeiten auflisten können (ohne CSS- und Selektorenkenntnisse).
Ich hab gesehen, dass ich, wenn ich ein Bild in einen Beitrag einfüge, unter Erweitert ein alternatives Bild zusätzlich angeben kann (zumindest beim mitgelieferten Editor) und dann bei mouseover was reinschreiben kann.
Nur: WAS genau muss ich da reinschreiben? vollständigen JavaScript-Code?
Wenn Du mir hierzu eine Antwort hättest, wäre ich Dir sehr dankbar!
Auch ein Beispiel würde mir helfen.

Und was meinen zweiten Beitrag in diesem Forum betrifft: Ich bin am Lernen, täglich, ich versuche, alles zu verstehen, und ich will mehr können, als ich in Wahrheit kann, was mich ärgert. Darum habe ich viele Fragen. Ich hoffe, das ist nicht falsch.

Ich entschulgie mich für die Verzögerung und bedanke mich.

Meret

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

Mehr
29 Aug. 2012 21:29 #34978 von Tribal6
Hossa

Ich habe absolut kein Problem damit, wenn du mehrere Fragen offen hast/stellst. Ich wüsste halt gerne, ob meine Antwort ankam, und ob sie brauchbar war, damit man bei Bedarf nachhaken kann.

Ich bin am Lernen, täglich, ich versuche, alles zu verstehen, und ich will mehr können, als ich in Wahrheit kann, was mich ärgert. Darum habe ich viele Fragen. Ich hoffe, das ist nicht falsch.

Bestimmt nicht, im Gegenteil, das ist die beste Motivation und Voraussetzung, dass du dazulernst ;)

Also:

:hover ist nicht CSS3, das gibt's schon länger. Bei CSS3 kommen dann ganz andere verückte Dinge.
( www.w3schools.com/css3/default.asp , wenn du magst)
Aber auch da muss man wieder warten, bis alle aktuellen Browserversionen CSS3 unterstützen. Was vermutlich nicht gleich morgen sein wird, eher übermorgen. Schade eigentlich.

Diese Art, um (mit PHP) JavaScripts in Joomla einzubinden ist halt einfach einbisschen der bessere Weg: Die JS- und CSS-Aufrufe kommen so in den Head-Bereich der Webseite, da wo sie eigentlich korrekterweise hingehören. Deine Art geht auch, hast halt einfach den Quelltext voll JavaScript.

Zu deinem Anliegen:
Wenn die Bilder auch im Content sein können, würde ich mal ein paar Bildergalerien ausprobieren. Viele davon haben auch Thumbnailbilder die mit einem Titel (= [...mousover, was reinschreiben...], die man dann 'Grossklicken' kann.

Editor:
Hab ich nicht wirklich viel Erfahrung damit. Was ich aber weiss, ist dass man beim JCE-Editor ein Bild (oder auch mehrere) in den Content einfügen kann, diesem ein Hover-Bild PLUS ein Pop-Up-Bild zuweisen kann. Wenn ich mich nicht völlig irre.
(Ansonsten möge man mich bitte korrigieren, auch ich lerne gerne dazu).

Ich könnte mir aber vorstellen, das die Lösung mit einer Galerie, wenn's denn eine geeignete gibt, für die Malerinnen vermutlich einfacher zu handhaben wären....

Roger

Tue das, was du kannst, mit dem was du hast, da wo du bist.
Folgende Benutzer bedankten sich: Meret Rudolf

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

  • Meret Rudolf
  • Autor
  • Neues Mitglied
  • Neues Mitglied
Mehr
31 Aug. 2012 09:48 #34988 von Meret Rudolf
Meret Rudolf antwortete auf Aw: mouseover bei Bildern in der Navigation
Lieber Roger
Danke für die ausführliche Antwort.
Ich hab meine Dateien immer so eingebunden, weil das so in den Büchern steht...
tja, ich werds mal auf Deine Weise versuchen.
Das mit dem Editor muss ich noch ausprobieren. Ich weiss einfach nicht, welche Art von Cod eda rein kommt, Probieren geht über Studieren...
Das mit der Galerie hab ich mir auch schon überlegt, ich hab aber bis jetzt keine gefunden, die meinen Ansprüche entspricht. Kein Popup, mehrere Bilder unterschiedlich auf einer Seite angeordnet und noch die Möglichkeit ein h2 und ein p einzufügen für erklärenden Text.
Das klingt schon eher nach einzelnen Beiträgen.

Grüsse

Meret

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

Moderatoren: pascaleTribal6RePaoDragonlordChris Hoefligeradiheutschi.ch
Powered by Kunena Forum

Joomla! Verband Schweiz - Mitglied werden