Advertisement
Guest User

Untitled

a guest
Nov 21st, 2014
224
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 7.49 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html lang="en">
  3.  
  4.  
  5. <meta
  6. name="viewport"
  7. content="width=device-width, height=device-height, initial-scale=1.0"
  8. />
  9.  
  10. <link
  11. type="text/css"
  12. rel="stylesheet"
  13. href="Screen.css"
  14. media="screen,projection,tv"
  15. />
  16. <style>
  17. #preloader { width: 100%; height: 900px; background:#000; position:fixed; left:0; top:0; text-align: center; z-index:9999999999;}
  18. #loadingbar { width: 245px; height: 245px; text-align: center; color: #fff; background: url(../img/preload_bg.gif) no-repeat 0 245px; margin-left: 38%; margin-top: 11%;}
  19. #loadingtext {
  20.  
  21. padding: 10px 0 0;
  22.  
  23. font-size:18px;
  24.  
  25.  
  26. }
  27. </style>
  28.  
  29. <title>
  30. Slidehow Demo - - Site Title
  31. </title>
  32.  
  33.  
  34. <link rel="stylesheet" href="css/preloader.html" type="text/css" />
  35.  
  36. </head><body>
  37.  
  38. <script>
  39. var imgObjs=null;
  40.  
  41. function init(){
  42. imgObjs = document.getElementsByTagName('img');
  43. for(var i = imgObjs.length; i--; ) {
  44. var imgObj = imgObjs[i];
  45. imgObj.style.position='absolute';
  46. imgObj.style.top = 0;
  47. imgObj.style.display='none';
  48. }
  49.  
  50. moveImage(0);
  51. }
  52.  
  53. function moveImage(i) {
  54. var imgObj = imgObjs[i],
  55. right = document.documentElement.clientWidth - imgObj.width;
  56.  
  57. left = imgObj.style.left = 0;
  58. imgObj.style.display='block';
  59.  
  60. function moveRight(){
  61. if (left < right) {
  62. left += 4;
  63. imgObj.style.left = Math.min(left, right) + 'px';
  64.  
  65. setTimeout(moveRight,25); // call moveRight in 20msec
  66. } else {
  67. imgObj.style.display='none';
  68. moveImage((i+1)%imgObjs.length);
  69. }
  70. }
  71. moveRight();
  72. }
  73.  
  74. window.onload = init;
  75. </script>
  76. <img src="http://newsxpressmedia.com/files/radar-simulation-files/radar007337.Gif" />
  77. <img src="http://newsxpressmedia.com/files/radar-simulation-files/radar007338.Gif" />
  78. <img src="http://newsxpressmedia.com/files/radar-simulation-files/radar007339.Gif" />
  79.  
  80. <div id="preloader">
  81. <div id="loadingbar"><img src="http://1.bp.blogspot.com/-IdPZAIYB_38/UAsThCuCjcI/AAAAAAAABK0/wzErRGy13NU/s1600/loading.gif" width="345" height="245" alt="Preload Logo" /></div>
  82. <div id="loadingtext" style="color:#FFF;" ></div>
  83. </div>
  84. <div id="slideShow">
  85.  
  86.  
  87.  
  88. <img src="http://newsxpressmedia.com/files/radar-simulation-files/radar002407.Gif" alt="slide" />
  89. <img src="http://newsxpressmedia.com/files/radar-simulation-files/radar002409.Gif" alt="slide" />
  90. <img src="http://newsxpressmedia.com/files/radar-simulation-files/radar007339.Gif" alt="slide" />
  91. <img src="http://newsxpressmedia.com/files/radar-simulation-files/radar005712.Gif" alt="slide" />
  92. <img src="http://newsxpressmedia.com/files/radar-simulation-files/radar007337.Gif" alt="slide" />
  93. <img src="http://newsxpressmedia.com/files/radar-simulation-files/radar000009.Gif" alt="slide" />
  94. <img src="http://newsxpressmedia.com/files/radar-simulation-files/radar000007.Gif" alt="slide" />
  95. <img src="http://newsxpressmedia.com/files/radar-simulation-files/radar005720.Gif" alt="slide" />
  96. <img src="http://newsxpressmedia.com/files/radar-simulation-files/radar007338.Gif" alt="slide" />
  97. <img src="http://newsxpressmedia.com/files/radar-simulation-files/radar003137.Gif" alt="slide" />
  98. <img src="http://newsxpressmedia.com/files/radar-simulation-files/radar003136.Gif" alt="slide" />
  99. <img src="http://newsxpressmedia.com/files/radar-simulation-files/radar000005.Gif" alt="slide" />
  100. <img src="http://newsxpressmedia.com/files/radar-simulation-files/radar005721.Gif" alt="slide" />
  101. <img src="http://newsxpressmedia.com/files/radar-simulation-files/radar002203.Gif" alt="slide" />
  102. <img src="http://newsxpressmedia.com/files/radar-simulation-files/radar002202.Gif" alt="slide" />
  103. <img src="http://newsxpressmedia.com/files/radar-simulation-files/radar000010.Gif" alt="slide" />
  104. <img src="http://newsxpressmedia.com/files/radar-simulation-files/radar003138.Gif" alt="slide" />
  105. <img src="http://newsxpressmedia.com/files/radar-simulation-files/radar000006.Gif" alt="slide" />
  106.  
  107.  
  108.  
  109. <!-- #slideShow --></div>
  110.  
  111. <script type="text/javascript" src="SlideShow.js"></script>
  112. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
  113. <script>window.jQuery || document.write('<script src="script/lib/jquery-1.8.2.min.js"><\/script>')</script>
  114. <script type="text/javascript">
  115. (function($) {
  116.  
  117. var imgList = [];
  118.  
  119. $.extend({
  120.  
  121. preload: function(imgArr, option) {
  122.  
  123. var setting = $.extend({
  124.  
  125. init: function(loaded, total) {},
  126.  
  127. loaded: function(img, loaded, total) {},
  128.  
  129. loaded_all: function(loaded, total) {}
  130.  
  131. }, option);
  132.  
  133. var total = imgArr.length;
  134.  
  135. var loaded = 0;
  136.  
  137.  
  138.  
  139. setting.init(0, total);
  140.  
  141. for(var i in imgArr) {
  142.  
  143. imgList.push($("<img />")
  144.  
  145. .attr("src", imgArr[i])
  146.  
  147. .load(function() {
  148.  
  149. loaded++;
  150.  
  151. setting.loaded(this, loaded, total);
  152.  
  153. if(loaded == total) {
  154.  
  155. setting.loaded_all(loaded, total);
  156.  
  157. }
  158.  
  159. })
  160.  
  161. );
  162.  
  163. }
  164.  
  165.  
  166.  
  167. }
  168.  
  169. });
  170.  
  171. })(jQuery);
  172.  
  173.  
  174.  
  175.  
  176.  
  177. $(function() {
  178. $.preload([
  179. "http://newsxpressmedia.com/files/radar-simulation-files/radar002407.Gif",
  180. "http://newsxpressmedia.com/files/radar-simulation-files/radar002409.Gif",
  181. "http://newsxpressmedia.com/files/radar-simulation-files/radar007339.Gif",
  182. "http://newsxpressmedia.com/files/radar-simulation-files/radar005712.Gif",
  183. "http://newsxpressmedia.com/files/radar-simulation-files/radar007337.Gif",
  184. "http://newsxpressmedia.com/files/radar-simulation-files/radar000009.Gif",
  185. "http://newsxpressmedia.com/files/radar-simulation-files/radar000007.Gif",
  186. "http://newsxpressmedia.com/files/radar-simulation-files/radar005720.Gif",
  187. "http://newsxpressmedia.com/files/radar-simulation-files/radar007338.Gif",
  188. "http://newsxpressmedia.com/files/radar-simulation-files/radar003137.Gif",
  189. "http://newsxpressmedia.com/files/radar-simulation-files/radar003136.Gif",
  190. "http://newsxpressmedia.com/files/radar-simulation-files/radar000005.Gif",
  191. "http://newsxpressmedia.com/files/radar-simulation-files/radar005721.Gif",
  192. "http://newsxpressmedia.com/files/radar-simulation-files/radar002203.Gif",
  193. "http://newsxpressmedia.com/files/radar-simulation-files/radar002202.Gif",
  194. "http://newsxpressmedia.com/files/radar-simulation-files/radar000010.Gif",
  195. "http://newsxpressmedia.com/files/radar-simulation-files/radar003138.Gif",
  196. "http://newsxpressmedia.com/files/radar-simulation-files/radar000006.Gif",
  197.  
  198.  
  199.  
  200.  
  201.  
  202. ], {
  203.  
  204. init: function(loaded, total) {
  205.  
  206. $(".wrapper").hide();
  207.  
  208. $("#loadingtext").html("L o a d i n g ... p l e a s e w a i t");
  209.  
  210. },
  211.  
  212. loaded: function(img, loaded, total) {
  213.  
  214. var loader = 245-((loaded/total)*245);
  215.  
  216. var prozent = Math.round(loaded/total*100);
  217.  
  218. $("#loadingtext").html("L o a d i n g : "+prozent+"%");
  219.  
  220. //$("#loadingtext").html("Lade jede Menge Inhalte: "+loaded+"/"+total);
  221.  
  222. $("#loadingbar").css({"background-position" : "0px "+loader+"px"});
  223.  
  224. },
  225.  
  226. loaded_all: function(loaded, total) {
  227. $("#loadingtext").html("L o a d e d");
  228. $("#preloader").delay(500).fadeOut();
  229. $(".wrapper").delay(1000).fadeIn("slow");
  230. }
  231.  
  232. });
  233.  
  234.  
  235.  
  236. });
  237.  
  238.  
  239. </script>
  240.  
  241. </body>
  242. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement