Antworten auf deine Fragen:
Neues Thema erstellen

Ich weiß nicht, wie ich das mit jQuery realisieren soll

A

arya

Guest

Guten abend,
ich arbeite derzeit en einem neuem Design meiner Firmenseite und habe ein Problem oder vielmehr eine Frage.

Mittig/unten auf der Seite möchte ich es dem Kunden ermöglichen Bilder mittels Klicken auf 3 Links (1,2,3) oberhalb der Bilder manuell durchklicken zu können.

Leider weiß ich nicht wie ich das mit jQuery realisieren kann. Die Bilder sollen dann mit Effekten (Transition, Überblendeffekt, o.ä.) geladen werden.

Hier habe ich einen Link zum fertigen Layout:
Es geht um die rot eingekreisten Links und die darunter angebrachten Bilder.

Ich hoffe ich habe mich einigermßen verständlich ausgedrückt und ihr könnt mir helfen.

Danke
 

Duddle

Posting-Frequenz: 14µHz

AW: Ich weiß nicht, wie ich das mit jQuery realisieren soll

Sowas nennt sich "Slider" und für jQuery gibt es genau für diesen Zweck. Die meisten davon sind recht einsteigerfreundlich und sollten mithilfe der Dokumentation & Beispielen leicht an die eigene Website anpassbar sein.


Duddle
 

darkdevel

Nicht mehr ganz neu hier

AW: Ich weiß nicht, wie ich das mit jQuery realisieren soll

Schau mal hier vielleicht ist da der passende Slider für dich dabei
 
A

arya

Guest

AW: Ich weiß nicht, wie ich das mit jQuery realisieren soll

Danke für eure Antworten.
Ich habe mich für diesen Slider entschieden:
und versucht, diesen in meine Website einzubauen.
Leider funktioniert es nicht. Ich habe den Code auf der Seite kopiert und in meine HTML - Datei an der Position, an der der Slider später erscheinen soll eingefügt. Leider klappt es nicht und ich weiß nicht warum.

Hier ist mal ein Link zur Testseite:
(der Slider befindet sich unten-das orangene Feld)

Was mache ich falsch?
Vielleicht kann mir jemand bei diesem Problem helfen. Ich lerne derzeit noch HTML/CSS und kenne mich mit jQuery kaum aus. Es wäre nett, wenn mich jemand in die richtige Richtung führen könnte.

Danke im vorraus.
 

patrick_l

Hat es drauf

AW: Ich weiß nicht, wie ich das mit jQuery realisieren soll

Boaaah! :lol: Was für ein Link! :)
Herzlichen Dank von mir, darkdevel.

Wow! Auch von mir ein dickes Dankeschön :D Kannte bis jetzt eigentlich nur die gängigsten Slider. Echt klasse wenn man dann mal so einen kleinen Überblick hat :) Merci :D

Vielleicht kann mir jemand bei diesem Problem helfen. Ich lerne derzeit noch HTML/CSS und kenne mich mit jQuery kaum aus. Es wäre nett, wenn mich jemand in die richtige Richtung führen könnte.

Ich würde das Script vom Slider oben mit in den Kopfteil (head) packen oder noch besser nach ganz unten. Aber das nur so nebenbei. ;) Das einzige was ich jetzt auf die schnelle sehen, das du keine Angaben in deinem CSS für den Slider gemacht hast.

Grüße Patrick
 

Duddle

Posting-Frequenz: 14µHz

AW: Ich weiß nicht, wie ich das mit jQuery realisieren soll

hat nur jquery.blinds-0.9.js, die unkomprimierte Version des Scriptes. Im Quelltext bindest du aber js/jquery.blinds-0.9.min.js ein, die dann offensichtlich nicht gefunden wird.


Duddle
 
A

arya

Guest

AW: Ich weiß nicht, wie ich das mit jQuery realisieren soll

Danke nochmal für die Hilfe.
Leider funktioniert es immer noch nicht. Ich habe die Verlinkung zur JS-Datei geändert, das Javascript im Header ausgeführt und in der CSS-Datei Angaben für die Box des Sliders gemacht, aber es tut sich immer noch nichts.

Der Slider an sich funktioniert nicht und die DIV-Box des Sliders sollte eigentlich 20px Abstand nach unten zu den Links haben.

Ich verzweifel hier noch. Leider ist das ganze sehr schlecht dokumentiert und in den Beispieldateien die man auf herunterladen kann, fehlt eine CSS Datei.

Ich habe die geänderten Dateien nochmals auf hochgeladen, falls ihr mir helfen und euch das ganze mal ansehen möchtet.

Ich danke wieder einmal im Vorraus.
 

hub

nicht ganz neu hier

AW: Ich weiß nicht, wie ich das mit jQuery realisieren soll

Hast du das Problem schon gelöst? In deinem Quelltext steht <div id="slideshow"> und im Script versuchst du es mit $('.slideshow') zu initialisieren. Versuche es mal mit <div class="slideshow"> oder wenn es die ID sein soll, mit $('#slideshow') .... Die verwendete CSS findes du übrigens im Archiv "working example".
 
A

arya

Guest

AW: Ich weiß nicht, wie ich das mit jQuery realisieren soll

Hallo,
sorry, dass ich mich solange nicht gemeldet habe. Es hat alles wunderbar geklappt, danke für den entscheidenden Tipp, hub.

Doch jetzt komt das große ABER: ich habe hier bei mir das ganze lokal mit FF, Opera, IE9 getestet und es funktionierte alles einwandfrei.

Nun berichtet mir ein Freund, der die Seite mit IE8 getestet hat, dass der Slider fehlerhast angezeigt wird. Gibt es da irgendeinen Kniff, das Script auch auf dem IE8 lauffähig zu bekommen.

Da ich IE9 installiert habe, wollte ich auch fragen, ob ich irgendwie parallel dazu auch ältere Versionen installieren und laufen lassen kann.

Hier noch einmal der Link zur Testseite:
 

hub

nicht ganz neu hier

AW: Ich weiß nicht, wie ich das mit jQuery realisieren soll

Moin moin,
MS hat nen Browser-Bundle für Entwickler (hab den Link gerade nicht da). Damit kannst du fast alles abdecken. Ältere IE's und jQuery haben das Problem, mit undefinierten Größen umzugehen. Das Ergebnis ist, das jQuery versucht, mit 'undefined' zu rechnen und packt das nicht. Da hilft dir nur der Debugger zum Finden der Stelle und das entsprechende Element per CSS vorzubelegen oder es mit Javascript in deiner entsprechenden Funktion zu beheben.

Gruß Ulli
 

hub

nicht ganz neu hier

AW: Ich weiß nicht, wie ich das mit jQuery realisieren soll

Ich bin es nochmal,
ich habe mir den Online-Quellcode mal angeschaut. Ich kenne zwar das Plugin nicht, aber mir ist aufgefallen, das du die Div-Elemente ansprichst, obwohl sie zu dem Zeitpunkt zumindest im IE noch nicht existieren. Versuche mal zu warten, bis der DOM vollständig ist, entweder so:
Code:
[SIZE=2]$(document).ready([/SIZE]
 
[LEFT][B][SIZE=2][COLOR=#7f0055][SIZE=2][COLOR=#7f0055]function[/COLOR][/SIZE][/COLOR][/SIZE][/B][SIZE=2]() {[/SIZE][/LEFT]
 
[LEFT][SIZE=2]$('.slideshow').blinds();[/SIZE]
[SIZE=2]$('.slideshow2').blinds();[/SIZE]
[SIZE=2]$('.slideshow3').blinds();[/SIZE][/LEFT]
 
[LEFT][SIZE=2]});[/SIZE][/LEFT]
oder du fügst die Initialisierung unmittelbar vor
Code:
</body>
ein.​

Möglicherweise ist dein Problem damit schon erschlagen.
Sorry, ich kann s gerade nicht testen (oder das hat bis Sonntagabend zeit ) :( ...​

Gruß Ulli​
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Statistik des Forums

Themen
118.611
Beiträge
1.538.342
Mitglieder
67.524
Neuestes Mitglied
BSKGA
Oben