simple.html 2.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>AnythingSlider Simple Demo</title>
  6. <link rel="shortcut icon" href="demos/images/favicon.ico">
  7. <link rel="apple-touch-icon" href="demos/images/apple-touch-icon.png">
  8. <!-- jQuery (required) -->
  9. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
  10. <script>window.jQuery || document.write('<script src="js/jquery.min.js"><\/script>')</script>
  11. <!-- Demo stuff -->
  12. <link rel="stylesheet" href="demos/css/page.css">
  13. <!-- Anything Slider -->
  14. <link rel="stylesheet" href="css/anythingslider.css">
  15. <script src="js/jquery.anythingslider.js"></script>
  16. <!-- AnythingSlider optional extensions -->
  17. <!-- <script src="js/jquery.anythingslider.fx.js"></script> -->
  18. <!-- <script src="js/jquery.anythingslider.video.js"></script> -->
  19. <!-- Define slider dimensions here -->
  20. <style>
  21. #slider { width: 700px; height: 390px; }
  22. </style>
  23. <!-- AnythingSlider initialization -->
  24. <script>
  25. // DOM Ready
  26. $(function(){
  27. $('#slider').anythingSlider();
  28. });
  29. </script>
  30. <!-- Older IE stylesheet, to reposition navigation arrows, added AFTER the theme stylesheet -->
  31. <!--[if lte IE 7]>
  32. <link rel="stylesheet" href="css/anythingslider-ie.css" type="text/css" media="screen" />
  33. <![endif]-->
  34. </head>
  35. <body id="simple">
  36. <!-- Links to other demo pages & docs -->
  37. <div id="nav">
  38. <a href="index.html">Main Demo</a>
  39. <a class="current" href="simple.html">Simple Demo</a>
  40. <a href="expand.html">Expand Demo</a>
  41. <a href="video.html">Video Demo</a>
  42. <a href="demos.html">FX Demos</a>
  43. <a class="play" href="http://jsfiddle.net/Mottie/VM8XG/">Playground</a>
  44. <a class="git" href="https://github.com/ProLoser/AnythingSlider/wiki">Documentation</a>
  45. <a class="git" href="http://github.com/ProLoser/AnythingSlider/downloads">Download</a>
  46. <a class="issue" href="https://github.com/ProLoser/AnythingSlider/issues">Issues</a><br><br>
  47. </div>
  48. <!-- End Links -->
  49. <!-- Simple AnythingSlider -->
  50. <ul id="slider">
  51. <li><img src="demos/images/slide-civil-1.jpg" alt=""></li>
  52. <li><img src="demos/images/slide-env-1.jpg" alt=""></li>
  53. <li><img src="demos/images/slide-civil-2.jpg" alt=""></li>
  54. <li><img src="demos/images/slide-env-2.jpg" alt=""></li>
  55. </ul>
  56. <!-- END AnythingSlider -->
  57. </body>
  58. </html>