複数の選択でスワイプまたはクリックしてフォルダ、スライダスタイル（1つずつ）に画像を表示

Question

私は標準のもの（html、javascript、jquery、php）でコード化されたウェブサイトを持っています。私は一日を通して画像をダンプするフォルダを持っています。私は、タブレット上でWebサイトにアクセスし、画像から画像までスワイプし、1つまたは複数（ファイル名で）を選択し、そのリストを次の手順に渡すことができる必要があります。

私は主にデータベースのフォームなどを扱っていますが、画像の表示や選択した画像のスワイプやトラックの記録についてはわかりません。正しい方向に私を向けるどんな助けもありがとう！私は誰も私の仕事をすることを本当に期待していない...ちょうどどこから始めるべきかわからない（はい、私はしばらくの間グーグルで行っている）。

ありがとうございます！

Answer 1

問題を解決するにはさまざまな方法があります。 Bootstrap's Carouselを使用できます。それはかなりうまくいく。 PHPを使用していると仮定すると、ディレクトリの内容に基づいて要素を作成できます。

カルーセルのためのあなたのベースコード - ストレートブートストラップのコンテンツから：

<div id="carouselExampleControls" class="carousel slide" data-ride="carousel"> 
    <div class="carousel-inner"> 
    <div class="carousel-item active"> 
     <img class="d-block w-100" src="..." alt="First slide"> 
    </div> 
    <div class="carousel-item"> 
     <img class="d-block w-100" src="..." alt="Second slide"> 
    </div> 
    <div class="carousel-item"> 
     <img class="d-block w-100" src="..." alt="Third slide"> 
    </div> 
    </div> 
    <a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev"> 
    <span class="carousel-control-prev-icon" aria-hidden="true"></span> 
    <span class="sr-only">Previous</span> 
    </a> 
    <a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next"> 
    <span class="carousel-control-next-icon" aria-hidden="true"></span> 
    <span class="sr-only">Next</span> 
    </a> 
</div> 

あなたはscandirを使用することができ、自動PHPスクリプトを作成し、コンテンツをループするforeachループを使用するには：

<?php 
$dir = './images/'; 
$file_list = array_diff(scandir($dir), array('..', '.')); 

foreach($file_list as $item) 
{ 
    echo '<div class="carousel-item">'; 
    echo '<img="' . $item . '" class="d-block w-100">'; 
    echo '</div>'; 
} 
?> 

これは、そのディレクトリ内のファイルに基づいてループを作成します。