Hallo,
ich habe folgendes "Problem": Das Website-Layout ist so angelegt, dass zu jedem Artikel/Seite ein eigenes Headerbild eingebunden werden kann. Das habe ich, um es dem Redakteur so einfach wie möglich zu machen, über einen Artikel gelöst. Jetzt kann es sein, dass eben ein Artikel mit Headerbild der Kopfzeile zugewiesen wird, oder eben nicht, wenn der Artikel/die Seite eben kein Headerbild erhalten soll.
Jetzt muss die Höhe der Kopfzeile ja variabel sein, weil ich nicht möchte dass der Redakteur jedesmal das Seitenlayout ändern muss, wenn er sich dafür entscheidet ein Headerbild einzubinden.
Ich habe das bisher mit jQuery gelöst:
Code:
$(document).ready(function() {
/* ---- Headerbild vorhanden? Ja/Nein ---- */
if($("#header .inside div:last-child").hasClass('mod_article')==true){
var topline_h = $("#header .inside #topline").height();
var img_h = $("#header .inside .mod_article").height();
if($('body').hasClass("mobile")==true || $(window).width() <= 800) {
var search_h = $(".search_inside").height();
$("#header .inside .mod_article").css('padding-top', 20);
$("#header .inside .mod_article .ce_image").css('margin-left', 0);
var sum_h = topline_h + img_h + 60;
}
else{
$("#header .inside .mod_article").css('padding-top', 154);
var sum_h = topline_h + img_h + 20;
$("#header").height(sum_h);
}
}
else{
$("#header").height('160');
}
});
Das funktioniert auch wunderbar.
Nur das nachladen ist etwas langsam, besonders auf mobilen Geräten, und verursacht je nach dem Darstellungsfehler, wenn das JavaScript nicht "rechtzeitig" geladen wurde.
Daher dachte ich, vielleicht hat jemand ja eine ähnliche Problemstellung schon einmal gehabt und es besser gelöst.
Kann man das z.B. über PHP und CSS lösen? Wenn ja, wie? Oder gibt es eine andere, bessere und performantere Lösung?
Freue mich über jede Rückmeldung. Vielen Dank.
Grüße,
pyretta
Lesezeichen