私は、Webページ(HTML、PHP、JS/jQuery)で使用する写真スライドショーを探しています。フルスクリーンとアニメーションだけでなく、多数の画像をサポートする必要があります。スライドショーでは、特定のフォルダ内のすべての画像を表示する必要があります。今はSuperslides(http://archive.nicinabox.com/superslides)を使用していますが、これはかなりうまくいきます。ダイナミックにアップロードされた写真付きのHTML写真スライドショー
しかし、ここに私の質問です。スライドショーはイベント中に投影され、指定したフォルダに画像を置くためのPHPスクリプトを既に開発しています。スライドショー(恐らくSuperslidesの改造版か、最初から新しいプロジェクトを作成する)は、最初にすべての新しい画像を表示し、最初に新しい画像がすべて表示されたら、新しい画像がアップロードされたかどうかを確認する必要があります。そうであれば、それが表示されます。それ以外の場合は、古い画像で1サイクルを開始する必要があります。新しい画像が追加されたかどうかを確認する前に、古い画像をすべて表示するべきではありません!それはスケジュールされたやり方で新しい画像をチェックすることができます。あるいは、「プッシュ通知」を受け取ることができます(これはJSで可能かどうか分かりません。
すぐに使えるものはありますか?私はインターネット技術の専門家ではないことを心に留めてください(私は仕事のためにデスクトップ開発を行います)、私はPHPにはかなり熟練していますが、JSではないことを覚えておいてください...
UPDATE:これは私がやっていることですこれまでのところ...これはうまくいかない! Superslidesは正しく初期化されていません(正しい数の画像はカウントされません)。さらに、新しい写真が最初にある「優先度」キューはありません。最後に、画像のリストはプログラムによって更新されません。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>TEST PHOTO PLAYER</title>
<link rel="stylesheet" href="css/superslides.css">
</head>
<body>
<div id="slides">
<div class="slides-container" id="slides-foto-test">
</div>
<nav class="slides-navigation">
<a href="#" class="next">Next</a>
<a href="#" class="prev">Previous</a>
</nav>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
$.ajax({
url: "photo-list.php",
dataType: "json",
success: function (data) {
$.each(data, function(i,filename) {
$("#slides-foto-test").append("<img src='" + filename + "'>");
});
}
});
});
</script>
<script src="js/jquery.easing.1.3.js"></script>
<script src="js/jquery.animate-enhanced.min.js"></script>
<script src="js/jquery.superslides.min.js" type="text/javascript" charset="utf-8"></script>
<script>
$(function() {
$('#slides').superslides({
hashchange: true,
play: 4000
});
$('#slides').on('mouseenter', function() {
$(this).superslides('stop');
console.log('Stopped')
});
$('#slides').on('mouseleave', function() {
$(this).superslides('start');
console.log('Started')
});
});
</script>
</body>
</html>
これはフォトlist.phpファイルです:
<?php
$filenameArray = array();
$handle = opendir(dirname(realpath(__FILE__)).'/images/a-folder/');
while($file = readdir($handle)){
if($file !== '.' && $file !== '..'){
array_push($filenameArray, "images/a-folder/$file");
}
}
echo json_encode($filenameArray);
?>
スタックオーバーフローは、ディスカッションボードではなくプログラミングの問題を解決するための場所です。 –
私たちは猫を食べたい! – PiTiNiNjA
あなたは入力から画像を取り込んでそれをスライダーに追加するためにjsが必要です – madalinivascu