Losowy element (tekst, obrazek, cytat)
Przydatną rzeczą na stronie WWW może okazać się wyświetlenie losowego tekstu lub obrazka.
Tym sposobem można stworzyć bazę cytatów, krótkich porad a nawet bannerów reklamowych - pokazywanych użytkownikowi w sposób rotacyjny. Za każdym razem, gdy strona zostanie odświeżona zostanie wyświetlony nowy obrazek - czyli ta metoda pozwoli nam zaoszczędzić miejsca oraz czasu wczytywania witryny.
Krótka funkcja która spełnia powyższe założenia w PHP i JavaScript:
1. PHP
<?php
//baza tekstów
$element[]='Tekst 1';
$element[]='Tekst 2';
$element[]='Tekst 3';
//wyświetlenie losowego tekstu
print $element[array_rand($element, 1)];
?>
Stworzyliśmy tablicę $element która posłuży nam za bazę tekstów, spośród której zostanie wylosowany jeden element.
Losowanie tekstów będzie możliwe dzięki funkcji array_rand(). Przyjmuje dwa parametry - pierwszy to "źródło" czyli w tym przypadku tablica z tekstami, a drugi to ilość kluczy do wylosowania (pomiędzy 1 a liczbą elementów).
2. JavaScript
<script type="text/javascript">
// <![CDATA[
Array.prototype.random = function(limit){
if (typeof limit == 'undefined' || limit < 0) limit = 1;
else if (!limit) limit = this.length;
for (var i = 0, source = this, target = new Array(), n = source.length; i < limit && n > 0; i++){
do { var index = Math.random(); } while (index == 1);
index = Math.floor(index * n);
target.push(source[index]);
source[index] = source[--n];
}
return target;
}
document.write(new Array(
//tablica zawierająca bazę tekstów
'Tekst 1',
'Tekst 2',
'Tekst 3'
).random().join(''));
// ]]>
</script>
W dodawanych tekstach, cytatach - nie można używać apostrofów i przenosić tekstu do następnej linii za pomocą klawisza "Enter".
Kategorie: HTML + CSS, PHP + MySQL. Tagi: #css, #grafika, #html, #php. Źródło obrazków: Pixabay, Font awesome.