Начало
document.addEventListener("DOMContentLoaded", () => {
const slides = document.querySelectorAll(".slide");
let currentSlide = 0;
const playSlide = (index) => {
slides.forEach((slide, i) => {
const video = slide.querySelector("video");
slide.classList.toggle("active", i === index);
if (i === index) {
video.currentTime = 0;
video.play();
} else {
video.pause();
}
});
};
playSlide(currentSlide);
slides.forEach((slide, i) => {
const video = slide.querySelector("video");
video.addEventListener("ended", () => {
currentSlide = (i + 1) % slides.length;
playSlide(currentSlide);
});
});
});
.hero-video-slider {
position: relative;
width: 100%;
height: 75vh; /* Намалена височина */
overflow: hidden;
}
.slide {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
transition: opacity 0.7s ease-in-out;
}
.slide.active {
opacity: 1;
}
.hero-video {
width: 100%;
height: 100%;
object-fit: cover;
}
/* Обновен бутон */
.hero-btn {
position: absolute;
bottom: 40px;
right: 40px;
background: rgba(255,255,255,0.3); /* бял прозиращ */
padding: 12px 28px;
color: #ffffff;
font-size: 15px;
text-decoration: none;
border-radius: 0; /* без заобляне */
border: 1px solid rgba(255,255,255,0.5);
font-weight: 500;
backdrop-filter: blur(4px); /* модерно леко замъгляване */
z-index: 10;
transition: background 0.3s, border 0.3s;
}
.hero-btn:hover {
background: rgba(255,255,255,0.6);
border-color: rgba(255,255,255,0.9);
color: #000;
}
/* МОБИЛНА ВИСОЧИНА */
@media (max-width: 768px) {
.hero-video-slider {
height: 45vh; /* <-- ТУК си настройваш височината */
}
.hero-btn {
right: 50%;
transform: translateX(50%);
bottom: 25px;
font-size:14px;
}
}
ДИВАНИ, КРЕСЛА, МАСИ
ИНТЕРИОРНО ОСВЕТЛЕНИЕ
МИВКИ, АКСЕСОАРИ
ДЕКОР, КИЛИМИ, ТЕКСТИЛ
-10% отстъпка при първоначална поръчка
НОВИ ПРЕДЛОЖЕНИЯ
#latest-products-container{
width:100%;
margin:60px 0;
transition:opacity .15s ease;
}
/* MOBILE FIX: 1 продукт под друг, център */
@media (max-width: 767px){
/* 1) Ако Elementor е grid (loop container) */
#latest-products-container .elementor-loop-container.elementor-grid,
#latest-products-container .elementor-posts-container.elementor-grid,
#latest-products-container .e-loop-container,
#latest-products-container .elementor-grid{
display: grid !important;
grid-template-columns: 1fr !important;
gap: 18px !important;
justify-items: center !important;
}
/* 2) Самата карта/елемент да не е разтегната на грозно */
#latest-products-container .elementor-post,
#latest-products-container .e-loop-item{
width: 100% !important;
max-width: 420px !important; /* контрол на ширината */
margin: 0 auto !important;
}
/* 3) Центриране на вътрешното съдържание (снимка + текст) */
#latest-products-container .elementor-post__text,
#latest-products-container .elementor-post__title,
#latest-products-container .elementor-post__meta-data,
#latest-products-container .woocommerce-loop-product__title,
#latest-products-container .price{
text-align: center !important;
}
/* 4) Снимката да е център */
#latest-products-container img{
display:block !important;
margin-left:auto !important;
margin-right:auto !important;
}
/* 5) Ако картата вътре е flex и се дърпа наляво */
#latest-products-container .elementor-widget-wrap,
#latest-products-container .elementor-post__thumbnail,
#latest-products-container .woocommerce-loop-product__link{
justify-content: center !important;
text-align: center !important;
}
/* Центриране на двете swap снимки */
#latest-products-container .ekit-image-swap{
position: relative !important;
display: flex !important;
justify-content: center !important;
align-items: center !important;
}
/* И двете img вътре */
#latest-products-container .ekit-image-swap img{
position: absolute !important;
left: 50% !important;
top: 50% !important;
transform: translate(-50%, -50%) !important;
width: 100% !important;
height: auto !important;
object-fit: contain !important;
}
/* Ако искаш да пази квадрат и да не мърда layout-а */
#latest-products-container .ekit-image-swap{
aspect-ratio: 1 / 1;
}
}
document.addEventListener('DOMContentLoaded', () => {
const out = document.querySelector('#latest-products-container');
if (!out) return;
const loadTpl = async (id) => {
try {
out.style.opacity = '0.6';
const res = await fetch(`/wp-json/artx/v1/tpl?id=${id}`, { cache: 'no-store' });
const json = await res.json();
if (!json || json.success !== true) {
throw new Error(json?.data || 'load_failed');
}
out.innerHTML = json.data;
out.style.opacity = '1';
// Elementor re-init
if (typeof jQuery !== 'undefined' && typeof elementorFrontend !== 'undefined') {
const $c = jQuery(out);
if (elementorFrontend.elementsHandler?.runReadyTrigger) {
elementorFrontend.elementsHandler.runReadyTrigger($c);
}
setTimeout(() => jQuery(window).trigger('resize'), 60);
}
} catch (e) {
out.style.opacity = '1';
out.innerHTML = '
Грешка при зареждане.
';
}
};
// Зареждаме Elementor template 2186
loadTpl(2186);
});
Партньори
Абонирайте се за нашия бюлетин
Научавай първи за новите отстъпки и оферти
ИНТЕРИОРЕН
ДИЗАЙН
