<script>
$(document).ready(function() {
$('#slide1_controls').on('click', 'span', function(){
$("#slide1_images").css("transform","translateX("+$(this).index() * -450+"px)");
$("#slide1_controls span").removeClass("selected");
$(this).addClass("selected");
});
});
</script>
<!doctype html>
<html lang="DE">
<head>
<meta charset="UTF-8">
</head>
<style>
.new-slider
{
position:relative;
height:80px;
width:80px;
background:url(new_slider.png);
left:356px;
background-color:DFEFFF;
top:0px;
z-index:222;
background-color:transparent;
}
.slider-holder
{
width: 432px;
height: 286px;
background-color: yellow;
margin-left: auto;
margin-right: auto;
margin-top: 0px;
text-align: center;
overflow: hidden;
}
.image-holder
{
width: 432px;
background-color: dfefff;
height: 286px;
position: relative;
z-index:101;
-webkit-transition: left 5s;
-moz-transition: left 5s;
-o-transition: left 5s;
transition: left 5s;
}
.slider-image
{
float: left;
margin: 0px;
padding: 0px;
position: relative;
}
#slider-image-1:target ~ .image-holder
{
left: 0px;
}
#slider-image-2:target ~ .image-holder
{
left: -800px;
}
#slider-image-3:target ~ .image-holder
{
left: -1600px;
}
.button-holder
{
position: relative;
top: -20px;
}
.slider-change
{
display: inline-block;
height: 10px;
width: 10px;
border-radius: 5px;
background-color: brown;
}
</style>
<?php
$time= time();
$ip = $REMOTE_ADDR;
$i = 0;
$next = "-1";
$e = 1;
// $setpicture = "";
// PICTURE - SLIDER - BILD 1
$result1 = $pdo->prepare("SELECT * FROM pt_android where exp_date < :time ORDER BY exp_date DESC LIMIT 0,1");
$result2 = $pdo->prepare( "SELECT picture_id, freegame_id, ext FROM pt_pictureandroid WHERE freegame_id = :freegame_id ");
$result1->execute([':time' => $time]);
while ($row = $result1->fetch(\PDO::FETCH_ASSOC))
{
$result2->execute([':freegame_id' => $row['freegame_id']]);
$picnr = $result2->fetch(\PDO::FETCH_ASSOC);
$getpicture1 = $picnr['picture_id'];
$subject = $row['subject'];
$an = $row['freegame_id'];
$sectio= $row['section_id'];
}
// PICTURE - SLIDER - BILD 2
$result3 = $pdo->prepare("SELECT * FROM pt_android where exp_date < :time ORDER BY exp_date DESC LIMIT 1,1");
$result4 = $pdo->prepare( "SELECT picture_id, freegame_id, ext FROM pt_pictureandroid WHERE freegame_id = :freegame_id ");
$result3->execute([':time' => $time]);
while ($row = $result3->fetch(\PDO::FETCH_ASSOC))
{
$result4->execute([':freegame_id' => $row['freegame_id']]);
$picnr2 = $result4->fetch(\PDO::FETCH_ASSOC);
$getpicture2 = $picnr2['picture_id'];
$subject2 = $row['subject'];
$an2 = $row['freegame_id'];
$sectio2 = $row['section_id'];
}
// irgendein Datenbankergebnis als Array
$databaseResult = array( "$getpicture1.jpg","$getpicture2.jpg","$getpicture3.jpg","$getpicture4.jpg","$getpicture5.jpg");
// das Datenbankergebnis als Json für JavaScript
$databaseResultJson = json_encode($databaseResult);
//die Anzahl des Datenbankergebnis
// "minus 1"; da Arrays bei "0" beginnen
$totalNumberOfImages = count($databaseResult) - 1;
$image = $databaseResult[0];
?>
<table cellpadding=0 cellspacing=0 border=0 border=0 align=center>
<tr> <td bgcolor=#005EBB rowspan=2 width=24 height=24 align=center valign=middle class='menuecorners3'>
<div class="back face center">
<img onclick=previousImage() src=prev.jpg border=0 width=24 height=36 border=0 onmouseout="this.src='prev.jpg';" onmouseover="this.src='prev2.jpg';"></img></td>
</div> <td align=center >
<?php
// wir beginnen mit dem ersten Bild; index "0" == "bird.jpg"
$image = $databaseResult[0];
echo "
<div class=slider-holder>
<a id=url ><img id=the-image class='image-holder' src=uploadscript/img/android/$image width=430 height=286 alt='$image' ></img></a>
</div> ";
echo "</td>
<td bgcolor=#005EBB rowspan=2 align=center valign=middle class=menuecorners4>
<div onclick=slide1_images class='back face center'>
<img onclick='nextImage()' src=next.jpg border=0 width=24 height=36 border=0 onmouseout=this.src='next.jpg'; onmouseover=this.src='next2.jpg';></img>
</div>
</td>
<tr>";
echo "<td align=left bgcolor=005EBB><table align=center cellpadding=0 cellspacing=0 border=0 bgcolor=#005EBB ><td bgcolor=red width=240 ><a href=freegame_android_show.php?an=$an§io=$sectio id=subject class=customfont style=color:white;font-size:14px;padding-left:6px;>$subject</a></font><td align=right bgcolor=darkred width=182><font class=customfont color=white><span class=customfont style=color:white;font-size:14px;padding-right:6px;>$kategorie</font></td></tr>";
echo "</td></table></table>";
?>
</body>
</html>
<script>
// zwei globale Variablen; die erste wird mit PHP gesetzt
// "images" ist Json; kann wie ein Array verwendet werden
let images = <?php echo $databaseResultJson; ?>;
// auch in JS beginnen wir mit dem ersten Bild
let index = 1;
function nextImage() {
// "const"; da wir die Variable "image" nicht im Nachinhein ändern wollen.
// increaseIndex() gibt den aktuellen Index zurück
// mit dem Index greifen wir auf das ensprechende Bild im Json zu
const image = images[increaseIndex()];
changeImage(image);
}
function previousImage() {
const image = images[decreaseIndex()];
changeImage(image);
}
function decreaseIndex() {
// wir prüfen, ob der Index kleiner null werden würde; das wäre ein Fehler.
// Also geben wir einfach wieder null zurück; ansonsten zählen wir den Index einen nach unten ("-1").
if (index == 0)
{
var subject
var kategorie
var kategorie_nummer
subject="<?php echo $subject; ?>"
kategorie_nummer="<?php echo $sectio; ?>"
document.getElementById("url").href = "freegame_android_show.php?sectio=<?php echo $sectio ?>&an=<?php echo $an ?>";
document.getElementById("subject").innerHTML = subject;
document.getElementById("kategorie").innerHTML = kategorie;
}
if (index == 1)
{
var subject
var kategorie
var kategorie_nummer
subject="<?php echo $id_selekt2[subject]; ?>"
kategorie_nummer="<?php echo $id_selekt2[section_id]; ?>"
document.getElementById("url").href = "freegame_android_show.php?sectio=<?php echo $id_selekt2[section_id] ?>&an=<?php echo $id_selekt2[freegame_id] ?>";
document.getElementById("subject").innerHTML = subject;
document.getElementById("kategorie").innerHTML = kategorie;
}
if ( index == 2)
{
var subject
var kategorie
var kategorie_nummer
subject="<?php echo $id_selekt3[subject]; ?>"
kategorie_nummer="<?php echo $id_selekt3[section_id]; ?>"
document.getElementById("url").href = "freegame_android_show.php?sectio=<?php echo $id_selekt3[section_id] ?>&an=<?php echo $id_selekt3[freegame_id] ?>";
document.getElementById("subject").innerHTML = subject;
document.getElementById("kategorie").innerHTML = kategorie;
}
function increaseIndex() {
// hier prüfen wir auf den maximalen Index.
if (index == 1)
{
var subject2
var kategorie2
var kategorie_nummer2
subject2="<?php echo $subject2; ?>"
kategorie_nummer="<?php echo $sectio2; ?>"
if ( kategorie_nummer == 1)
{
kategorie = "ARCADE";
}
if ( kategorie_nummer == 2)
{
kategorie = "ACTION";
}
if ( kategorie_nummer == 3)
{
kategorie = "JUMP N RUN";
}
if ( kategorie_nummer == 4)
{
kategorie = "GESCHICK";
}
if ( kategorie_nummer == 5)
{
kategorie = "BRETTSPIELE";
}
if ( kategorie_nummer == 6)
{
kategorie = "RENNSPIELE";
}
if ( kategorie_nummer == 7)
{
kategorie = "SPORTSPIELE";
}
if ( kategorie_nummer == 8)
{
kategorie = "KARTENSPIELE";
}
if ( kategorie_nummer == 9)
{
kategorie = "DENKSPIELE";
}
if ( kategorie_nummer == 10)
{
kategorie = "ADVENTURES";
}
if ( kategorie_nummer == 11)
{
kategorie = "STRATEGIE";
}
if ( kategorie_nummer == 12)
{
kategorie = "ROLLENSPIELE";
}
document.getElementById("url").href = "freegame_android_show.php?sectio=<?php echo $sectio ?>&an=<?php echo $an ?>";
document.getElementById("subject").innerHTML = subject2;
document.getElementById("kategorie").innerHTML = kategorie2;
}
if ( index == 2)
{
var subject
var kategorie
var kategorie_nummer
subject="<?php echo $id_selekt3[subject]; ?>"
kategorie_nummer="<?php echo $id_selekt3[section_id]; ?>"
if ( kategorie_nummer == 1)
{
kategorie = "ARCADE";
}
if ( kategorie_nummer == 2)
{
kategorie = "ACTION";
}
if ( kategorie_nummer == 3)
{
kategorie = "JUMP N RUN";
}
if ( kategorie_nummer == 4)
{
kategorie = "GESCHICK";
}
if ( kategorie_nummer == 5)
{
kategorie = "BRETTSPIELE";
}
if ( kategorie_nummer == 6)
{
kategorie = "RENNSPIELE";
}
if ( kategorie_nummer == 7)
{
kategorie = "SPORTSPIELE";
}
if ( kategorie_nummer == 8)
{
kategorie = "KARTENSPIELE";
}
if ( kategorie_nummer == 9)
{
kategorie = "DENKSPIELE";
}
if ( kategorie_nummer == 10)
{
kategorie = "ADVENTURES";
}
if ( kategorie_nummer == 11)
{
kategorie = "STRATEGIE";
}
if ( kategorie_nummer == 12)
{
kategorie = "ROLLENSPIELE";
}
document.getElementById("url").href = "artikel_show.php?sectio=<?php echo $id_selekt3[section_id] ?>&an=<?php echo $id_selekt3[freegame_id] ?>";
document.getElementById("subject").innerHTML = subject;
document.getElementById("kategorie").innerHTML = kategorie;
}
function changeImage(image) {
document.getElementById("the-image").style.transition = "4s";
document.getElementById("the-image").alt = image;
document.getElementById("the-image").src = "uploadscript/img/android/" + image;
}
</script>
<script>
var subject
var kategorie
var kategorie_nummer
subject="<?php echo $subject; ?>"
kategorie_nummer="<?php echo $sectio; ?>"
if ( kategorie_nummer == 1)
{
kategorie = "ARCADE";
}
if ( kategorie_nummer == 2)
{
kategorie = "ACTION";
}
if ( kategorie_nummer == 3)
{
kategorie = "JUMP N RUN";
}
if ( kategorie_nummer == 4)
{
kategorie = "GESCHICK";
}
if ( kategorie_nummer == 5)
{
kategorie = "BRETTSPIELE";
}
if ( kategorie_nummer == 6)
{
kategorie = "RENNSPIELE";
}
if ( kategorie_nummer == 7)
{
kategorie = "SPORTSPIELE";
}
if ( kategorie_nummer == 8)
{
kategorie = "KARTENSPIELE";
}
if ( kategorie_nummer == 9)
{
kategorie = "DENKSPIELE";
}
if ( kategorie_nummer == 10)
{
kategorie = "ADVENTURES";
}
if ( kategorie_nummer == 11)
{
kategorie = "STRATEGIE";
}
if ( sectio == 12)
{
kategorie = "ROLLENSPIELE";
}
document.getElementById("url").href = "artikel_show.php?sectio=$sectio ?>&an=<?php echo $an ?>";
document.getElementById("subject").innerHTML = subject;
document.getElementById("kategorie").innerHTML = kategorie;
</script>
)!
