index.html 1.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. <!DOCTYPE html>
  2. <head>
  3. <link href="https://fonts.googleapis.com/css?family=Inconsolata" rel="stylesheet">
  4. <link href="foundation.css" rel="stylesheet"/>
  5. <link href="scss/app.css" rel="stylesheet"/>
  6. <link href="scss/dropdown.css" rel="stylesheet"/>
  7. <script type="text/javascript" src="jquery.js"></script>
  8. <script type="text/javascript" src="dropdown.js"></script>
  9. <script type="text/javascript">
  10. $(document).ready(function(){
  11. $('select.light').dropdown()
  12. $('select.dark').dropdown({
  13. background: "#0f37a9",
  14. active_background:"rgb(149, 211, 255)",
  15. placeholder_color: "#97bce0",
  16. placeholder_active_color: "#0f37a9",
  17. link_color:"#405463",
  18. vertical_padding: "15px",
  19. horizontal_padding: "20px"
  20. })
  21. })
  22. </script>
  23. </head>
  24. <body>
  25. <div class="row">
  26. <div id = "content">
  27. <h2 class = "title">Awesome Dropdown <span class = "version">v0.0.1</span></h2>
  28. <div class = "divider">
  29. <select class="light" data-callback="hello" data-placeholder="Select an option">
  30. <option value="1">Option 1</option>
  31. <option value="2">Option 2</option>
  32. <option value="3">Option 3</option>
  33. <option value="1">Option 1</option>
  34. <option value="2">Option 2</option>
  35. <option value="3">Option 3</option>
  36. <option value="1">Option 1</option>
  37. <option value="2">Option 2</option>
  38. <option value="3">Option 3</option>
  39. <option value="1">Option 1</option>
  40. <option value="2">Option 2</option>
  41. <option value="3">Option 3</option>
  42. <option value="1">Option 1</option>
  43. <option value="2">Option 2</option>
  44. <option value="3">Option 3</option>
  45. </select>
  46. </div>
  47. <div class = "divider">
  48. <select class = "dark" id = "hello_dropdown" data-callback="hello" data-placeholder="Select an option">
  49. <option value="1">Hello</option>
  50. <option value="2">Option 2</option>
  51. <option value="3">Option 3</option>
  52. </select>
  53. </div>
  54. </div>
  55. </div>
  56. </body>