<?php 
$tpt=$tmpt;
$tmpt="./DBinput/".$tmpt;
list($width, $height, $type, $attr) = getimagesize($tmpt); 

echo $height."X".$width;


if ($width<=$height) {
$set="";  
$hf=$height+120;
$wf=$width+120;
}
else {
$set="-L";
$hf=$height+120;
$wf=$width+120;}


?>
<a href="./filelistx.php">back</a>
<button onClick="action();">click me<img src="f1.jpg" width="100px" id="ImageButton1"></button>
<button onClick="actionX2();">click me<img src="f2.jpg" width="100px" id="ImageButton2"></button>
<button onClick="actionX3();">click me<img src="f3.jpg" width="100px" id="ImageButton3"></button>
<button onClick="actionX4();">click me<img src="f4.jpg" width="100px" id="ImageButton4"></button>
<button onClick="actionX5();">click me<img src="f5.jpg" width="100px" id="ImageButton5"></button>
<button onClick="actionX6();">click me<img src="f6.jpg" width="100px" id="ImageButton6"></button>




<script type="text/javascript">
function action()
{
var jv = "sea2";
  window.location.href = "dhtmlTT2.php?name=" + jv + "&tmpt=" + "<?php echo $tpt;?>"; 
}
function actionX2()
{
var jv = "sea";
  window.location.href = "dhtmlTT2.php?name=" + jv + "&tmpt=" + "<?php echo $tpt;?>"; 
}
function actionX3()
{
var jv = "sea3";
  window.location.href = "dhtmlTT2.php?name=" + jv + "&tmpt=" + "<?php echo $tpt;?>";  
}
function actionX4()
{
var jv = "sea4";
  window.location.href = "dhtmlTT2.php?name=" + jv + "&tmpt=" + "<?php echo $tpt;?>";  
}
function actionX5()
{
var jv = "sea5";
  window.location.href = "dhtmlTT2.php?name=" + jv + "&tmpt=" + "<?php echo $tpt;?>";  
}
function actionX6()
{
var jv = "sea6";
  window.location.href = "dhtmlTT2.php?name=" + jv + "&tmpt=" + "<?php echo $tpt;?>"; 
}


</script>


<br>
<br>

<style> 
.sample2 .sea {
  height: 100%;
  width: 100%;
  position: absolute;
  background-image: url("frame2<?php echo $set;?>.jpg");  
   background-size: <?php echo $wf;?>px <?php echo $hf;?>px;
  background-position:50px 00px;
  background-repeat: no-repeat ;
}

.sample2 .sea2 {
  height: 100%;
  width: 100%;
  position: absolute;
  background-image: url("frame1<?php echo $set;?>.jpg");  
  background-size: <?php echo $wf;?>px <?php echo $hf;?>px;
  background-position:50px 00px;
  background-repeat: no-repeat ;
}

.sample2 .sea3 {
  height: 100%;
  width: 100%;
  position: absolute;
  background-image: url("frame3<?php echo $set;?>.jpg");  
   background-size: <?php echo $wf;?>px <?php echo $hf;?>px;
  background-position:50px 00px;
  background-repeat: no-repeat ;
}
.sample2 .sea4 {
  height: 100%;
  width: 100%;
  position: absolute;
  background-image: url("frame4<?php echo $set;?>.jpg");  
   background-size: <?php echo $wf;?>px <?php echo $hf;?>px;
  background-position:50px 00px;
  background-repeat: no-repeat ;
}
.sample2 .sea5 {
  height: 100%;
  width: 100%;
  position: absolute;
  background-image: url("frame5<?php echo $set;?>.jpg");  
   background-size: <?php echo $wf;?>px <?php echo $hf;?>px;
  background-position:50px 00px;
  background-repeat: no-repeat ;
}
.sample2 .sea6 {
  height: 100%;
  width: 100%;
  position: absolute;
  background-image: url("frame6<?php echo $set;?>.jpg");  
   background-size: <?php echo $wf;?>px <?php echo $hf;?>px;
  background-position:50px 00px;
  background-repeat: no-repeat ;
}




.sample2 .fish {
  background: url("<?php echo $tmpt;?>") no-repeat;
   position: absolute;
  height: 100%;
  width: 100%;
   background-position:110px 60px;
  background-repeat: no-repeat ;
}
</style>

<?php echo $tmpt;?>
<div class="sample2">
  <div class="<?php echo $name;?>">                   
    <div class="fish"></div>
  </div>
</div>