Elementor中的自定义图像手风琴可修复左栏中的图像,要更改的图像在选项卡上没有任何过渡就可以更改吗?

时间:2019-07-16 12:26:17

标签: wordpress wordpress-theming accordion custom-wordpress-pages elementor

我正在尝试在elementor页面构建器中实现自定义手风琴,它使我能够在更改每个项目时更改固定在左列的图像。每个关联项目的图像均可用,必须在选项卡更改中进行更改。

如何在element中构建自定义图像手风琴,或将图像固定在左列以及更改手风琴项目时,图像更改后没有任何过渡?

链接:http://guyana.burhanitechnologies.com/demo/

尝试过“去哪里”部分。 在css中将图像保持在手风琴的内容内并使图像的位置设为绝对。但是我在更改过渡时遇到问题,因为我需要在其上进行淡入淡出过渡,并且图像应固定在左侧,并且不会随手风琴项目的内容更改而移动。

<span class="tab-img one">
    <img class="alignnone size-full wp-image-1538" src="http://guyana.burhanitechnologies.com/wp-content/uploads/2019/07/city-map.svg" alt="" width="387" height="588" />
</span>

<p class="accordion-content">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.</p>

<button class="btn btn-accordion">Know more</button>

CSS:

.tab-img.one{
    position: absolute;
    left: -120%;
    top: -65%;
}

.tab-img.two{
    position: absolute;
    left: -120%;
    top: -75%;
}

0 个答案:

没有答案