Вход Регистрация
* Jesk

4 в 1

  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta content="height=device-height, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, width=device-width" name="viewport">
  6. <title>4 в 1</title>
  7. <link href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/3.3.1/css/swiper.min.css" rel="stylesheet">
  8. <style>
  9. html, body {
  10. position: relative;
  11. height: 100%;
  12. }
  13.  
  14. body {
  15. background: #eee;
  16. font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  17. font-size: 14px;
  18. color: #000;
  19. margin: 0;
  20. padding: 0;
  21. }
  22.  
  23. iframe {
  24. border-width: 0;
  25. }
  26.  
  27. .swiper-container {
  28. width: 100%;
  29. height: 100%;
  30. }
  31.  
  32. .swiper-slide {
  33. text-align: center;
  34. font-size: 18px;
  35. background: #fff;
  36. display: -webkit-box;
  37. display: -ms-flexbox;
  38. display: -webkit-flex;
  39. display: flex;
  40. -webkit-box-pack: center;
  41. -ms-flex-pack: center;
  42. -webkit-justify-content: center;
  43. justify-content: center;
  44. -webkit-box-align: center;
  45. -ms-flex-align: center;
  46. -webkit-align-items: center;
  47. align-items: center;
  48. }
  49. </style>
  50. </head>
  51. <body>
  52. <div class="swiper-container">
  53. <div class="swiper-wrapper">
  54. <iframe class="swiper-slide" src="http://bymas.ru"></iframe>
  55. <iframe class="swiper-slide" src="https://masteram.us"></iframe>
  56. <iframe class="swiper-slide" src="http://profiwm.com"></iframe>
  57. <iframe class="swiper-slide" src="http://profiwm.ru"></iframe>
  58. </div>
  59. <div class="swiper-button-next"></div>
  60. <div class="swiper-button-prev"></div>
  61. </div>
  62. <script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/3.3.1/js/swiper.min.js"></script>
  63. <script>
  64. var swiper = new Swiper('.swiper-container', {
  65. nextButton: '.swiper-button-next',
  66. prevButton: '.swiper-button-prev',
  67. spaceBetween: 30
  68. });
  69. </script>
  70. </body>
  71. </html>
» Описание: 4 в 1
» Время добавления: 21 Дек 2016 в 19:47
» Посмотров: 2081
» textarea
» Рейтинг: [+0 | -3]
Комментарии [3]
Онлайн: 1
Реклама