Projekt

Allgemein

Profil

Aktionen

GX-Task #60707

geschlossen

Teaser-Slider Ladeverhalten kann verbessert werden

Von Moritz Bunjes vor fast 6 Jahren hinzugefügt. Vor mehr als 5 Jahren aktualisiert.

Status:
Erledigt
Priorität:
Normal
Zugewiesen an:
Ronald Loyko
Kategorie:
Frontend
Zielversion:
% erledigt:

100%

Steps to reproduce:
Betroffene Versionen:
3.11.2.0, 3.13.1.0 beta1
Release Notes Langtext:

Beim Laden des Teaser-Sliders ist nicht mehr kurzzeitig der störende Text "Placeholder Image" zu sehen


Beschreibung

Wir haben folgende Meldung erhalten:

Guten Tag,

wenn die Shop-Startseite in PC-Ansicht bei aktivem Teaser Slider mit F5 aktualisiert wird, erscheint immer links oberhalb des Teaser Sliders der Text "Placeholder Image", bevor der linke Slider-Pfeil aufgebaut wird.

Besonders gut zu sehen im Firefox (als Alt-Text), noch gut erkennbar im Microsoft Edge (als chinesisches Kästchen :-), nur im Chrome nicht erkennbar, weil vermutlich am schnellsten.

Das sollte gelegentlich überarbeitet werden.

loop:
for (var index in slider.slides) {
var slide = slider.slides[index];

if (slide.languageId !== +placeholderSlide.languageId) { // + converts value to int
continue;
}

for (var imageIndex in slide.images) {
var slideImage = slide.images[imageIndex];

if (slideImage.breakpoint === breakpoint && slideImage.image) {
var slide = document.createElement('div');
slide.className = 'swiper-slide';

var image = document.createElement('img');
image.className = 'placeholder-image img-responsive center-block';
image.setAttribute('src', placeholderSlide.baseUrl + slideImage.image);
image.setAttribute('alt', 'Placeholder Image');

slide.appendChild(image);

document.querySelector('#slider .swiper-container .swiper-wrapper').appendChild(slide);

break loop;


EDIT 17.05.2019

  1. Lege einen Teaser-Slider (mit Bild für Desktop) an unter Darstellung > Teaser-Slider
  2. Rufe den Shop im Firefox-Browser auf (reproduziert Firefox Quantum 66.0.5)
  3. Achte auf den oberen, linken Rand des Teaser-Slider und lade die Seite neu
    Ergebnis: für einen kurzen Moment, bevor der Teaser geladen ist, ist der Text "Placeholder Image" zu sehen

Aktionen

Auch abrufbar als: Atom PDF