Anzeige

Preloader

Preloader | PSD-Tutorials.de

Erstellt von ghost90, 16.08.2008.

  1. ghost90

    ghost90 Noch nicht viel geschrieben

    Dabei seit:
    21.06.2008
    Beiträge:
    29
    Geschlecht:
    männlich
    Preloader
    Hallo, ich hab mir den Preloader aus der Rubrik Tutorials besorgt.


    Code (Text):
    1. <HTML>
    2. <HEAD>
    3. <link rel="stylesheet" type="text/css" href="style.css">
    4. <SCRIPT language=JavaScript1.2>
    5. startingColor = new Array()
    6. endingColor = new Array() var yourImages = new Array
    7. ("images/loading.gif",")
    8. var locationAfterPreload = "main.php"
    9. var preloadbarWidth = 200
    10. var preloadbarHeight = 10
    11. var backgroundOfGradient = "#ffffff"startingColor[0] = "0"
    12. startingColor[1] = "0"
    13. startingColor[2] = "0"endingColor[0] = "0"
    14. endingColor[1] = "0"
    15. endingColor[2] = "0"var gap = 3
    16. if (!document.all) location.replace(locationAfterPreload)
    17. var a = 10, b = 11, c = 12, d = 13, e = 14, f=15, i, j, ones = new Array(), sixteens = new Array(), diff = new Array();
    18. var convert = new Array("0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f"), imgLen = yourImages.length;
    19. var loaded = new Array(), preImages = new Array(), currCount = 0, pending = 0, h = 0, hilite = new Array(), cover = new Array();
    20. var num = Math.floor(preloadbarWidth/gap);
    21. for (i = 0; i < 3; i++) {
    22. startingColor[i] = startingColor[i].toLowerCase();
    23. endingColor[i] = endingColor[i].toLowerCase();
    24. startingColor[i] = eval(startingColor[i]);
    25. endingColor[i] = eval(endingColor[i]);
    26. diff[i] = (endingColor[i]-startingColor[i])/num;
    27. ones[i] = Math.floor(diff[i]);
    28. sixteens[i] = Math.round((diff[i] - ones[i])*15);
    29. }
    30. endingColor[0] = 0;
    31. endingColor[1] = 0;
    32. endingColor[2] = 0;
    33. i = 0, j = 0;
    34. while (i <= num) {
    35. hilite[i] = "#";
    36. while (j < 3) {
    37. hilite[i] += convert[startingColor[j]];
    38. hilite[i] += convert[endingColor[j]];
    39. startingColor[j] += ones[j];
    40. endingColor[j] += sixteens[j];
    41. if (endingColor[j] > 15) {
    42. endingColor[j] -= 15;
    43. startingColor[j]++;
    44. }
    45. j++;
    46. }
    47. j = 0;
    48. i++;
    49. }
    50. function loadImages() {
    51. for (i = 0; i < imgLen; i++) {
    52. preImages[i] = new Image();
    53. preImages[i].src = yourImages[i];
    54. loaded[i] = 0;
    55. cover[i] = Math.floor(num/imgLen)*(i+1)
    56. }
    57. cover[cover.length-1] += num%imgLen
    58. checkLoad();
    59. }
    60. function checkLoad() {
    61. if (pending) { changeto(); return }
    62. if (currCount == imgLen) { location.replace(locationAfterPreload); return }
    63. for (i = 0; i < imgLen; i++) {
    64. if (!loaded[i] && preImages[i].complete) {
    65. loaded[i] = 1; pending++; currCount++;
    66. checkLoad();
    67. return;
    68. }
    69. }
    70. setTimeout("checkLoad()",10);
    71. }
    72. function changeto() {
    73. if (h+1 > cover[currCount-1]) {
    74. var percent = Math.round(100/imgLen)*currCount;
    75. if (percent > 100) while (percent != 100) percent--;
    76. if (currCount == imgLen && percent < 100) percent = 100;
    77. defaultStatus = "Loaded " + currCount + " out of " + imgLen + " images [" + percent + "%].";
    78. pending--;
    79. checkLoad();
    80. return;
    81. }
    82. eval("document.all.cell" + (h+1) + ".style.backgroundColor = hilite[h]");;
    83. h++;
    84. setTimeout("changeto()",1);
    85. }
    86. defaultStatus = "Loaded 0 out of " + imgLen + " images [0%]."
    87. // end hiding -->
    88. </SCRIPT>
    89. <style type="text/css">
    90. <!--
    91. .Stil1 {color: #CCCCCC}
    92. .Stil2 {color: #FFFFFF}
    93. -->
    94. </style>
    95. </HEAD>
    96. <body link="#000000" vlink="#000000" alink="#000000" text="#000000" bgcolor="#373737" topmargin="0" leftmargin="0">
    97. <TABLE height="100%" width="100%">
    98. <TBODY>
    99. <TR>
    100. <TD>
    101. <CENTER>
    102. <p><span class="Stil1">Preloading Images</span><BR>
    103. <SCRIPT language=JavaScript1.2>
    104. <!-- beging hiding
    105. document.write('<table border="1" bordercolor="#485266" cellpadding="0" cellspacing="0" width="' + preloadbarWidth + '"><tr height="' + preloadbarHeight + '" bgcolor="' + backgroundOfGradient + '">');
    106. for (i = 0; i < num; i++) {
    107. document.write('<td bordercolorlight="75A0BD" bordercolordark="75A0BD" width="' + gap + '" id="cell' + (i+1) + '"></td>');
    108. }
    109. document.write('</tr></table>');
    110. loadImages();
    111. // end hiding -->
    112. </SCRIPT>
    113. <A href="main.php" class="Stil2">skip</A>
    114. </p>
    115. </CENTER></TD></TR></TBODY></TABLE></BODY></HTML>
    hab meine main.php reingeschrieben und mein lade bild (loading.gif) reingestetzt aber es tut nicht er läd einfach nicht
     
    #1      
  2. CIX88

    CIX88 Aktives Mitglied

    Dabei seit:
    06.04.2006
    Beiträge:
    814
    Geschlecht:
    männlich
    Ort:
    GR
    Preloader
    AW: Preloader

    Tja, dann musste mal dein Script Stück für Stück durchgehen und z.B. mit Alert() mal Kontroll-Ausgaben machen. In den meisten Browsern werden auch JS-Fehler angezeigt.
     
    #2      
  3. kyle66

    kyle66 Guest

    Preloader
    AW: Preloader

    Hallo,

    da fehlen nur eineige Strichpunkte am Zeilenende

    Versuch's mal hiermit.

    Code (Text):
    1. <HTML>
    2. <HEAD>
    3. <link rel="stylesheet" type="text/css" href="style.css">
    4. <SCRIPT language=JavaScript1.2>
    5. startingColor = new Array();
    6. endingColor = new Array();
    7. var yourImages = new Array("http://www.psd-tutorials.de/modules/Forum/images/loading.gif");
    8. var locationAfterPreload = "main.php";
    9. var preloadbarWidth = 200;
    10. var preloadbarHeight = 10;
    11. var backgroundOfGradient = "#ffffff";
    12. startingColor[0] = "0";
    13. startingColor[1] = "0";
    14. startingColor[2] = "0";
    15. endingColor[0] = "0";
    16. endingColor[1] = "0";
    17. endingColor[2] = "0";
    18. var gap = 3;
    19. if (!document.all) location.replace(locationAfterPreload);
    20. var a = 10, b = 11, c = 12, d = 13, e = 14, f=15, i, j, ones = new Array(), sixteens = new Array(), diff = new Array();
    21. var convert = new Array("0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f"), imgLen = yourImages.length;
    22. var loaded = new Array(), preImages = new Array(), currCount = 0, pending = 0, h = 0, hilite = new Array(), cover = new Array();
    23. var num = Math.floor(preloadbarWidth/gap);
    24. for (i = 0; i < 3; i++) {
    25. startingColor[i] = startingColor[i].toLowerCase();
    26. endingColor[i] = endingColor[i].toLowerCase();
    27. startingColor[i] = eval(startingColor[i]);
    28. endingColor[i] = eval(endingColor[i]);
    29. diff[i] = (endingColor[i]-startingColor[i])/num;
    30. ones[i] = Math.floor(diff[i]);
    31. sixteens[i] = Math.round((diff[i] - ones[i])*15);
    32. }
    33. endingColor[0] = 0;
    34. endingColor[1] = 0;
    35. endingColor[2] = 0;
    36. i = 0, j = 0;
    37. while (i <= num) {
    38. hilite[i] = "#";
    39. while (j < 3) {
    40. hilite[i] += convert[startingColor[j]];
    41. hilite[i] += convert[endingColor[j]];
    42. startingColor[j] += ones[j];
    43. endingColor[j] += sixteens[j];
    44. if (endingColor[j] > 15) {
    45. endingColor[j] -= 15;
    46. startingColor[j]++;
    47. }
    48. j++;
    49. }
    50. j = 0;
    51. i++;
    52. }
    53. function loadImages() {
    54. for (i = 0; i < imgLen; i++) {
    55. preImages[i] = new Image();
    56. preImages[i].src = yourImages[i];
    57. loaded[i] = 0;
    58. cover[i] = Math.floor(num/imgLen)*(i+1)
    59. }
    60. cover[cover.length-1] += num%imgLen
    61. checkLoad();
    62. }
    63. function checkLoad() {
    64. if (pending) { changeto(); return }
    65. if (currCount == imgLen) { location.replace(locationAfterPreload); return }
    66. for (i = 0; i < imgLen; i++) {
    67. if (!loaded[i] && preImages[i].complete) {
    68. loaded[i] = 1; pending++; currCount++;
    69. checkLoad();
    70. return;
    71. }
    72. }
    73. setTimeout("checkLoad()",10);
    74. }
    75. function changeto() {
    76. if (h+1 > cover[currCount-1]) {
    77. var percent = Math.round(100/imgLen)*currCount;
    78. if (percent > 100) while (percent != 100) percent--;
    79. if (currCount == imgLen && percent < 100) percent = 100;
    80. defaultStatus = "Loaded " + currCount + " out of " + imgLen + " images [" + percent + "%].";
    81. pending--;
    82. checkLoad();
    83. return;
    84. }
    85. eval("document.all.cell" + (h+1) + ".style.backgroundColor = hilite[h]");;
    86. h++;
    87. setTimeout("changeto()",1);
    88. }
    89. defaultStatus = "Loaded 0 out of " + imgLen + " images [0%]."
    90. // end hiding -->
    91. </SCRIPT>
    92. <style type="text/css">
    93. <!--
    94. .Stil1 {color: #CCCCCC}
    95. .Stil2 {color: #FFFFFF}
    96. -->
    97. </style>
    98. </HEAD>
    99. <body link="#000000" vlink="#000000" alink="#000000" text="#000000" bgcolor="#373737" topmargin="0" leftmargin="0">
    100. <TABLE height="100%" width="100%">
    101. <TBODY>
    102. <TR>
    103. <TD>
    104. <CENTER>
    105. <p><span class="Stil1">Preloading Images</span><BR>
    106. <SCRIPT language=JavaScript1.2>
    107. <!-- beging hiding
    108. document.write('<table border="1" bordercolor="#485266" cellpadding="0" cellspacing="0" width="' + preloadbarWidth + '"><tr height="' + preloadbarHeight + '" bgcolor="' + backgroundOfGradient + '">');
    109. for (i = 0; i < num; i++) {
    110. document.write('<td bordercolorlight="75A0BD" bordercolordark="75A0BD" width="' + gap + '" id="cell' + (i+1) + '"></td>');
    111. }
    112. document.write('</tr></table>');
    113. loadImages();
    114. // end hiding -->
    115. </SCRIPT>
    116. <A href="main.php" class="Stil2">skip</A>
    117. </p>
    118. </CENTER></TD></TR></TBODY></TABLE></BODY></HTML>
     
    Zuletzt von einem Moderator bearbeitet: 20.08.2008
    #3      
x
×
×
teststefan