Forum

<img id="open-iframe-menu" class="img_button" src="img/Menue.png" width="40"

height="40" frameborder="0" style="border:0px" align="middle" alt="Menü öffnen"

title="Menü öffnen">

<!-- Overlay -->

<div id="iframe-overlay">

 <div id="iframe-menu">

 <iframe

 src="anzeige_chat.php"

 width="100%"

 height="100%"

 frameborder="0"

 allowfullscreen

 loading="lazy">

 </iframe>

 </div>

</div>

<style>

/* Overlay-Hintergrund */

#iframe-overlay {

 position: fixed;

 top: 0;

 left: 0;

 width: 100%;

 height: 90%;

 display: none;

 z-index: 1000;

}

/* Seitenmenü */

#iframe-menu {

 position: absolute;

 top: 5%;

 left: 0;

 width: 280px;

 height: 100%;

 background-color: rgba(0, 0, 0, 0.7);;

 border: 3px solid #e87c1e;

 border-radius: 15px;

 overflow: hidden;

 box-shadow: 4px 0 10px rgba(0, 0, 0, 0.3);

}

</style>

<script>

 const openIframeBtn = document.getElementById('open-iframe-menu');

 const iframeOverlay = document.getElementById('iframe-overlay');

 const iframeMenu = document.getElementById('iframe-menu');

 openIframeBtn.addEventListener('click', () => {

 iframeOverlay.style.display = 'block';

 });

 // Klick auf Overlay = Menü schließen (außerhalb vom Menü)

 iframeOverlay.addEventListener('click', (e) => {

 if (!iframeMenu.contains(e.target)) {

 iframeOverlay.style.display = 'none';

 }

 });

</script>

<div id="onlinelist">

<center>    

  <iframe src="https://grazybeats.com/modul/radio/player/streambox-technobasefm.php" width="180" height="190px" frameborder="0" style="border:0px" align="middle" scrolling="no"></iframe>

</center>



<!-- <img style="height=90px; width:100%;" src="styles/<?php echo $_SESSION['etchat_'.$this->_prefix.'style']; ?>/logo.png" /> -->



<center><div hidden id="djbox"></div></center>

<center><!-- DJ_Online_Anzeige trage bei (src='img/kein_dj_onair.png') den Link zu deiner DJ Online Anzeige ein --><iframe hidden src='img/kein_dj_onair.png' name='iframe' class='dj_online' id='dj_online' scrolling='no' frameborder='0'></iframe></center>

<center><div hidden id="liveguide"></div></center>



<style type="text/css">

.tabs-container { width: 100%; height: 450px; line-height: 150%;}

.tab-buttons { display: flex; border: 2px solid #e87c1e;}

.tab-btn {flex: 1; font-size:  16px; color: #ffaa00; background: transparent; padding: 10px;cursor: pointer;}

.tab-btn.active {background-color: #311a1c85;}

.tab-content { padding: 20px; display: none; }

</style>



<div class="tabs-container">

  <div class="tab-buttons">

    <button class="tab-btn active" onclick="openTab(event, 'onlineausgabe')">Online</button>

    <button class="tab-btn" onclick="openTab(event, 'Radio')">Radio</button>

    <button class="tab-btn" onclick="openTab(event, 'News')">News</button>

    <button class="tab-btn" onclick="openTab(event, 'Neu')">TS 3</button>

  </div>



  <div id="onlineausgabe" class="tab-content" style="display:block;">

<div align="left"><span id="Online-Zeit"></span></div>

<div id="onlineausgabe"><center><img src="img/ajax-loader.gif" alt="" /></center></div>





</div>





  <div id="Radio" class="tab-content" style="display:none;">

<div class="user-container"><iframe width="560" height="315" src="content/content/anzeige_chat.php" frameborder="0" allowfullscreen></iframe></div>

  </div>

  <div id="News" class="tab-content" style="display:none;">

<div class="user-container"><iframe width="560" height="315" src="./box-links.php" frameborder="0" allowfullscreen></iframe></div>

  </div>

  <div id="Neu" class="tab-content" style="display:none;">

<div class="user-container"><iframe width="560" height="315" src="./teamspeak.php" frameborder="0" allowfullscreen></iframe></div>

  </div>



<script>

function openTab(evt, tabName) {

  var i, tabcontent, tablinks;

  tabcontent = document.getElementsByClassName("tab-content");

  for (i = 0; i < tabcontent.length; i++) {

    tabcontent[i].style.display = "none";

  }

  tablinks = document.getElementsByClassName("tab-btn");

  for (i = 0; i < tablinks.length; i++) {

    tablinks[i].className = tablinks[i].className.replace(" active", "");

  }

  document.getElementById(tabName).style.display = "block";

  evt.currentTarget.className += " active";

}



</script></div>