jQueryAdmin Support Thread

[dbs]

wenn die smoothgallery ein problem verursacht, dann ist das nur ein weiteres und nicht die lösung.

[paraurs]

Das ist wohl so...
Ich kann mich allerdings erinnern dass da mal etwas anderes war mit der Smooth Gallery. Wenn du damit auf der gleichen Seite mehrere Slideshows machn möchtest gibt es auch einen konflikt. Hier der link:
http://www.websitebaker2.org/forum/index.php/topic,15904.0.html

By the way: Kann mir einer sagen wie man das jCarouselLite richtig einbindet? Im jQuery Admin ist leider keine richtige Beschreibung drin und mit der Information auf der Herstellerseite kann ich nichts anfangen:

$(function() {
    $(".anyClass").jCarouselLite({
        btnNext: ".next",
        btnPrev: ".prev"
    });
});

Wie rufe ich das Teil denn auf einer WYSIWYG Seite oder im Template auf?

Freundliche Grüsse,

Urs

[BlackBird]

Am einfachsten geht es in Verbindung mit der Foldergallery. Einfach eine Seite mit Typ Foldergallery anlegen und dann dort im Backend das jCarouselLite als Lightbox auswählen. (Kein Preset erstellen!)

[paraurs]

Hallo,

Vielen Dank für den Hinweis. Ich habe das jCarouselLite nun aber in der Brax Highslide Galerie eingebaut da diese eine einfache, geniale Bilderverwaltung im Backend bietet. War eigentlich ziemlich einfach und sieht auch cool aus.

Allerdings gibt es da manchmal ein Problem dass die Thumbs (aus der Brax Highslide Gallerie) im jCaouselLite nicht richtig geladen werden und davon nur etwa ein viertel angezeigt werden. Klickt man im Browser noch einmal auf Aktualisieren laden sie meistens gut(Mac & PC Firefox, Safari, IE)...ausser bei meinem Google Chrome.

Zu sehen hier: http://test.dg-facedesign.ch/pages/referenzen.php

Liegt das vielleicht daran dass die Thumbs der Brax higslide Gallerie nur in der Breite definiert sind und sich das jCarouselLite jQuery schneller lädt als sich die Thumbs geladen haben? Hat da vielleicht gleich jemand eine Ahnung oder kennt dieses Problem?

Hier noch die Einbindung des jQuery JCarouselLite in die Brax Highslide Gallerie. Einfach in den Optionen der Gallerie folgenden Code eintragen:

Kopfzeile:

[[jQueryInclude?preset=jCarouselLite]]

<div class="gallery">
<center>
<button class="prev"><<</button>
<button class="next">>></button>
<div class="jcauto">
<ul>
<div class="highslide-gallery">

Schleife:

<li>
<a class="highslide" onclick="return hs.expand(this)"  href="[LINK]"  title="[ALTTITLE]">
[TITLE]
<br />
[THUMB] </a> <div class="highslide-heading"> [TITLE] </div>
</a>
<br />
</li>

Fusszeile:

</div>
</ul>
</div>
</center>
</div>

Im CSS habe ich dann noch die Klasse "gallery" definiert (Rahmen weg, Farben etc). Mit "jcauto" ruft man das JCarouselLite auf...das musste ich auch zuerst einmal herausfinden...ist so nirgends dokumentiert.

Kann mri da jemand weiterhelfen betreffend den Thumbs die manchmal nicht recht laden?

Freundliche Grüsse,

Urs

[BlackBird]

Probier' mal, ob es hilft, den jCarousel-Code statt im Header am Seitenende zu laden. Dazu editierst Du Dein Preset und fügst oberhalb von dem hier...

<script type="text/javascript">
  if ( typeof 'jQuery' != 'undefined' ) {
    jQuery(document).ready(function($) {
      $(".jcauto").jCarouselLite({

...das hier...

<!-- position: body -->

...hinzu.

Aber eigentlich sollte das keinen Unterschied machen, da mit jQuery(document).ready(function($) { bereits auf das vollständige Laden des Dokuments gewartet wird.

Ansonsten mußt Du mal mit Firebug schauen, ob es im Fehlerfall irgendwelche Fehlernachrichten gibt. Bei meinem Test war alles okay.

Sehr schicke Seite übrigens.

[paraurs]

Hallo,

Sorry für die späte Antwort, ich bin in der Zwischenzeit nicht mehr dazu gekommen.

Ich habe nun die Ausführungen von Blackbird gemacht:

- [[jQueryInclude?preset=jCarouselLite]] in den Footer geschrieben
- [[jQueryInclude?preset=jCarouselLite]] aus den pages entfernt
- <!-- position: body --> in's Preset ergänzt
- <!-- position: head --> im Preset entfernt

Allerdings erscheint das Problem im Google Chrome immer noch.

Mir ist inzwischen etwas aufgefallen. Wenn ich zum ersten mal in Google Chrome auf die Seite gehen laden die Thumbs nicht richtig. Klicke ich dann auf eine andere Seite und klicke danach erneut zurück auf die erste Seite dann werden da die Thumbs richtig geladen. Klicke ich dann wieder auf Aktualisieren laden sie wieder nicht richtig. Vielleicht gibt das noch einen Hinweis auf die Fehlerquelle?

Sehr schicke Seite übrigens.

Herzlichen Dank 

Freundliche Grüsse,

Urs

[BlackBird]

Hm, tja, ich habe mir das mal mit Chrome angesehen, schon komisch. Aber helfen kann ich Dir da leider auch nicht. 

[paraurs]

Safari macht den gleichen Effekt...

[BlackBird]

Da wirst Du Dich rantasten müssen. Schau mal mit den betreffenden Browsern auf die HP von jCarouselLite. Wenn da alles sauber funktioniert, lade jCarouselLite mal statisch statt über JQA. Wenn das keinen Unterschied macht, ersetze die Brax-Gallerie durch statischen HTML-Code, lade dabei aber jCarouselLite wieder per JQA. Usw.

[paraurs]

Ach so:

http://www.gmarwaha.com/jquery/jcarousellite/#knownIssues

jCarouselLite braucht bei Bildern im Slider zwingend eine Angabe von Höhe und Breite. Bei der Brax Higslide Gallerie definiert man aber nur die Breite der Thumbnails welche ich ja einfach mit [THUMB] in der Schleife der Brax Highslide Gallerie aufrufe. Ich habe es mir nun einfach gemacht und habe im CSS des jCarouselLite Plugins (zu finden unter /modules/jqueryadmin/plugins/jCarouselLite/jcarousel.css) einfach die Höhen Angabe fix definiert. Ich habe in meiner Brax Highslide Gallerie die maximale Thumbnail Grösse mit 100 Pixel definiert. Ein Querformat Foto ist somit im Standard 4:3 Format 75 Pixel hoch, ein Hochformat Foto wird dann auf 75 Pixel verkleinert.

Dazu habe ich in der jcarousel.css folgendes ergänzt:

.jcauto img {
  padding: 5px;
  border: 1px solid #ccc;
  height: 75px;
}

Scheint tiptop zu funktionieren.

Vielen Dank Blackbird für deine Inputs und die schnelle Hilfe die du immer gleich anbietest! Weltklasse! 

Freundliche Grüsse,

Urs

[BlackBird]

Freut mich, daß Du eine Lösung gefunden hast. Da hat sich Dein anfänglicher Verdacht ja bestätigt. Eigentlich müßte man sowas mal irgendwo in einer FAQ oder Knowledge Base sammeln... Naja, dieser Thread ist ja auch schon so eine Art Knowledge Base.

[BlackBird]

Mir ist inzwischen etwas aufgefallen. Wenn ich zum ersten mal in Google Chrome auf die Seite gehen laden die Thumbs nicht richtig. Klicke ich dann auf eine andere Seite und klicke danach erneut zurück auf die erste Seite dann werden da die Thumbs richtig geladen. Klicke ich dann wieder auf Aktualisieren laden sie wieder nicht richtig.

Hab dazu gerade zufällig das hier gefunden:

Please note during the screencast I used $(function () {}) - but I’ve had to since change this to $(window).ready. This is because I’m using white-space: nowrap and the width isn’t calculated until after the images are loaded. jQuery’s document ready function fires before the images are loaded - to allow the JavaScript access to the DOM as early as possible.

This wasn’t a problem in the demo because the images were loaded from a local server, and thus loaded fast enough to allow the code to work out the width correctly.

(http://jqueryfordesigners.com/slider-gallery/ - ziemlich weit unten)

Könnte bei solchen Sachen ein Tipp sein.