chtěl bych vyzkoušet udělat něco v php, ale vůbec mě nenapadá co. Na netu po vyhledání inspirací je skoro všude akorát to, že mám zkusit udělat redakční systém, ale do toho se mi moc nechce. Takže bych potřeboval něco méně časově náročného.
Zatím jsem zkusil udělat takovou jednoduchou šachovnici přes for loop.
Kód: Vybrat vše
<!DOCTYPE html>
<html lang="cs">
<head>
<title>Chessboard / Šachovnice</title>
<meta charset="utf-8">
</head>
</html>
<style>
#herni_pole {
margin-right: auto;
margin-left: auto;
width: 800px;
height: 800px;
border: 5px solid #000;
text-transform: uppercase;
font-weight: bold;
}
.bilej, .cernej {
float: left;
width: 100px;
height: 100px;
transition: 0.5s ease;
background-attachment:fixed
}
.bilej {background-color: #fff; color: #000;}
.cernej {background-color: #000; color: #fff;}
.bilej:hover, .cernej:hover {position: relative;}
.cernej:hover {
-moz-box-shadow: 0px 0px 30px #262626;
-webkit-box-shadow: 0px 0px 30px #262626;
box-shadow: 0px 0px 30px #262626;
}
.bilej:hover {
-moz-box-shadow: 0px 0px 30px #d9d9d9;
-webkit-box-shadow: 0px 0px 30px #d9d9d9;
box-shadow: 0px 0px 30px #d9d9d9;
}
</style>
<?php
$vyska = 8;
$sirka = 8;
echo "<div id='herni_pole'>";
for($y=$vyska; $y>0; $y--) {
for($x=0; $x<$sirka; $x++) {
echo (($x+$y)%2==0) ? "<div class='bilej'><div style='top: 50%; position: relative; transform: translateY(-50%); text-align: center; font-size: 22px;'>".chr($x+97).$y."</div></div>" : "<div class='cernej'><div style='top: 50%; position: relative; transform: translateY(-50%); text-align: center; font-size: 22px;'>".chr($x+97).$y."</div></div>";
}
}
echo "</div>";
?>
<p style="text-align: center; font-weight: bold;">Made by strangereu (c) 2015</p>
<p style="text-align: center; font-weight: bold;">Do you want to have the source? Message me on skype stranger.eu</p>
)ale nechec se mi do toho.
Taky si pamatuju, že něco podobného měl i Petr Novotný (ten bavič) na svých webových stránkách. Přesmyčky...
