معرفی گردونه تخفیف
گردونه تخفیف یکی از ابزارهای جذاب و کارآمد برای جذب مشتریان و افزایش فروش است. این ابزار بهویژه در فروشگاههای آنلاین محبوب است. با استفاده از آن، کاربران میتوانند با چرخاندن گردونه، کد تخفیفهای مختلفی را دریافت کنند.
نحوه عملکرد گردونه تخفیف
گردونه تخفیف معمولاً بهصورت یک ماژول طراحی میشود. هنگامی که کاربر بر روی دکمهی "چرخاندن" کلیک میکند، گردونه شروع به چرخش میکند. در نهایت، گردونه بر روی یکی از کدهای تخفیف متوقف میشود. این کد میتواند درصدی از تخفیف یا یک مبلغ ثابت باشد.
اجزای اصلی اسکریپت گردونه
- HTML: ساختار اولیه گردونه با استفاده از تگهای HTML ایجاد میشود.
- CSS: برای زیبا سازی و طراحی ظاهری گردونه از CSS استفاده میشود.
- JavaScript: منطق چرخش گردونه و نمایش کد تخفیف با استفاده از JavaScript پیادهسازی میشود.
نمونه کد HTML
```html
<div class="wheel-container">
<div class="wheel" id="wheel">
<div class="segment" data-discount="10%">10% تخفیف</div>
<div class="segment" data-discount="20%">20% تخفیف</div>
<div class="segment" data-discount="30%">30% تخفیف</div>
<div class="segment" data-discount="50%">50% تخفیف</div>
</div>
<button id="spin">چرخاندن</button>
</div>
```
CSS برای زیباسازی
```css
.wheel-container {
text-align: center;
}
.wheel {
border-radius: 50%;
border: 5px solid #4CAF50;
width: 300px;
height: 300px;
position: relative;
}
```
کد JavaScript برای چرخش
```javascript
document.getElementById('spin').onclick = function() {
let wheel = document.getElementById('wheel');
let randomDegree = Math.floor(Math.random() * 360) + 720; // 720 درجه برای چرخش بیشتر
wheel.style.transition = 'transform 5s ease-out';
wheel.style.transform = 'rotate(' + randomDegree + 'deg)';
setTimeout(function() {
let segment = Math.floor((randomDegree % 360) / (360 / 4));
let discount = wheel.children[segment].getAttribute('data-discount');
alert('شما ' + discount + ' دریافت کردید!');
}, 5000);
};
```
نتیجهگیری
استفاده از گردونه تخفیف میتواند بهصورت قابل توجهی تجربه کاربری را بهبود بخشد. این ابزار نه تنها مشتریان را جذب میکند بلکه به فروشگاهها کمک میکند تا نتایج بهتری را تجربه کنند. با طراحی و پیادهسازی مناسب، میتوانید یک گردونه تخفیف جذاب و کارآمد داشته باشید.