jQuery Properties

<!DOCTYPE html>
<html>
<head>
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
    <style>
        body { font-family: sans-serif; padding: 20px; background: #f8fafc; }
        .card { background: white; padding: 20px; border-radius: 8px; border: 1px solid #cbd5e1; max-width: 450px; }
        .kotak { width: 100%; height: 60px; background: #00758f; color: white; line-height: 60px; text-align: center; border-radius: 6px; margin: 15px 0; }
        button { background: #0d2e5c; color: white; border: none; padding: 8px 14px; border-radius: 6px; cursor: pointer; }
    </style>
</head>
<body>
    <div class="card">
        <h3>Kontrol Global Properti Animasi</h3>
        <div class="kotak" id="kotakFx">Animasi Skillance</div>
        
        <button id="btnToggleAnim">Toggle Kotak (Animasi)</button>
        <button id="btnMatikanFx" style="background:#ef4444;">Matikan Efek ($.fx.off = true)</button>
    </div>

    <script>
        $(document).ready(function() {
            $('#btnToggleAnim').click(function() {
                $('#kotakFx').toggle(1000); // Durasi 1 detik
            });
            $('#btnMatikanFx').click(function() {
                jQuery.fx.off = !jQuery.fx.off;
                alert('Status jQuery.fx.off: ' + jQuery.fx.off + ' (Animasi kini instan tanpa durasi delay)');
            });
        });
    </script>
</body>
</html>