ios6switch.css 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. .ios6switch{
  2. overflow:hidden;
  3. position:relative;
  4. display:inline-block;
  5. margin:2px;
  6. cursor:default;
  7. vertical-align:middle;
  8. box-sizing:content-box;
  9. }
  10. .ios6switch *{
  11. -moz-user-select:none;
  12. -khtml-user-select:none;
  13. -webkit-user-select:none;
  14. -ms-user-select:none;
  15. user-select:none;
  16. }
  17. .ios6switch .ios6switch_shadow_and_highlight{
  18. position:absolute;
  19. left:0px;
  20. top:0px;
  21. width:100%;
  22. height:100%;
  23. background-repeat:no-repeat;
  24. background-image:url(images/ios6switch_shadow.png);
  25. background-size:100% 100%;
  26. z-index:1;
  27. }
  28. .ios6switch .ios6switch_draglayer{
  29. position:absolute;
  30. height:100%;
  31. width:100%;
  32. }
  33. .ios6switch .ios6switch_switch_off{
  34. position:absolute;
  35. top:0px;
  36. height:100%;
  37. width:100%;
  38. text-align:center;
  39. }
  40. .ios6switch .ios6switch_switch_on{
  41. position:absolute;
  42. top:0px;
  43. height:100%;
  44. width:100%;
  45. text-align:center;
  46. }
  47. .ios6switch .ios6switch_thumb{
  48. position:absolute;
  49. left:0px;
  50. top:0px;
  51. background-repeat:no-repeat;
  52. background-image:url(images/ios6switch_thumb.png);
  53. background-size:100% 100%;
  54. border-radius:50%;
  55. box-shadow:0px 0px 3px #000, 1px 0px 0px rgba(0,0,0,.3) inset, -1px 0px 0px rgba(0,0,0,.3) inset, 0px 1px 0px rgba(0,0,0,.3) inset, 0px -1px 0px rgba(0,0,0,.3) inset;
  56. z-index:2;
  57. }