Skip to content

Instantly share code, notes, and snippets.

@Sysetup
Created September 9, 2017 04:07
Show Gist options
  • Select an option

  • Save Sysetup/78e413323c007c9fbefab2aef319e861 to your computer and use it in GitHub Desktop.

Select an option

Save Sysetup/78e413323c007c9fbefab2aef319e861 to your computer and use it in GitHub Desktop.

Revisions

  1. Sysetup* created this gist Sep 9, 2017.
    6 changes: 6 additions & 0 deletions index.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,6 @@
    <div class="load-container">
    <img src="img/logo.gif" alt="logo" class="loading"/>
    </div>
    <div>
    <img src="img/sequence/Frame0001.jpg" alt="" class="sequence" id="myimg">
    </div>
    53 changes: 53 additions & 0 deletions script.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,53 @@
    $(function () {
    //Preloader Images.
    var images = [];
    var urls = [];
    var lengthIndex;
    function preloadImages(array) {
    if (!preloadImages.list) {
    preloadImages.list = [];
    }
    var list = preloadImages.list;
    for (var i = 0; i < array.length; i++) {
    var img = new Image();
    img.onload = function() {
    var index = list.indexOf(this);
    if (index !== -1) {
    // remove image from the array once it's loaded
    // for memory consumption reasons
    list.splice(index, 1);
    }
    if(list.length === 0){
    $('.load-container').fadeOut();//.gif 'Loader' image is removed, then images loaded are shown.
    }
    }
    list.push(img);
    img.src = array[i];
    images.push(img.src);//This's the array to use finally into the html document
    }
    }

    for (var i = 1; i <= 1375; i++) {
    lengthIndex = i.toString().length;
    switch (lengthIndex) {
    case 1:
    urls.push("img/sequence/Frame000"+ i +".jpg");
    break;
    case 2:
    urls.push("img/sequence/Frame00"+ i +".jpg");
    break;
    case 3:
    urls.push("img/sequence/Frame0"+ i +".jpg");
    break;
    case 4:
    urls.push("img/sequence/Frame"+ i +".jpg");
    break;
    }
    }

    preloadImages(urls);

    for(i=0; i<images.lenght; i++){
    $("#myimg").attr("src", images[i);//This applies in this way...
    }
    });