<?php
$str=60;
$style = '
{
margin: 0;
padding: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
box-sizing: border-box;
}
body {
}
.wrapper {
height: 670px;
margin: 40px auto 0;
position: relative;
width: 500px;
}
.slider {
height: inherit;
overflow: hidden;
position: relative;
width: inherit;
-webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .5);
-moz-box-shadow: 0 0 20px rgba(0, 0, 0, .5);
-o-box-shadow: 0 0 20px rgba(0, 0, 0, .5);
box-shadow: 0 0 20px rgba(0, 0, 0, .5);
}
.slides {
height: 670px;
opacity: 0;
position: absolute;
width: 500px;
z-index: 0;
-webkit-transform: scale(1.5);
-moz-transform: scale(1.5);
-o-transform: scale(1.5);
transform: scale(1.5);
-webkit-transition: transform ease-in-out .5s, opacity ease-in-out .5s;
-moz-transition: transform ease-in-out .5s, opacity ease-in-out .5s;
-o-transition: transform ease-in-out .5s, opacity ease-in-out .5s;
transition: transform ease-in-out .5s, opacity ease-in-out .5s;
}
.wrapper > input {
display: none;
}
.wrapper .controls {
left: 43%;
margin-left: -220px;
position: absolute;
}
.wrapper label {
cursor: pointer;
display: inline-block;
height: 20px;
margin: 25px 2px 0 2px;
position: relative;
width: 20px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-o-border-radius: 50%;
border-radius: 50%;
-webkit-transition: background ease-in-out .5s;
-moz-transition: background ease-in-out .5s;
-o-transition: background ease-in-out .5s;
transition: background ease-in-out .5s;
}
.wrapper label: after {
border: 1px solid #ddd;
content: ' ';
display: block;
height: 23px;
left: -2px;
position: absolute;
top: -2px;
width: 23px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-o-border-radius: 50%;
border-radius: 50%;
}
.link {
width: 500px;
height: 670px;
}
.link a {
display: block;
text-align: center;
height: 100%;
}
a{
text-decoration: none;
}
';
$x=0;
while ($x<$str)
{
$x++;
echo ".slide".$x." { background-image: url(book14/m".$x.".jpg); }";
echo "
#slide".$x.":checked ~ .slider > .slide".$x."
{
opacity: 1;
z-index: 1;
-webkit-transform: scale(1);
-moz-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
}
";
echo ".wrapper label:hover,#slide".$x."1:checked ~ .controls label:nth-of-type(".$x."),
{
background: #ddd;
}
";
}
echo "</style>";
echo "<center><br><b><a href='http://chl.kiev.ua/Default.aspx?id=7221'>Книга памяті мого роду</A><br></B>";
echo "<div class=wrapper>";
$f=0;
while ($f<$str)
{
if ($f == 1) {
$b = 'radio CHECKED name=point>';
}
else {
$b = 'radio name=point>';
}
echo "<input id=slide".$f." type=".$b;
$f++;
};
echo "<div class=slider>";
$y=0;
while ($y<$str)
{
$y++;
echo "<div class='slides slide".$y." link'><a href='book14/".$y.".jpg'></A></DIV>";
}
echo "</div>";
echo "<div class=controls>";
$u=0;
while ($u<$str)
{
$u++;
echo "<label for=slide".$u.">".$u."</LABEL>";
}
echo "</div></div></center>";
?>