{"id":5037,"date":"2023-09-27T10:24:13","date_gmt":"2023-09-27T10:24:13","guid":{"rendered":"https:\/\/bmstechnik.de\/?page_id=5037"},"modified":"2025-11-08T13:22:06","modified_gmt":"2025-11-08T12:22:06","slug":"bewegliche-tische","status":"publish","type":"page","link":"https:\/\/www.riffelblech.berlin\/aluprofile-alt\/produkte\/sonder-projekte\/bewegliche-tische\/","title":{"rendered":"Bewegliche Tische"},"content":{"rendered":"\n<style>\nbody {\n  background-color: #f9f9f9;\n}\n\n#inner_content-3-228 .ct-inner-content #section-2-306 .ct-section .ct-section-inner-wrap .ct-inner-content #inner_content-3-306 .container_profil165 {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 10px 3%;\n  text-align: center;\n  color: #1f242d;\n}\n\n.container_profil165 section {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n}\n\n.container_profil165 section h2 {\n  text-transform: uppercase;\n  margin-bottom: 60px;\ntext-align:center;\n}\n\n.container_profil165 section p {\n  text-transform: capitalize;\n  margin-top: 0;\n  margin-bottom: 30px;\ntext-align:center;\n}\n\n.container_profil165 section .image_El_profil165 {\n  width: 100%;\n  margin-bottom: 20px;\n}\n\n.container_profil165 section .image_El_profil165 img {\n  box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);\n  border-radius: 6px;\n}\n\n.container_profil165 section table {\n  padding: 10px;\n  border-radius: 6px;\n  display: grid;\n  grid-template-columns: 1fr;\n  grid-template-rows: 1fr;\n  font-size: 14px;\n  margin-bottom: 10px;\n  word-break: break-all;\n}\n\n.container_profil165 section table tr td {\n  width: calc(100% \/ 10);\n}\n\n.container_profil165 section table thead {\n  background-color: #ddd;\n  padding: 20px;\n  font-weight: bold;\n}\n\n.container_profil165 section table tbody {\n  padding: 20px;\n  background-color: #eee;\n}\n\n.container_profil165 section table thead tr {\n  display: flex;\n  justify-content: space-around;\n}\n\n.container_profil165 section table tbody tr {\n  display: flex;\n  justify-content: space-around;\n  margin-bottom: 20px;\n  gap: 20px;\n}\n\n.container_profil165 section table tbody tr td a {\n  text-decoration: none;\n  font-weight: bold;\n  letter-spacing: 1px;\n  color: #1e73be;\n}\n\n.container_all_El_profil165 {\n  display: flex;\n  flex-direction: column;\n}\n\n.container_all_El_profil165 .slider_container_profil165 {\n  position: relative;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-direction: column;\n  width: 100%;\n  height: 300px;\n  margin-bottom: 20px;\n}\n\n.container_all_El_profil165 .slider_container_profil165 img {\n  position: absolute;\n  opacity: 0;\n  transition: opacity 1s;\n  z-index: 1;\n  width: 95%;\n  height: 95%;\n  object-fit: contain;\n}\n\n.container_all_El_profil165 .slider_container_profil165 img.active {\n  opacity: 1;\n}\n\n.container_all_El_profil165\n  .slider_container_profil165\n  .slide_number_profil165 {\n  position: absolute;\n  left: 27px;\n  top: 8px;\n  background-color: rgba(94, 94, 94, 0.6);\n  color: #fff;\n  padding: 5px 10px;\n  border-radius: 6px;\n  font-size: 20px;\n  z-index: 2;\n}\n\n.container_all_El_profil165 .slider_controls_profil165 {\n  width: 800px;\n  margin: 20px auto;\n  overflow: hidden;\n}\n\n.container_all_El_profil165 .slider_controls_profil165 .prev_profil165,\n.container_all_El_profil165 .slider_controls_profil165 .next_profil165 {\n  background-color: #1e73be;\n  color: #fff;\n  font-size: 16px;\n  text-align: center;\n  cursor: pointer;\n  border-radius: 4px;\n  padding: 5px;\n  user-select: none;\n  width: 20%;\n}\n\n.container_all_El_profil165 .slider_controls_profil165 .prev_profil165 {\n  float: left;\n}\n\n.container_all_El_profil165 .slider_controls_profil165 .next_profil165 {\n  float: right;\n}\n\n.container_all_El_profil165 .slider_controls_profil165 .prev_profil165.disabled,\n.container_all_El_profil165\n  .slider_controls_profil165\n  .next_profil165.disabled {\n  background-color: #1e73be;\n  opacity: 0.4;\n  cursor: no-drop;\n}\n\n.container_all_El_profil165 .slider_controls_profil165 .indicators_profil165 {\n  width: 50%;\n  float: left;\n}\n\n.container_all_El_profil165\n  .slider_controls_profil165\n  .indicators_profil165\n  ul {\n  list-style: none;\n  margin: 0;\n  text-align: center;\n}\n\n.container_all_El_profil165\n  .slider_controls_profil165\n  .indicators_profil165\n  ul\n  li {\n  display: inline-block;\n  background-color: #f6f6f6;\n  color: #333;\n  font-weight: bold;\n  height: 28px;\n  width: 28px;\n  border-radius: 4px;\n  margin: 0 2px;\n  line-height: 28px;\n  cursor: pointer;\n}\n\n.container_all_El_profil165\n  .slider_controls_profil165\n  .indicators_profil165\n  ul\n  li.active {\n  background-color: #1e73be;\n  color: #fff;\n}\n<\/style>\n\n\n<div class=\"container_profil165\">\n<section>\n      <h2>Bewegliche Tische<\/h2>\n    <\/section>\n\n    <section>\n      <h2 style=\"font-size:28px\">Allgemeine Eigenschaften<\/h2>\n      <p>_<\/p>\n    <\/section>\n\n    <section>\n      <h2 style=\"font-size:28px\">Anwendungsbeispiele<\/h2>\n      <div class=\"container_all_El_profil165\">\n        <div class=\"slider_container_profil165\">\n          <div id=\"slide_number_profil165\" class=\"slide_number_profil165\"><\/div>\n\n          <img decoding=\"async\" class=\"active\" src=\"https:\/\/bmstechnik.de\/wp-content\/uploads\/2023\/09\/Untitled-Project-122-1.png\"\n            alt=\"\" \/>\n          <img decoding=\"async\" class=\"active\" src=\"https:\/\/bmstechnik.de\/wp-content\/uploads\/2023\/10\/Untitled-Project-123.png\" alt=\"\" \/>\n        <\/div>\n\n        <div class=\"slider_controls_profil165\">\n          <span id=\"prev_profil165\" class=\"prev_profil165\">Previous<\/span>\n          <span id=\"indicators_profil165\" class=\"indicators_profil165\"><\/span>\n          <span id=\"next_profil165\" class=\"next_profil165\">Next<\/span>\n        <\/div>\n      <\/div>\n    <\/section>\n  <\/div>\n  <script>\n\/\/ Get slider Items | Array.from\nlet sliderImages = Array.from(\n  document.querySelectorAll(\".slider_container_profil165 img\")\n);\n\n\/\/ Get Number Of Slides\nlet slidesCount = sliderImages.length;\n\n\/\/ Set Current Slide\nlet currentSlide = 1;\n\n\/\/ Slide Number Element\nlet slideNumberElement = document.getElementById(\"slide_number_profil165\");\n\n\/\/ Previous And Next Buttons\nlet nextButton = document.getElementById(\"next_profil165\");\nlet prevButton = document.getElementById(\"prev_profil165\");\n\n\/\/ Handle Click On Previous And Next\nnextButton.onclick = nextSlide;\nprevButton.onclick = prevSlide;\n\n\/\/ Create The Main Ul Element\nlet paginationElement = document.createElement(\"ul\");\n\n\/\/ Set Id On Created Ul Element\npaginationElement.setAttribute(\"id\", \"pagination_ul\");\n\n\/\/ Create List Items Based On Slides Count\nfor (let i = 1; i <= slidesCount; i++) {\n  \/\/ Create The Li\n  let paginationItem = document.createElement(\"li\");\n\n  \/\/ Set Custom Attribute\n  paginationItem.setAttribute(\"data-index\", i);\n\n  \/\/ Set Item Content\n  paginationItem.appendChild(document.createTextNode(i));\n\n  \/\/ Append Items To The Main Ul List\n  paginationElement.appendChild(paginationItem);\n}\n\n\/\/ Add The Created Ul Element To The Page\ndocument.getElementById(\"indicators_profil165\").appendChild(paginationElement);\n\n\/\/ Get The New Created Ul\nlet paginationCreatedUl = document.getElementById(\"pagination_ul\");\n\n\/\/ Get Pagination Items | Array.from\nlet paginationsBullets = Array.from(\n  document.querySelectorAll(\"#pagination_ul li\")\n);\n\n\/\/ Loop Through All Bullets Items\nfor (let i = 0; i < paginationsBullets.length; i++) {\n  paginationsBullets[i].onclick = function () {\n    currentSlide = parseInt(this.getAttribute(\"data-index\"));\n    theChecker();\n  };\n}\n\n\/\/ Trigger The Function\ntheChecker();\n\n\/\/ Next Slide Function_radius\nfunction nextSlide() {\n  if (nextButton.classList.contains(\"disabled\")) {\n    \/\/ Do Nothing\n    return false;\n  } else {\n    currentSlide++;\n    theChecker();\n  }\n}\n\n\/\/ Previous Slide Function\nfunction prevSlide() {\n  if (prevButton.classList.contains(\"disabled\")) {\n    \/\/ Do Nothing\n    return false;\n  } else {\n    currentSlide--;\n    theChecker();\n  }\n}\n\n\/\/ Create The Checker Function\nfunction theChecker() {\n  \/\/ Set The Slide Number\n  slideNumberElement.textContent =\n    \"Slide # \" + currentSlide + \" Of \" + slidesCount;\n\n  \/\/ Remove All Active Classes\n  removeAllActive();\n\n  \/\/ Set Active Class On The Current Slide\n  sliderImages[currentSlide - 1].classList.add(\"active\");\n\n  \/\/ Set Active Class On The Current Pagination Item\n  paginationCreatedUl.children[currentSlide - 1].classList.add(\"active\");\n\n  \/\/ Check If The Current Slide Is The First\n  if (currentSlide == 1) {\n    \/\/ Add Disabled Class On Previous Button\n    prevButton.classList.add(\"disabled\");\n\n    \/\/ Remove Disabled Class From Previous Button\n  } else {\n    prevButton.classList.remove(\"disabled\");\n  }\n\n  \/\/ Check If The Current Slide Is The Last\n  if (currentSlide == slidesCount) {\n    \/\/ Add Disabled Class On Next Button\n    nextButton.classList.add(\"disabled\");\n\n    \/\/ Remove Disabled Class From Next Button\n  } else {\n    nextButton.classList.remove(\"disabled\");\n  }\n}\n\n\/\/ Remove All Active Classes From Images And Pagination Bullets\nfunction removeAllActive() {\n  \/\/ Loop Through Images\n  sliderImages.forEach((img) => {\n    img.classList.remove(\"active\");\n  });\n\n  \/\/ Loop Through Pagination Bullets\n  paginationsBullets.forEach((bullet) => {\n    bullet.classList.remove(\"active\");\n  });\n}\n\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>Bewegliche Tische Allgemeine Eigenschaften _ Anwendungsbeispiele Previous Next<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":4997,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-5037","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.riffelblech.berlin\/aluprofile-alt\/wp-json\/wp\/v2\/pages\/5037","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.riffelblech.berlin\/aluprofile-alt\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.riffelblech.berlin\/aluprofile-alt\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.riffelblech.berlin\/aluprofile-alt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.riffelblech.berlin\/aluprofile-alt\/wp-json\/wp\/v2\/comments?post=5037"}],"version-history":[{"count":8,"href":"https:\/\/www.riffelblech.berlin\/aluprofile-alt\/wp-json\/wp\/v2\/pages\/5037\/revisions"}],"predecessor-version":[{"id":8304,"href":"https:\/\/www.riffelblech.berlin\/aluprofile-alt\/wp-json\/wp\/v2\/pages\/5037\/revisions\/8304"}],"up":[{"embeddable":true,"href":"https:\/\/www.riffelblech.berlin\/aluprofile-alt\/wp-json\/wp\/v2\/pages\/4997"}],"wp:attachment":[{"href":"https:\/\/www.riffelblech.berlin\/aluprofile-alt\/wp-json\/wp\/v2\/media?parent=5037"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}