查看文件: index.php

大小: 4.75 KB

类型: application/octet-stream

<?php
///street/
if (!isset($_SESSION)){ session_start(); }
require_once('../Connections/BE2.php');

$menu=isset($_GET['menu'])?$_GET['menu']:'台北市忠孝東路5段';

mysql_select_db($database_BE2, $BE2);
$query_R2 =sprintf("SELECT * FROM address WHERE concat(county,street)='%s'",$menu); 
$R2 = mysql_query($query_R2, $BE2) or die(mysql_error());
$row_R2 = mysql_fetch_assoc($R2);
$totalRows_R2 = mysql_num_rows($R2);
$street_id='830';// 忠孝東路5段 2- 1000 
if($totalRows_R2>0){ $street_id=$row_R2['img_id'];}

$order=0; //  圖編號排列  -1 = 1000 ~ 1   1= 忠孝東路5段 1 ~ 1000 
$dir    = '/www2/skybni/street_image/';
$files1=array();
$files2=array();
if($order==1){ $files1 = scandir($dir); }
else { $files1 = scandir($dir, SCANDIR_SORT_DESCENDING); }
$newid=0;
for($i=0;$i<count($files1)-1;$i++){
 //  if(substr($files1[$i],0,strlen($street_id)-1)==$street_id){
   $str1=substr($files1[$i],0,strlen($street_id)) ;
  // echo $files1[$i].'('.$str1.')'.(strlen($street_id)-1).'<br>';
   if($str1==$street_id){	   
	   $files2[$newid]=$files1[$i];
	   $newid++;
	  }	
	}
 ?>
<!doctype html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <style type="text/css">@-ms-viewport{width:auto!important;}</style>
    <link rel="stylesheet" type="text/css" href="glider.css" />
    <script src="glider.js"></script>
    <script>
      window.addEventListener('load',function(){
        document.querySelector('.glider').addEventListener('glider-slide-visible', function(event){
            var glider = Glider(this);
            console.log('Slide Visible %s', event.detail.slide)
        });
        document.querySelector('.glider').addEventListener('glider-slide-hidden', function(event){
            console.log('Slide Hidden %s', event.detail.slide)
        });
        document.querySelector('.glider').addEventListener('glider-refresh', function(event){
            console.log('Refresh')
        });
        document.querySelector('.glider').addEventListener('glider-loaded', function(event){
            console.log('Loaded')
        });

window._ = new Glider(document.querySelector('.glider'), {
            slidesToShow: 1, //'auto',
            slidesToScroll: 1,
            itemWidth: 150,
            draggable: true,
            scrollLock: false,
            dots: false,
            rewind: true,
            arrows: {
                prev: '.glider-prev',
                next: '.glider-next'
            },
            responsive: [
                {
                    breakpoint: 800,
                    settings: {
                        slidesToScroll: 'auto',
                        itemWidth: 800,
                        slidesToShow: 'auto',
                        exactWidth: true
                    }
                },
                {
                    breakpoint: 700,
                    settings: {
                        slidesToScroll: 4,
                        slidesToShow: 4,
                        dots: false,
                        arrows: false,
                    }
                },
                {
                    breakpoint: 600,
                    settings: {
                        slidesToScroll: 3,
                        slidesToShow: 3
                    }
                },
                {
                    breakpoint: 500,
                    settings: {
                        slidesToScroll: 2,
                        slidesToShow: 2,
                        dots: false,
                        arrows: false,
                        scrollLock: true
                    }
                }
            ]
        });
      });
    </script>

<!--
        Used to frame the glider on the page

Not necessary for Glider.js
    -->
    <style type="text/css">
        * {
            box-sizing: border-box
        }
        html, body {
            width: 100%;
            overflow: hidden;
        }
        .glider-contain {
            width: 90%;
            max-width: 90%;
            margin: 0 auto;
        }
        .glider-slide {
            min-height: 500px;
        }
        .glider-slide img {
            width: 100%;
        }
    </style>
  <meta charset="utf-8">
  <title><?= $menu ?></title>
  </head>
  <body>
    <div class="glider-contain">
        <div class="glider">
        <?
         for($i=0;$i<count($files2)-1;$i++){ ?>
          <div><img alt="Test" src="/street_simage/s<?=$files2[$i]; ?>"></div>
        <? } ?>

</div>
        <button class="glider-prev">&laquo;</button>
        <button class="glider-next">&raquo;</button>
        <div id="dots"></div>
    </div>
  </body>
</html>