window.addEventListener('elementor/frontend/init', () => {
jQuery(documento).ready(function($){
var cabineSwiper = new Swiper('.design-cabin', {
slidesPerView: 4,
slidesPerColumn: 2,
espaçoEntre: 0,
navegação: {
nextEl: '.design-box-cabin .design_next',
prevEl: '.design-box-cabin .design_prev',
},
pontos de interrupção: {
240: {
slidesPerView: 1,
},
320: {
slidesPerView: 2,
},
// quando a largura da janela é <= 480px
600: {
slidesPerView: 3,
},
// quando a largura da janela é <= 640px
1024: {
slidesPerView: 4,
}
},
});
var painelSwiper = new Swiper('.design-panel', {
slidesPerView: 4,
slidesPerColumn: 2,
espaçoEntre: 0,
navegação: {
nextEl: '.design-box-panel .design_next',
prevEl: '.design-box-panel .design_prev',
},
pontos de interrupção: {
240: {
slidesPerView: 1,
},
320: {
slidesPerView: 2,
},
// quando a largura da janela é <= 480px
600: {
slidesPerView: 3,
},
// quando a largura da janela é <= 640px
1024: {
slidesPerView: 4,
}
},
});
var floorSwiper = new Swiper('.design-floor', {
slidesPerView: 4,
slidesPerColumn: 2,
espaçoEntre: 0,
navegação: {
nextEl: '.design-box-floor .design_next',
prevEl: '.design-box-floor .design_prev',
},
pontos de interrupção: {
240: {
slidesPerView: 1,
},
320: {
slidesPerView: 2,
},
// quando a largura da janela é <= 480px
600: {
slidesPerView: 3,
},
// quando a largura da janela é <= 640px
1024: {
slidesPerView: 4,
}
},
});
deixe código = `
`;
$('corpo').append(código);
$('#DESIGN_POPUP.close_hover_box').click(function() {
$('#DESIGN_POPUP').hide();
});
$('.design_box').click(function() {
deixe postId = $(this).data('id'),
imageUrl = $(this).find('.f_image')[0].src;
// 使用jQuery发送GET请求获取特定的"design"文章
$.ajax({
url: '/wp-json/wp/v2/design/' + postId, // 替换为您的WordPress网站的URL和要获取的"design"文章的ID
método: 'OBTER',
sucesso: function(resposta) {
console.log(resposta)
// 获取自定义字段的值
$('#DESIGN_POPUP .design_title').html(response.title.rendered);
$('#DESIGN_POPUP .design_short_title').html(response.acf.description);
$('#DESIGN_POPUP .design_description').html(response.acf.table);
$("#DESIGN_IMAGE").attr("src", imageUrl);
$('#DESIGN_POPUP').show();
},
erro: função(erro) {
// 处理错误情况
console.log('Erro:', erro);
}
});
});
})
})
.swiper-slide {
altura: automático;
}
#DESIGN_POPUP{
posição: fixa;
superior: 0;
esquerda: 0;
largura: 100vw;
altura: 100vh;
índice z: 99999999;
fundo: rgba(0,0,0,0,4);
exibição: nenhum;
}
.design_popup_box {
largura máxima: 1400px;
largura: 80%;
esquerda: 50%;
superior: 50%;
transformar: traduzir(-50%, -50%);
posição: absoluta;
exibição: flexível;
alinhar itens: centro;
justificar-conteúdo: espaço entre;
preenchimento: 4rem;
plano de fundo: #fff;
}
.close_hover_box {
posição: absoluta;
cor: #fff;
direita: 0;
superior: 0;
plano de fundo: var( --e-global-color-secondary );
preenchimento: 0,4rem 1rem;
cursor: ponteiro;
seleção de usuário: nenhum;
}
.design_popup_box .design_content {
largura: 75%;
}
.design_popup_box .design_image {
largura: 25%;
preenchimento: 0 5%;
}
.design_popup_box .design_image img {
largura: 100%;
}
.design_short_title {
peso da fonte: 400;
cor: var( --e-global-color-secondary );
tamanho da fonte: 1,5rem;
margem inferior: 3rem;
}
.design_title {
tamanho da fonte: 2,25rem;
margem inferior: 2rem;
}
.design_descrição {
tamanho da fonte: 1,125rem;
peso da fonte: 300;
}
.design_btn > div {
posição: absoluta;
esquerda: 0;
superior: 50%;
transformar: traduzir(-120%, -50%);
largura: 3rem;
cursor: ponteiro;
}
.design_btn > div.disable {
cursor: padrão;
}
.design_btn > div svg {
preencha: #d5d5d5;
largura: 100%;
}
.design_btn > div:hover svg {
cor: var( --e-global-color-secondary );
}
.design_btn > div.design_next {
esquerda: não definido;
direita: 0;
transformar: traduzir(120%, -50%);
}
.design-cabine,
.painel de design,
.design-floor {
borda superior: 1px sólido #dcdcdc;
borda esquerda: 1px sólido #dcdcdc;
posição: relativa;
}
.design_box {
preenchimento: 2rem;
borda direita: 1px sólido #dcdcdc;
borda inferior: 1px sólido #dcdcdc;
posição: relativa;
alinhamento de texto: centro;
cursor: ponteiro;
altura: 100%;
}
.design_box .cover_box {
posição: absoluta;
esquerda: 0;
superior: 0;
altura: 100%;
largura: 100%;
opacidade: 0;
visibilidade: oculta;
transição: todos 0,4s;
fundo: rgba(0,0,0,0,4);
cor: #fff;
exibição: flexível;
alinhar itens: centro;
justificar-conteúdo: centro;
direção flexível: coluna;
}
.design_box .cover_box img {
largura: 3,5rem;
margem superior: 4rem;
}
.design_box h3 {
peso da fonte: 300;
tamanho da fonte: 1,5rem;
margem: 1rem;
}
.design_box:hover .cover_box {
visibilidade: visível;
opacidade: 1;
}
.design_box:hover .design_content {
opacidade: 0;
visibilidade: oculta;
}
.design_popup_box td {
preenchimento: 1rem 0;
borda inferior: 1px sólido #dcdcdc;
posição: relativa;
}
.design_popup_box tr > td:primeiro filho {
preenchimento: 1rem 2rem 1rem 0;
}
.design_popup_box tr > td:first-child:depois {
posição: absoluta;
contente: '';
largura: 1rem;
altura: 1px;
inferior: -1px;
direita: 0;
plano de fundo: #fff;
}
@media screen e (largura máxima: 767px) {
.design_btn > div {
transformar: traduzir(-80%, -50%);
}
.design_btn > div.design_next {
transformar: traduzir(80%, -50%);
}
.design_popup_box {
direção flexível: coluna;
alinhar itens: início;
}
.design_content {
largura: 100%;
}
.design_popup_box .design_image {
largura: 50%;
margem direita: 2rem;
}
}
