<!DOCTYPE html>
<html lang="fa">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Teleprompter Minimal</title>
<style>
body {
margin: 0;
font-family: Arial, sans-serif;
background-color: #171717;
color: #bababa;
direction: rtl;
text-align: right;
}
#container {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
min-height: 100vh;
padding: 20px;
background-color: #2f2f2f;
box-sizing: border-box;
}
h1 {
color: #bababa;
margin-bottom: 20px;
}
textarea {
width: 100%;
max-width: 800px;
height: 150px;
padding: 10px;
font-size: 1.2em;
color: #bababa;
background-color: #3c3c3c;
border: 1px solid #282828;
border-radius: 5px;
resize: none;
box-sizing: border-box;
}
button {
margin-top: 10px;
padding: 10px 20px;
font-size: 1.2em;
color: #bababa;
background-color: #212121;
border: none;
border-radius: 5px;
cursor: pointer;
transition: background-color 0.3s;
}
button:hover {
background-color: #3c3c3c;
}
#teleprompter {
margin-top: 30px;
width: 100%;
max-width: 800px;
height: 200px;
overflow: hidden;
background-color: #212121;
border-radius: 10px;
border: 1px solid #282828;
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
box-sizing: border-box;
}
#teleprompterText {
font-size: 1.5em;
color: #bababa;
white-space: nowrap;
position: relative;
}
#controls {
display: flex;
justify-content: center;
align-items: center;
margin-top: 20px;
}
#speedControl {
margin: 0 10px;
}
#speedValue {
font-size: 1.2em;
margin-left: 10px;
}
</style>
</head>
<body>
<div id="container">
<h1>تلپرامتر مینیمال</h1>
<textarea id="inputText" placeholder="متن خود را اینجا وارد کنید."></textarea>
<button id="startButton">شروع</button>
<div id="teleprompter">
<div id="teleprompterText"></div>
</div>
<div id="controls">
<label for="speedControl">سرعت: </label>
<input id="speedControl" type="range" min="1" max="10" value="5">
<span id="speedValue">5</span>
</div>
</div>
<script>
const startButton = document.getElementById('startButton');
const inputText = document.getElementById('inputText');
const teleprompterText = document.getElementById('teleprompterText');
const speedControl = document.getElementById('speedControl');
const speedValue = document.getElementById('speedValue');
let scrollInterval;
startButton.addEventListener('click', () => {
teleprompterText.textContent = inputText.value;
teleprompterText.style.transform = 'translateX(100%)';
startTeleprompter();
});
speedControl.addEventListener('input', () => {
speedValue.textContent = speedControl.value;
clearInterval(scrollInterval);
startTeleprompter();
});
function startTeleprompter() {
let speed = 100 / speedControl.value;
let scrollPosition = teleprompterText.offsetWidth;
teleprompterText.style.transform = 'translateX(' + scrollPosition + 'px)';
scrollInterval = setInterval(() => {
scrollPosition -= 1;
if (scrollPosition < -teleprompterText.offsetWidth) {
scrollPosition = teleprompterText.offsetWidth;
}
teleprompterText.style.transform = 'translateX(' + scrollPosition + 'px)';
}, speed);
}
</script>
</body>
</html>
این اسکریپت یک تلپرامتر ساده و مینیمال است که به شما این امکان را می‌دهد تا متن‌های خود را به صورت خودکار و روان روی صفحه نمایش حرکت دهید. این اسکریپت به خصوص برای تولیدکنندگان محتوا، سخنرانان و افرادی که نیاز دارند متن‌های طولانی را جلوی دوربین بخوانند، بسیار کاربردی است.
ویژگی‌های کلیدی:
طراحی مینیمال و کاربردی:
این اسکریپت با یک طراحی مینیمال و ساده، بدون هیچ‌گونه شلوغی و اضافه‌کاری، به شما کمک می‌کند تا تمرکز خود را بر روی متن حفظ کنید. رنگ‌بندی تیره و خوانا برای متن، مناسب استفاده طولانی مدت و بدون ایجاد خستگی برای چشم است.
قابلیت تنظیم سرعت پخش:
شما می‌توانید سرعت نمایش متن را متناسب با سرعت خواندن خود تنظیم کنید. این قابلیت برای افرادی که می‌خواهند متن‌های خود را با سرعتی خاص بخوانند یا در هنگام ضبط ویدئو به تناسب سرعت حرف زدنشان متن را نمایش دهند، بسیار مفید است.
رابط کاربری ساده:
با استفاده از یک رابط کاربری ساده و کاربرپسند، به راحتی می‌توانید متن خود را وارد کنید و با فشردن یک دکمه، نمایش متن را آغاز کنید. تمام تنظیمات و کنترل‌ها در دسترس و به آسانی قابل استفاده هستند.
رسپانسیو و قابل اجرا در تمام پلتفرم‌ها:
این اسکریپت به گونه‌ای طراحی شده است که در تمام دستگاه‌ها و پلتفرم‌ها به درستی نمایش داده شود. اندازه فونت‌ها و اجزای دیگر به صورت خودکار متناسب با اندازه صفحه تنظیم میشود تا تجربه کاربری بهتری ارائه دهد.
کاربردها:
این اسکریپت برای افرادی که در حال تولید محتوای ویدئویی هستند و نیاز دارند که متن‌های خود را بدون نیاز به نگاه کردن به برگه یا مانیتور زیر دوربین بخوانند، ایده‌آل است. همچنین برای سخنرانان، مجریان، و حتی افرادی که در جلسات نیاز به خواندن متن‌های آماده دارند، می‌تواند بسیار مفید باشد.
با این اسکریپت، دیگر نیازی به نگرانی درباره حفظ کردن متن‌های طولانی نیست. کافی است متن خود را وارد کنید و با تنظیم سرعت، به راحتی آن را جلوی دوربین بخوانید.
تلپرامتر ساده و کاربرپسنده مخصوص یوتیوبری و تولید ویدیوهای خفن
اسکریپت تلپرامپتر حرفه‌ای برای ساخت ویدیو یوتوب
اسکریپت جدید تلپرامتر حرفه‌ای برای تولید محتوا ویدیو یوتیوب و آپارتت
تله پرامپتر برای ساخت ویدیو آموزشی
تلپرامتر حرفه‌ای برای تولید محتوا ویدیویی
color ,telepromptertext ,border ,background ,margin ,speedcontrol ,background color ,document getelementbyid ,color bababa ,font size ,transform translatex ,telepromptertext style transform ,justify content center ,style transform translatex ,align items center