Hallo liebe Community,
diesmal geht es nicht ganz um Contao-Elemente, ich hoffe, dass ich hier trotzdem eine Hilfe finde.
Ich möchte folgendes umsetzen:
- eine jQuery-Slideshow nach jedem 5. per AJAX geladenen Element stoppen
- die Box mit der Slideshow ausblenden,
- dafür eine andere Box mit einem anderen Inhalt einblenden,
- diese nach einer Weile ausblenden,
- die Box mit der Slideshow einblenden und weiterlaufen lassen, bis wieder ein weiteres 5. Element geladen wird.
Mein Code sieht momentan so aus - siehe unten. Die Slideshow funktioniert ganz gut. Nur kriege ich es nicht mit der Zwischenschaltung hin. Weiß jemand bitte Bescheid? Für jeden Ratschlag wäre ich sehr dankbar.
Liebe Grüße,
Jan
PHP-Code:
$(document).ready(function() {
// SET AUTOMATIC PAGE RELOAD TIME TO 5000 MILISECONDS (5 SECONDS).
setInterval('refreshPage()', 3600000);
function textShort() {
if ($('#presentation .info').length > 0) {
var showChar = 160;
var ellipsestext = "...";
// var moretext = "more";
// var lesstext = "less";
$('.info').each(function() {
var content = $(this).html();
if(content.length > showChar) {
var c = content.substr(0, showChar);
var h = content.substr(showChar-1, content.length - showChar);
var html = c + '<span class="moreellipses">' + ellipsestext+ '</span>';
$(this).html(html);
}
});
}
}
var url = '';
var num = 0;
function anzahl() {
$('#presentation #inhalt .tx-ppamthowitrollhusv2-pi1').length;
};
if ($('#inhalt .tx-ppamthowitrollhusv2-pi1 .presentation_list').length > 0) {
$('#inhalt .tx-ppamthowitrollhusv2-pi1').append('<div id="presentation"></div>');
setInterval(function(){
url = $('#inhalt .tx-ppamthowitrollhusv2-pi1 .presentation_list a').eq(num).attr('href');
$('#presentation').load(url + ' #inhalt', textShort);
$('#presentation #inhalt').fadeOut().delay(5000).fadeIn(2000);
num++;
// Hier wird versucht, den anderen Inhalt zu laden, sobald jedes Mal ein 5. Element in der Slideshow geladen wurde
if ($('#presentation #inhalt .tx-ppamthowitrollhusv2-pi1').length == 5) {
$('.inside').fadeOut(2000);
$('#bild').fadeIn(2000).delay(5000).fadeOut(2000);
$('.inside').fadeIn(2000);
}
else
{
$('#presentation #inhalt').fadeOut().delay(5000).fadeIn(2000);
num++;
} // Ende des Versuchs
if (num == $('#inhalt .tx-ppamthowitrollhusv2-pi1 .presentation_list a').length) {
num = 0;
}
}, 8000);
}
});
function refreshPage() { location.reload(); }
Lesezeichen