Hallo, ich habe folgendes Problem mit den Banner(-Slider) in meiner Einkaufswelt(resize): Ich habe die breite meines Shops geändert auf: .container { max-width: 66.938rem; } Da die standard Breite der Einkaufswelt nun zuviel war (1160px) habe ich diese in der entsprechenden tpl-Datei auf 1040px angepasst. Auch die Zeilenhöhe habe ich definiert: 20px. Jetzt habe ich ein Einkaufswelt-Banner-Slider erstellt mit einer Höhe von 19 Zeilen (also 380px) und ein Banner mit den Maßen 1040x380 px eingefügt. Ich hätte jetzt gedacht, es wäre genau passend, allerdings ist es zumindest im firefox deutlich unscharf. Wenn ich mit dem firebug aus Spaß transform: scale(0.999038, 0.999038); wegnehme, ist es gestochen scharf. Wo liegt mein Fehler/das Problem? Wäre echt super wenn mir jemand helfen könnte. Vielen Dank!
Hallo, schau Dir mal das emotion jQuery Plugin in der emotion.js an. In dem Plugin kann die baseWidth definiert werden, welche als Basis für die Skalierung verwendet wird. Du kannst diese auch über ein Data-Attribut setzen: data-baseWidth="". Weitere Infos zu den jQuery Plugins findest Du hier: https://developers.shopware.com/designers-guide/javascript-statemanager-and-pluginbase/ Sonnige Grüße, Phil
Danke für die Hilfe schonmal. leider besteht das Problem weiterhin, bzw. die Änderungen, die ich an der js-Datei durchführe bleiben ohne Auswirkung (auch wenn ich z.B. 1920 einstelle ändert das nichts). Nur um sicher zu gehen, dass ich in der richtigen Datei unterwegs war: Ich habe unter /www.meine-domain.de/themes/Frontend/Responsive/frontend/_public/src/js die Datei “jquery.emotion” runtergeladen, dann in Zeile 348 baseWidth: 1160, auf baseWidth: 1040, geändert, abgespeichert, in meinen Template-Ordner hochgeladen und abschließend Cache geleert, Theme generiert, etc. Warum passiert trotzdem nichts? Hier der Link zu meiner Baustelle, falls mein Fehler doch noch wo anders liegt oder ich blöde Werte genommen habe: http://www.regenwasserzisterne24.de Ich weiß, so stark verschwommen ist es nicht und man sieht es eventuell nicht auf den ersten Blick, aber es stört dennoch. Besonders stark ist es (zumindest bei mir) bei firefox verschwommen. Wäre super wenn mir jemand weiterhelfen könnte. Danke!
*push* 
Kann mir wirklich keiner helfen? Ich bin da mehr oder weniger am verzweifeln. Muss die Änderung vlt in einer anderen Datei erfolgen, oder habe ich falsche werte verwendet? Wäre super wenn mir jemand helfen könnte!
Mir geht es ähnlich. Ich dachte die Shopware Community wäre etwas aktiver… würde auch schon helfen wenn die Doku besser wäre
Ich habe es in allen Browsern getestet. Bei mir ist da nichts unscharf. Es könnte aber sein, dass Firefox diesen Bug produziert. Gibt einige Suchergebnisse bei Google zum Thema “Firefox transform scale blurry image”. Oder hat sich das Problem schon erledigt und es wurde geklärt?
Bei mir besteht das Problem auch - in allen Browsern. Es muss an der Umrechnung der Bilder durch Shopware liegen: wenn ich eine responsive Seite mit großem, anpassenden Hintergrundbild anlege und diese als iFrame in die Einkaufswelt lade, ist es scharf. Nur die automatische Umrechnung durch Shopware ruiniert die Bilder.
Kannst du mir deinen Shop zukommen lassen?
Hatte das Problem auch. Die einzige Möglichkeit das zu fixen ist das jQuery Plugin an einigen Stellen zu überschreiben.
Ich setze die baseWidth beim Laden und onResize auf die aktuelle Bildschirmbreite und initialisiere die Emotions bei jedem Resize neu. Da im Backend die Zeilenhöhe in Relation zu der festgelegten Breite steht muss die Höhe prozentual umgerechnet werden. Das Setzen des Scale Wertes habe ich komplett rausgeworfen.
Wer mehr Infos benötigt, der kann sich gern melden.
Es folgt ein Codeauschnitt, welcher ganz oben in die scale function ausgeführt werden muss (könnte sauberer sein, musste aber schnell gehen):
recalculateSizerHeight: function() {
var me = this,
state = state || window.StateManager.getCurrentState();
me.$sizer = me.$el.find('.emotion--sizer-' + state);
if (me.$sizer.length <= 0) {
me.$sizer = me.$el.find('.emotion--sizer');
}
me.$sizer.css('height', me.$sizer.data("rows") * ((me.baseWidth * (me.opts.cellHeight*100/1160) / 100) + me.opts.cellSpacing));
}
Hallo, Ich hätte gerne mehr Infos 
Mein Problem ist ein ähnliches hat aber sicher mit diesem Detail zu tun.
Ich verwende Shopware 5.2.21 und bei mir das Problem, wenn die Seite aktualisiert wird dann wird transform: scale unter 1, z.B. mit:
transform: scale(0.913793) translateX(0rem);
gerendert.
Das Bild ist plötzlich schmaler als die beabsichtigte Maximalbreite.
Wird die Größe des Browserfensters geändert, dann passt es wieder. Lade ich die Seite (F5) neu, dann ist es wiederum zu klein, bis ich das Browserfenster erneut verschiebe.
Nun bin ich nicht der Experte in der PHP-Programmierung. Kannst DU mir sagen, wie ich Deinen Code in die emotion.plugin.php einbringen muss, damit das Problem beseitigt werden kann?
Herzlichen Dank im Voraus.
Gruß, Detlef
Hatte das Problem auch. Die einzige Möglichkeit das zu fixen ist das jQuery Plugin an einigen Stellen zu überschreiben.
Ich setze die baseWidth beim Laden und onResize auf die aktuelle Bildschirmbreite und initialisiere die Emotions bei jedem Resize neu. Da im Backend die Zeilenhöhe in Relation zu der festgelegten Breite steht muss die Höhe prozentual umgerechnet werden. Das Setzen des Scale Wertes habe ich komplett rausgeworfen.
Wer mehr Infos benötigt, der kann sich gern melden.
Es folgt ein Codeauschnitt, welcher ganz oben in die scale function ausgeführt werden muss (könnte sauberer sein, musste aber schnell gehen):
recalculateSizerHeight: function() {
var me = this,
state = state || window.StateManager.getCurrentState();me.$sizer = me.$el.find(‚.emotion–sizer-‘ + state);
if (me.$sizer.length <= 0) {
me.$sizer = me.$el.find(‚.emotion–sizer‘);
}me.$sizer.css(‚height‘, me.$sizer.data(„rows“) * ((me.baseWidth * (me.opts.cellHeight*100/1160) / 100) + me.opts.cellSpacing));
}