/* Kalp ve Animasyonlar */    .kalp {        position: absolute;        font-size: 4em;        color: #ff6b6b;         animation: float 4s ease-in forwards;        opacity: 0;    }    @keyframes bounceIn {        0% { transform: scale(0.5); opacity: 0; }        95% { transform: scale(1); opacity: 1; }    }    @keyframes float {        0% { transform: translateY(0) rotate(0deg); opacity: 1; }        100% { transform: translateY(-500px) rotate(30deg); opacity: 0; }    }</style>

<div>Benimle date'e çikarmısın👉👈?</div><div>    <button>EVET</button>    <button>HAYIR</button></div><div>    <div></div></div><script>    const hayirBtn = document.getElementById('hayirBtn');    const evetBtn = document.getElementById('evetBtn');    const mesajAlani = document.getElementById('mesaj-alani');    const sonMesajDiv = document.getElementById('sonMesaj');    const body = document.body;    const butonlarDiv = document.getElementById('butonlar');    // "Hayır" butonuna tıklandığında çalışan fonksiyon    function hayirCevabi() {        // Butonun bulunduğu 'butonlar' div'inin boyutlarını al        const containerRect = butonlarDiv.getBoundingClientRect();        const btnRect = hayirBtn.getBoundingClientRect();        // Yeni rastgele x ve y pozisyonları hesapla        // Yeni konum, butonlar div'inin sınırları içinde kalmalı        const maxX = containerRect.width - btnRect.width;        const maxY = containerRect.height - btnRect.height;                // Rastgele pozisyonları hesapla (0'dan maxX/maxY'a kadar)        const newX = Math.random() * maxX;         const newY = Math.random() * maxY;                // Butonu yeni konuma taşı (css transform kullanmak daha akıcıdır)        // Butonun yer değiştirme animasyonu kısa ve hızlı görünecektir.        hayirBtn.style.transform = `translate(${newX}px, ${newY}px)`;    }    // Kalp animasyonu oluşturan fonksiyon    function kalpOlustur(sayi) {        for (let i = 0; i < sayi; i++) {            const kalp = document.createElement('div');            kalp.textContent = '🫶';            kalp.className = 'kalp';                        // Kalp başlangıç pozisyonunu rastgele ayarla            kalp.style.left = Math.random() * 100 + 'vw';            kalp.style.bottom = '-50px'; // Ekranın altından başlasın            kalp.style.animationDelay = Math.random() * 1 + 's'; // Rastgele gecikme            mesajAlani.appendChild(kalp);        }    }    // "Evet" butonuna basıldığında çalışan fonksiyon    function evetCevabi() {        // Butonları ve soruyu gizle        evetBtn.style.display = 'none';        hayirBtn.style.display = 'none';        document.getElementById('soru').style.display = 'none';        // Mesaj alanını göster        mesajAlani.style.display = 'flex';        // Kalp animasyonunu başlat        kalpOlustur(20);         // Cevap mesajını göster        sonMesajDiv.innerHTML = 'ufak bir şaka yapmak istedim gül diye🌹! 🥰<br><br> (Anlayışın için teşekkür ederim) 😉';        // Animasyon bittikten sonra kalpleri temizle        setTimeout(() => {            // Kalpleri silmek yerine sadece ana mesajı tutabiliriz            // Amaç mesajın ve kalplerin görünmesiydi.        }, Int32Array);    }</script>