Bisoralim Forum-Aranılan Forumun Adresi
Süper Neon Renkte İndex Tema - Yazdırılabilir Versiyon

+- Bisoralim Forum-Aranılan Forumun Adresi (https://bisoralim.com/forum)
+-- Forum: Radyolar ve Radyo Temaları (https://bisoralim.com/forum/forumdisplay.php?fid=4)
+--- Forum: Radyo İndex (https://bisoralim.com/forum/forumdisplay.php?fid=77)
+---- Forum: Forum İndexleri (https://bisoralim.com/forum/forumdisplay.php?fid=78)
+---- Konu: Süper Neon Renkte İndex Tema (/showthread.php?tid=172)


Süper Neon Renkte İndex Tema - Bisoralim.Com - 26.02.2026

İndex  Özellikleri :

✔ DJ resimleri sağdan sola kayan şerit (en az 20 resim)
✔ Altlarında 20 farklı renkli kayan isimler
✔ Chat alanı responsive (kullanıcının boyutuna göre otomatik genişleyip daralır)
✔ Chat altında detaylı radyo kuralları aşağıdan yukarı yavaş akış

DEMO İÇİN TIKLA 







Kod:
<!DOCTYPE html>
<html lang="tr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>RadyoKanka | Profesyonel Yayın</title>

<style>
*{margin:0;padding:0;box-sizing:border-box;font-family:Arial,Helvetica,sans-serif}
body{
    background:#050510;
    color:#fff;
    overflow-x:hidden;
}

/* HEADER */
.header{
    text-align:center;
    padding:40px 20px;
    background:linear-gradient(90deg,#0f0c29,#302b63,#24243e);
}
.logo{
    font-size:42px;
    font-weight:bold;
    background:linear-gradient(90deg,#ff00cc,#00f2ff);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}
.tagline{
    margin-top:10px;
    opacity:.8;
}

/* DJ SLIDER */
.dj-slider{
    overflow:hidden;
    background:#0b0f1f;
    padding:20px 0;
}
.dj-track{
    display:flex;
    width:max-content;
    animation:scrollLeft 40s linear infinite;
}
.dj{
    width:180px;
    margin:0 10px;
    text-align:center;
}
.dj img{
    width:100%;
    height:180px;
    object-fit:cover;
    border-radius:15px;
    box-shadow:0 0 20px rgba(0,255,255,.3);
}

@keyframes scrollLeft{
    from{transform:translateX(100%)}
    to{transform:translateX(-100%)}
}

/* İSİM KAYAN YAZI */
.name-marquee{
    margin-top:10px;
    white-space:nowrap;
    overflow:hidden;
    position:relative;
}
.name-track{
    display:inline-block;
    padding-left:100%;
    animation:nameScroll 25s linear infinite;
}
.name-track span{
    margin:0 25px;
    font-weight:bold;
    font-size:15px;
}

@keyframes nameScroll{
    from{transform:translateX(0)}
    to{transform:translateX(-100%)}
}

/* CHAT */
.chat-container{
    width:95%;
    max-width:1400px;
    margin:40px auto;
}
.chat-box{
    width:100%;
    aspect-ratio:16/9;
    min-height:400px;
    border-radius:20px;
    overflow:hidden;
    box-shadow:0 0 40px rgba(0,255,255,.3);
}
.chat-box iframe{
    width:100%;
    height:100%;
    border:0;
}

/* KURALLAR */
.rules-section{
    width:95%;
    max-width:1000px;
    margin:40px auto;
    height:250px;
    overflow:hidden;
    position:relative;
    border-radius:15px;
    background:#0b0f1f;
    box-shadow:0 0 30px rgba(255,0,200,.2);
}

.rules-track{
    position:absolute;
    width:100%;
    animation:scrollUp 60s linear infinite;
}

.rules-track p{
    padding:10px 20px;
    font-size:14px;
    line-height:1.6;
    color:#ccc;
}

@keyframes scrollUp{
    from{transform:translateY(100%)}
    to{transform:translateY(-100%)}
}

/* FOOTER */
.footer{
    text-align:center;
    padding:20px;
    background:#000;
    font-size:14px;
    opacity:.7;
}

/* MOBİL */
@media(max-width:768px){
    .dj{width:130px}
    .dj img{height:130px}
    .chat-box{aspect-ratio:auto;height:400px}
}
</style>
</head>
<body>

<div class="header">
    <div class="logo">RADYOKANKA</div>
    <div class="tagline">Kalbin Frekansı • 7/24 Canlı Yayın</div>
</div>

<!-- DJ RESİM SLIDER -->
<div class="dj-slider">
    <div class="dj-track">

        <!-- 20 RESİM -->
        <!-- İstersen linkleri değiştir -->
        <script>
        for(let i=1;i<=20;i++){
            document.write(`
            <div class="dj">
                <img src="https://picsum.photos/300?random=${i}">
            </div>
            `);
        }
        </script>

    </div>

    <!-- 20 FARKLI RENK İSİM -->
    <div class="name-marquee">
        <div class="name-track">
            <span style="color:#ff0000">Kurucu Kanka</span>
            <span style="color:#00ff00">Admin Mavi</span>
            <span style="color:#00ffff">DJ Kardelen</span>
            <span style="color:#ff00ff">DJ Gece</span>
            <span style="color:#ffff00">DJ Ateş</span>
            <span style="color:#ff8800">DJ Rüzgar</span>
            <span style="color:#00aaff">Admin Seda</span>
            <span style="color:#aa00ff">DJ Fırtına</span>
            <span style="color:#ff4444">DJ Hüzün</span>
            <span style="color:#44ff44">DJ Damar</span>
            <span style="color:#44ffff">DJ Işık</span>
            <span style="color:#ff44ff">DJ Gölge</span>
            <span style="color:#ffaa00">DJ Sevda</span>
            <span style="color:#8888ff">Admin Bora</span>
            <span style="color:#ff6666">DJ Kral</span>
            <span style="color:#66ff66">DJ Melek</span>
            <span style="color:#66ffff">DJ Şahin</span>
            <span style="color:#ff66ff">DJ Yıldız</span>
            <span style="color:#ffffff">Kurucu Patron</span>
            <span style="color:#00ffcc">DJ Asi</span>
        </div>
    </div>
</div>

<!-- CHAT -->
<div class="chat-container">
    <div class="chat-box">
        <iframe src="https://SENINCHATADRESIN/chat/"></iframe>
    </div>
</div>

<!-- RADYO KURALLARI -->
<div class="rules-section">
    <div class="rules-track">
        <p>1. Tüm kullanıcılar saygılı olmak zorundadır.</p>
        <p>2. Küfür, hakaret ve aşağılayıcı sözler yasaktır.</p>
        <p>3. Siyasi propaganda yapmak yasaktır.</p>
        <p>4. Reklam paylaşımı yasaktır.</p>
        <p>5. Özel mesajla rahatsız etmek yasaktır.</p>
        <p>6. DJ yayındayken söz kesilmez.</p>
        <p>7. Yönetici kararlarına itiraz chat ortamında yapılmaz.</p>
        <p>8. Caps Lock kullanımı yasaktır.</p>
        <p>9. Kişisel bilgi paylaşımı yasaktır.</p>
        <p>10. Trollük yapan kullanıcı uzaklaştırılır.</p>
        <p>11. Radyo huzur ortamıdır.</p>
        <p>12. Herkes eşittir.</p>
        <p>13. DJ talepleri spam yapılmaz.</p>
        <p>14. Flood yasaktır.</p>
        <p>15. Sunucu güvenliği önemlidir.</p>
        <p>16. Chat kurallarına uymayan atılır.</p>
        <p>17. Yayın kayıt altına alınabilir.</p>
        <p>18. Kültürlü sohbet esastır.</p>
        <p>19. Aile ortamına uygun davranış zorunludur.</p>
        <p>20. Kurallara uymayanlar süresiz banlanır.</p>
    </div>
</div>

<div class="footer">
© 2026 RadyoKanka • Profesyonel Yayın Platformu
</div>

</body>
</html>