Fade Header

[unicorn75]

Dank der Empfehlungen hier in der Community habe ich den Fade Header installiert aber nun gibt es ein paar Probleme.

https://www.phpbb.com/customise/db/exte ... de_header/

Ich hoffte er skaliert selber Bilder aber anscheinend werde ich alle selber in der gleichen Größe erstellen müssen aber wie sieht dies dann bei verschiedenen Bildschirmauflösungen aus, ist da eine Lösung implementiert oder eher nicht?

Danke

[unicorn75]

Ich habe versucht herauszufunden, wo die Fade Header ext die Wiederholung der Bilder definiert.

Per Firebug bekomme ich für die CSS folgenden Code angezeigt:

Code: Alles auswählen

element.style {
    background: rgba(0, 0, 0, 0) url("http://localhost/forum/images/srk17.jpg") repeat scroll 0 0;
    opacity: 1;
}

Und daraus folgt die Generation dieses headerbar Containers:

Code: Alles auswählen

<div class="headerbar" role="banner" style="background: transparent url("http://localhost/forum/images/srk18.jpg") repeat scroll 0% 0%; opacity: 0.0264508;">
   <div class="inner">
   <div id="site-description">

   <div id="search-box" class="search-box search-header" role="search">
  </div>
</div>

soweit ich es überblicke bildet die Datei "overall_footer_after.html" der Erweiterung den style. Ich weiß nicht, ob ich den gesamten Code hier reinsetzen darf, falls nicht bitte löschen.

Code: Alles auswählen

<!-- IF FADEHEADER_ENABLEPM -->
<script>
        $(document).ready(function(){
        var imgArr = new Array
        ( // path images
        '{FADEHEADER_TEXT_TWITTER}',
<!-- IF FADEHEADER_ENABLEREG -->'{FADEHEADER_IMAGE2}',<!-- ENDIF -->
<!-- IF FADEHEADER_ENABLEBH -->'{FADEHEADER_IMAGE3}',<!-- ENDIF -->
<!-- IF FADEHEADER_ENABLEBF -->'{FADEHEADER_TEXT_FIELD}',<!-- ENDIF -->
        '{FADEHEADER_IMAGE}'
        );
                var preloadArr = new Array();
                var i;
                /* preload images*/
                for(i=0; i < imgArr.length; i++)
                {
                        preloadArr[i] = new Image();
                        preloadArr[i].src = imgArr[i];
                }
                var currImg = 1;
                var intID = setInterval(changeImg, {FADEHEADER_TEMP}000); // image changes every: in milliseconds /
                function changeImg(){
                        $('.headerbar').animate({opacity: 0}, 1, function()
                        {
                                $(this).css('background','url(' + preloadArr[currImg++%preloadArr.length].src +')');
                        }).animate({opacity: 1}, 1000);
                        }
        });
</script>
<!-- ENDIF -->

ich finde hier weder Angaben zu scroll noch repeat etc. In der colours.css sowie common.css habe ich jeweils auf background-repeat: no-repeat; im .headerbar Abschnitt gesetzt aber es wird überschrieben, ich habe es auch mal in der html, body {} getestet aber nichts

P.S. mein englisch ist viel zu schlecht, um es im englischensprachigen Forum nachzufragen. Da reicht es nur um einfach zu fragen, wie man auf center setzt

[unicorn75]

Das Teil hat mich so genervt, ich habe jetzt einfach auf ein GIF gewechselt