Hallo bythehead,
entschuldige bitte die späte Antwort; ich war im Urlaub und habe den Thread dann nicht mehr im Auge gehabt.
Ich habe die gleiche Kombi jetzt in einem anderen Projekt verwendet; da funktioniert es. Ergo habe ich irgendwo einen Fehler drin bei dem anderen.
Danke für deine Hilfe!
LG Silvi
EDIT:
Ich habe deine Lösung ausprobiert, da waren nur zwei kleine Tippfehler drin (muss centered unten heißen):
Code:
<script type="text/javascript">
window.addEventListener("load-fullbg", function() {
;(function($){
$(document).ready(function() {
// array with images
var images = [<?php echo $this->images; ?>];
// should the single image be randomized (only on mobile)?
var random = true;
var index = 0;
// check the device width
if ($(window).width() < 641) {
// check, if random image is used
if (random) {
// get random index value between 0 and images.length
index = Math.floor(Math.random() * images.length) + 0;
}
// overwrite multi image array with single image array
images = [images[index]];
}
$.backstretch(
'body',
images,
{
duration: <?php echo $this->timeout; ?>,
fade: <?php echo $this->speed; ?>,
nav: <?php echo $this->nav; ?>,
navClick: <?php echo $this->navClick; ?>,
navPrevNext: <?php echo $this->navPrevNext; ?>,
centeredX: <?php echo $this->centeredX; ?>,
centeredY: <?php echo $this->centeredY; ?>
});
});
})(jQuery);
});
</script>
Ich bin leider nicht fit in JavaScript.
Könnte man hier nicht ansetzen und sagen: Wenn <641, dann zeige gar kein Hintergrundbild - während ich dieses dann über CSS bestimmen könnte?
Ansonsten finde ich die Lösung aber auch so schon sehr hilfreich. Vielen Dank!!