تلپرامتر برای تولید محتوا ویدیویی

<!DOCTYPE html>
<html lang="fa">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Minimal Teleprompter</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #171717;
            color: #bababa;
            margin: 0;
            padding: 0;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            height: 100vh;
        }

        .container {
            background-color: #212121;
            padding: 20px;
            border-radius: 10px;
            box-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
            width: 90%;
            max-width: 600px;
        }

        h1 {
            text-align: center;
            color: #bababa;
            margin-bottom: 20px;
            font-size: 1.8em;
        }

        textarea {
            width: 100%;
            height: 100px;
            background-color: #282828;
            color: #bababa;
            border: none;
            border-radius: 5px;
            padding: 10px;
            font-size: 1em;
            resize: none;
            box-sizing: border-box;
        }

        .controls {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-top: 20px;
        }

        button {
            background-color: #3c3c3c;
            color: #bababa;
            border: none;
            padding: 10px 20px;
            border-radius: 5px;
            cursor: pointer;
            font-size: 1em;
        }

        button:disabled {
            background-color: #2f2f2f;
            cursor: not-allowed;
        }

        .speed-control {
            display: flex;
            align-items: center;
        }

        input[type="range"] {
            margin-left: 10px;
            width: 100px;
        }

        #teleprompter {
            margin-top: 30px;
            background-color: #282828;
            padding: 15px;
            border-radius: 5px;
            height: 200px;
            overflow-y: auto;
            font-size: 1.2em;
            line-height: 1.6;
        }

        .highlight {
            background-color: #3c3c3c;
            border-radius: 3px;
        }

        @media (max-width: 600px) {
            h1 {
                font-size: 1.5em;
            }

            button, input[type="range"] {
                font-size: 0.9em;
            }

            #teleprompter {
                height: 150px;
            }
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>تلپرامتر مینیمال</h1>
        <textarea id="inputText" placeholder="متن خود را اینجا وارد کنید."></textarea>
        <div class="controls">
            <button id="startBtn" disabled>شروع</button>
            <div class="speed-control">
                <label for="speedRange">سرعت:</label>
                <input type="range" id="speedRange" min="1" max="10" value="5">
            </div>
        </div>
        <div id="teleprompter"></div>
    </div>

    <script>
        const inputText = document.getElementById('inputText');
        const startBtn = document.getElementById('startBtn');
        const teleprompter = document.getElementById('teleprompter');
        const speedRange = document.getElementById('speedRange');

        let words = [];
        let currentIndex = 0;
        let intervalId = null;

        inputText.addEventListener('input', () => {
            startBtn.disabled = inputText.value.trim() === '';
        });

        startBtn.addEventListener('click', () => {
            if (intervalId) {
                clearInterval(intervalId);
                startBtn.textContent = 'شروع';
                intervalId = null;
            } else {
                startTeleprompter();
                startBtn.textContent = 'توقف';
            }
        });

        function startTeleprompter() {
            words = inputText.value.split(/\s+/);
            currentIndex = 0;
            teleprompter.innerHTML = '';
            intervalId = setInterval(displayWord, 1000 / speedRange.value);
        }

        function displayWord() {
            if (currentIndex < words.length) {
                teleprompter.innerHTML = '';
                for (let i = 0; i < words.length; i++) {
                    const wordSpan = document.createElement('span');
                    wordSpan.textContent = words[i] + ' ';
                    if (i === currentIndex) {
                        wordSpan.className = 'highlight';
                    }
                    teleprompter.appendChild(wordSpan);
                }
                teleprompter.scrollTop = teleprompter.scrollHeight;
                currentIndex++;
            } else {
                clearInterval(intervalId);
                startBtn.textContent = 'شروع';
                intervalId = null;
            }
        }

        speedRange.addEventListener('input', () => {
            if (intervalId) {
                clearInterval(intervalId);
                intervalId = setInterval(displayWord, 1000 / speedRange.value);
            }
        });
    </script>
</body>
</html>

این اسکریپت یک ابزار تلپرامتر است که به شما کمک می‌کند متن‌های خود را به راحتی و با تمرکز بیشتر، هنگام ضبط ویدیوها بخوانید. طراحی این تلپرامتر به گونه‌ای است که با استفاده از یک رابط کاربری مینیمال و رنگ‌های تیره (#2f2f2f، #212121، #171717، #3c3c3c، و #282828)، تجربه کاربری ساده و بی‌دردسری را فراهم می‌کند.

ویژگی‌های اسکریپت:

ریسپانسیو بودن: این اسکریپت به طور کامل ریسپانسیو است و در تمامی پلتفرم‌ها، از جمله موبایل و دسکتاپ، به خوبی کار می‌کند. سایز فونت‌ها و اجزا با توجه به اندازه صفحه نمایش به صورت خودکار تنظیم می‌شوند.

تنظیم سرعت: کاربران می‌توانند سرعت نمایش کلمات را به دلخواه تنظیم کنند تا با ریتم صحبت کردنشان هماهنگ باشد.

ساده و کاربرپسند: رابط کاربری به گونه‌ای طراحی شده که کاربران بتوانند به راحتی متن خود را وارد کنند و تنها با فشردن یک دکمه، پخش آن را آغاز کنند.

پشتیبانی از متن‌های طولانی: این اسکریپت قادر است متن‌های طولانی را به صورت کلمه به کلمه نمایش دهد، به گونه‌ای که کاربران بتوانند بدون دغدغه از گم کردن خطوط، متن را دنبال کنند.

این اسکریپت برای افرادی که محتوای ویدیویی تولید می‌کنند و به دنبال روشی ساده برای خواندن متن‌های خود هستند، می‌تواند ابزار مناسبی باشد. شما می‌توانید با استفاده از این اسکریپت، تمرکز خود را روی ارائه محتوا بگذارید و از تجربه‌ای ساده و کارآمد لذت ببرید.

تلپرامتر ساده و کاربرپسنده مخصوص یوتیوبری و تولید ویدیوهای خفن

اسکریپت تلپرامپتر حرفه‌ای برای ساخت ویدیو یوتوب

اسکریپت جدید تلپرامتر حرفه‌ای برای تولید محتوا ویدیو یوتیوب و آپارتت

تله پرامپتر برای ساخت ویدیو آموزشی

تلپرامتر حرفه‌ای برای تولید محتوا ویدیویی

تلپرامتر برای تولید محتوا ویدیویی

تلپرامتر حرفه‌ای برای تولید ویدیو

color ,intervalid ,teleprompter ,border ,startbtn ,background ,background color ,font size ,border radius ,document getelementbyid ,color bababa ,align items center ,intervalid startbtn textcontent ,intervalid setinterval displayword ,1000 speedrange value