PHP - встроенная функция масштабирования изображения - PullRequest
Новая
       8

PHP - встроенная функция масштабирования изображения

0 голосов
/ 24 июня 2019

Я попробовал код из https://www.w3schools.com/howto/howto_js_image_zoom.asp, но он не работает для меня.Может ли кто-нибудь помочь мне, пожалуйста?Цель сценария - получить доступ к общему сетевому ресурсу.на нем есть картинки.Эти изображения отображаются в виде миниатюры, и если вы щелкнете по миниатюре, изображение откроется в лайтбоксе.Теперь я хочу, чтобы, если вы находитесь в лайтбоксе, вы могли увеличить само изображение.

Полный код: 

<?php
 
function  rsearch ($folder  , $pattern ) {
     $dir  = new  RecursiveDirectoryIterator ( $folder );
     $dir->setFlags(RecursiveDirectoryIterator::SKIP_DOTS);
     $ite  = new  RecursiveIteratorIterator ( $dir );
     $files  = new  RegexIterator ( $ite ,  $pattern ,  RegexIterator :: GET_MATCH );
     $fileList  = array();
    foreach( $files  as  $file ) {
         $fileList  =  array_merge ( $fileList ,  $file );
    }
    return  $fileList ;
}
 
// @source  http://jeffreysambells.com/2012/10/25/human-readable-filesize-php
function  human_filesize ( $bytes ,  $decimals  =  2 ) {
   $size  = array( 'B' , 'kB' , 'MB' , 'GB' , 'TB' , 'PB' , 'EB' , 'ZB' , 'YB' );
   $factor  =  floor (( strlen ( $bytes ) -  1 ) /  3 );
  return  sprintf ( "%. $decimals  " ,  $bytes  /  pow ( 1024 ,  $factor )) . @ $size [ $factor ];
}
 
 
$folder = $_GET["folder"] ;
 
$files  =  rsearch ( $folder, '/^.*\.(?:jpg|jpeg|png|)$/i' );
 
?><!doctype html>
<html lang="en">
<head>
 
  <meta charset="UTF-8">
  <title>Galerie</title>
 
  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script type="text/javascript" src="jquery-lightbox/js/jquery.lightbox-0.5.js"></script>
<link href="jquery-lightbox/css/jquery.lightbox-0.5.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
$(document).ready(function() {
        $('.galerie a').lightBox({maxHeight: 2000,
maxWidth: 1500} )
});
 
/*  function resizeIframe(obj) {
    obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
  }
*/
 
</script>
 
 
  <style type="text/css">
 
div.galerie {
 
 padding:0;
 margin:0;
 list-style-type:none;
 font-family:Arial, Helvetica, sans-serif;
}
 
 
div.galerie li  {            
 padding: 3px;
 background-color:#ebebeb;
 border:1px solid #CCC;
 float:left;
 margin:0 10px 10px 0;
}
 
 
div.galerie li:hover{  
 border:1px solid #333;
}
 
div.galerie  li span {
display:block;
text-align:justify;
text-justify: inter-word;
 font-size:10px;
width: 10em;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
 
}
 
div.galerie li a img{
 border:none;
}
 
}
 
  </style>
</head>
<body>
 
  <div class="galerie">
<?php
if ( count ( $files ) >  0 ) :
  foreach ( $files  as  $file ) :
?>
    <div class="galerie-item">
    <li>
      <a href="<?php  echo  $file ;  ?>">
        <!--
          Warning! Even with width=140 the full image is loading!
          Use thumbnail files here and link to original.
        -->
        <img class="galerie-item__thumbail" src="<?php  echo  $file ;  ?>" alt="Movement captured" class="responsive" width="140">
      </a>
      <span class="galerie-item__info"><?php  echo  basename ( $file );  ?>  <span class="galerie-item__filesize">(<?php  echo  human_filesize ( filesize ( $file ) );  ?>)</span></span>
    </div>
    </li>
<?php
   endforeach;
else:
?>
  <h2>Nothing found.</h2>
<?php
endif;
?>
  </div>
 
</body>
</html>
...