wersja skryptu MyBB: 1.8.8
adres forum: serwer lokalny
na czym polega problem (screen, opis, komunikaty):
A więc mam takie pytanko, mam sobie w global.css linijkę
div#header {
background: url(tutajjakieszdjecie.png);
background-size: 100%;
}
I mam pytanie, czy da się jakoś robić, aby w headerze losowo otwierało się do 10 obrazków tzn. przy każdym otwarciu inny. Z góry dziękuję za pomoc.
A jak mam to rozmieścić pomiędzy plikami, jeżeli mam w templates/headera i do tego global.css
Ale co chcesz rozmieszczać?
Css w ogóle nie ruszaj, a do template header dodaj:
Kod:
<script>
$(function () {
var url = "http://maispc.com/samuel/content/images/",
imgArray = [url+"avatar.png",
url+"provider/blogger.png",
url+"provider/LinkedIn-32x32.png",
url+"provider/myspace.png",
url+"provider/instagram.png",
url+"provider/Twitter-32x32.png",
url+"provider/stackoverflow.png",
url+"provider/Facebook-32x32.png"],
randomNumber = Math.floor((Math.random() * imgArray.length)),
baseUrl = "url('" + imgArray[randomNumber] + "')";
$("#header").css('background-image', baseUrl);
})();
</script>
Z tym, że musisz to przerobić pod swoje potrzeby. Nie wiem jak ty to widzisz w swojej głowie. Jak dalej nie będziesz umiał to spróbuj to jakoś rozrysować lub lepiej wytłumaczyć, a postaramy się pomóc.
Ok mniej więcej mi to działa. Jeszcze jedno pytanko co do tego. Chciałbym, aby ten obrazek był wycentrowany pionowo. Co musiałbym dodać do tego kodu?
ja to centruje zazwyczaj tak.
to co chcę wycentrować daję w display:table-cell;
i daje mu vertical-align:middle;
zobacz tutaj np
http://prezentacjastrony.cba.pl/
Nie sądzę, że umieszczenie tego w table-cell będzie dobrym pomysłem
Czemu nie? To najlepsza semantycznie opcja mi się zdaje. Przecież nie robię tego na tabeli tylko robię aby ten blok zachowywał się jak komórka.
Możesz oczywiście robić to jeszcze tak
display:inline;
i dajesz odpowiednie line-height
Tak, chodzi mi, że w moim przypadku nie najlepiej to działa. Nie uważam tego jako zła metoda ogólnie.
To masz problemy ze semantyką w kodzie. Musisz troszkę w nim posprzątać.
Ale zakładam że nie nadałeś dla bloku nadrzędnego display:table dlatego ci nie działa.
Przeanalizuj jeszcze raz dokładnie kod na stronie którą ci podesłałem.