javascript - Orbit スライダーに画像をプリロードするにはどうすればよいですか?

Question

問題は、ユーザーが最初にサイトにアクセスしたときにスライダーが正しく表示されないことです。テストでは、スライダーは正常に機能しました。

または、実際には、最初にページにアクセスしたときに読み込まれず、ページを更新したときに (そしてそのときだけ) 表示されるという問題がありました。それ以外の場合は、スライダーは表示されますが、画像は表示されません

OrbitスライダーのZurbsドキュメントでZurbのドキュメントを見たところ、サンプルファイルがあり、元のデモファイルには画像の上にリンクがあります（削除しました）

次に、キーワード「軌道プリロード画像」を使用してこのトピックに関するフレーズを使用してGoogleでさらに検索し、プリロード機能を備えたOneソリューションを見つけました。以下は、プリロードに使用したコードです (画像へのパスのみを変更しました)。

<script language="javascript">
  function preload(arrayOfImages) {
    $(arrayOfImages).each(function(){
      $('<img/>')[0].src = this;
    });
  }
  preload([
    '../images/products/mill/slider/dentist.jpg',
    '../images/products/mill/slider/side.jpg',
    '../images/products/mill/slider/before.jpg',
    '../images/products/mill/slider/after.jpg',
    '../images/products/mill/slider/radio.jpg'
  ]);
</script>

先に進んでスクリプトを追加しましたが、まだロードされていません。そのページの完全なコードは、GitHub の Gist で表示できます

画像スライダーのセットアップのコードは、GitHub の Gist で確認できます。

このサイトは、php をサポートしない .net 環境のサーバーでホストされています。