| Server IP : 46.105.57.169 / Your IP : 216.73.216.67 Web Server : Apache System : Linux webm002.cluster120.gra.hosting.ovh.net 6.18.42-ovh-vps-grsec-zfs+ #1 SMP PREEMPT_DYNAMIC Wed Aug 5 15:59:48 CEST 2026 x86_64 User : verseaumee ( 152031) PHP Version : 8.5.7 Disable Function : _dyuweyrj4,_dyuweyrj4r,dl MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : ON | Sudo : OFF | Pkexec : OFF Directory : /home/verseaumee/blueversionx/wp-content/plugins/trx_addons/addons/image-scroll/ |
Upload File : |
@import "../../css/_mixins.scss";
@import "../../css/_trx_addons.vars.scss";
/* Image scroll */
:root {
--trx-addons-image-scroll-duration: 3s;
--trx-addons-image-scroll-start-pos: 0;
--trx-addons-image-scroll-width: 370px;
--trx-addons-image-scroll-height: 200px;
}
[class*="trx_addons_image_scroll_direction_"] {
.elementor-image {
overflow: hidden;
max-height: var(--trx-addons-image-scroll-height);
img {
max-width: none;
@include transition(transform var(--trx-addons-image-scroll-duration) ease-in-out);
}
}
&.trx_addons_image_scroll_event_wheel {
--trx-addons-image-scroll-start-pos: 0;
.elementor-widget-container {
overflow: hidden;
width: 100%;
}
.elementor-image {
overflow-x: hidden;
overflow-y: scroll;
margin-right: -16px;
}
}
&.trx_addons_image_scroll_direction_up {
.elementor-image img {
width: 100%;
@include translateY(var(--trx-addons-image-scroll-start-pos));
}
&.trx_addons_image_scroll_event_hover:hover .elementor-image img {
@include translateY(calc( -100% + var(--trx-addons-image-scroll-height) ));
}
}
&.trx_addons_image_scroll_direction_down {
.elementor-image img {
width: 100%;
@include translateY(calc( -100% + var(--trx-addons-image-scroll-start-pos) + var(--trx-addons-image-scroll-height) ));
}
&.trx_addons_image_scroll_event_hover:hover .elementor-image img {
@include translateY(0);
}
}
&.trx_addons_image_scroll_direction_left {
.elementor-image img {
width: auto;
max-height: var(--trx-addons-image-scroll-height);
@include translateX(var(--trx-addons-image-scroll-start-pos));
}
&:hover .elementor-image img {
@include translateX(calc( -100% + var(--trx-addons-image-scroll-width) ));
}
}
&.trx_addons_image_scroll_direction_right {
.elementor-image img {
width: auto;
max-height: var(--trx-addons-image-scroll-height);
@include translateX(calc( -100% + var(--trx-addons-image-scroll-start-pos) + var(--trx-addons-image-scroll-width) ));
}
&:hover .elementor-image img {
@include translateX(0);
}
}
}