3

基本的に私が求めているのは、(サーバーに保持されている) フォルダー内のすべての画像を nivo スライダーに動的にロードする方法です。現在、nivo スライダーのスクリプトでは、各写真を個別に参照する必要があります。例えば：

<div class="slider-wrapper theme-default">
        <div class="ribbon"></div>
        <div id="slider" class="nivoSlider">
            <img src="images/toystory.jpg" alt="" />
            <a href="http://dev7studios.com"><img src="images/up.jpg" alt="" title="This is an example of a caption" /></a>
            <img src="images/walle.jpg" alt="" data-transition="slideInLeft" />
            <img src="images/nemo.jpg" alt="" title="#htmlcaption" />
        </div>

(上記のコードは html ファイルから抜き出されたものです)。

初心者ユーザーが Web サイトを維持するため、ディレクトリに写真を追加または削除するたびに、手動でコードを変更することはできません。

この時点で、ページの読み込み時にすべての写真が読み込まれるか一部の写真が読み込まれるかは気にしません。

この問題の解決方法に関する情報を見つけるのに少し苦労しました。私が見つけることができた最も近いソースの1つは、このサイトにあります（ユーザーがスクロールして表示するときに画像を動的に（または遅延して）ロードする方法）。

正直なところ、私は jquery (および一般的なプログラミング) の初心者であり、いくつかの基本に苦労しています。したがって、私のために質問に答えるときは、ダミーのアプローチをとってください。

現在、サーバーに保存されている画像フォルダー (すべての画像を保存する)、jscript ファイル、および css ファイルがあります。次に、HTML を Web パーツに追加して (SharePoint を使用して Web ページを変更するため)、スライダーを表示します。

コードはすべてクライアント側で実行できますか、それともサーバー側とクライアント側の両方で実行する必要がありますか?

4

5 に答える 5

0

php と dropzone.js を使用して、ディレクトリ サーバーから画像を取得することができます。

このハウツー リンクを確認してくださいhttp://www.startutorial.com/articles/view/dropzonejs-php-how-to-display-existing-files-on-server

于 2013-12-31T11:52:19.337 に答える
0

これにより、画像名が Javascript 配列に配置されます。

$dir = 'images/c-data/' . $result; //set the working directory
$pics = scandir($dir);
unset($pics[0], $pics[1]); //first and second ellement are the "."".." , get rid of them
$string = '<script type ="text/javascript">var images_' . $result . ' =[ ';
foreach ($pics as $key => $item) {
    $string .= '"' . $item . '",';
}
echo substr($string, 0, -1) . "];</script>";

これは、それらを循環するときにそれらをエコーアウトします。

$path = 'images/c-data/';
$results = scandir($path);
$dirArray = array();
unset($results[0], $results[1]); //first and second ellement are the "."".." , get rid of them
foreach ($results as $result) {
    echo 'Image' . $result . ', ';
}

どちらの場合もphp scandir()、ディレクトリ内のすべての項目の配列を返す を使用しています。

于 2015-11-11T14:37:03.583 に答える
0

ブラウザなどのクライアントが、サーバー上のディレクトリ内のすべてのファイルを認識することはできません。ほとんどの場合、セキュリティ上の問題と見なされるディレクトリのリストが有効になっている場合を除き、そうでないことをお勧めします..

  1. たとえば、Tomcat のディレクトリ リストを有効にする方法をここで確認してください。これを有効にする場合は、ajax 呼び出しを使用してディレクトリ パスをヒットし、応答ですべてのハイパーリンクを検索し、拡張子が jpg のハイパーリンクをフィルタリングして、リンクをプラグインに渡します。

  2. さらに良いことに、この特定のディレクトリ内のファイルのリストを動的に取得するサービスをサーバー側に記述し (適切な認証を使用しますが、それでも問題はあります)、サービスをヒットしてファイルのリストを取得し、それらをプラグインに渡します。

于 2012-04-20T05:21:47.070 に答える
0

ajax 呼び出しを使用して、すべての画像パスを JavaScript 配列にロードすることをお勧めします (サーバー側のプログラミングが必要で、画像フォルダーがサーバー上にある必要があります)。次に、スライドショーの jquery プラグインをググって、素晴らしいスライドショーを作成できます。

于 2012-04-20T06:42:38.797 に答える
0

私は同じことをしていて、nivoスライダーにいくつかの変更を加えて動作させました。

必要がある：

  • サーバーフォルダーからすべての画像を取得するためのサーバー側コードを記述します。画像DOMオブジェクトに追加できるパスのみ

  • サーバー側コードを呼び出すためのJavaScript ajaxコードを記述し、応答を解析して画像オブジェクトを作成し、domに追加します

nivoの現在のバージョンでは、新しい画像をスライダーに追加できないと思うので、する必要があります

  • nivo コードを更新して、新しい画像を追加できるようにする
于 2012-05-10T02:45:35.600 に答える