Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #1376044

    On default there is no such option on those alb elements ( advanced-layerslider; fullwidth slider ; fullscreen slider) – but you can use the svg dividers of the following color-section to have a divider between them.

    just mirror the svg top divider over the upper edge and bring the svg to front ( z-index: 100) – you can do that manually – or with a script that will do it for you:
    just give that following color-section a custom class – f.e.: outwards

    and put this to your child-theme functions.php:

    function top_divider_moves_outwards(){
    ?>
    <script type="text/javascript">
    window.addEventListener("DOMContentLoaded", function () {
    	(function($) {
    		$('#top .avia-section.outwards').each( function() {
    			var bgColor = $(this).css('background-color');
    			$(this).find('.avia-divider-svg.avia-divider-svg-top').css({
    				"transform-origin" : "top center",
    				"-webkit-transform" : "scaleY(-1)",
    				"transform" : "scaleY(-1)",
    				"z-index" : "100",
    			});
    			$(this).find('.avia-divider-svg.avia-divider-svg-top > svg').css('fill', bgColor);
    		});
    	})(jQuery);
    });
    </script>
    <?php
    }
    add_action('wp_footer', 'top_divider_moves_outwards');

    see: https://webers-testseite.de/divider-on-sliders/
    PS: you see that the script will bring the svg to front for you – and will set the fill color of the svg to the background-color of that color-section. You only had to choose your svg divider – and the dimensions of it.

    #1376149

    Hey Guenni007,

    Thanks a lot for sharing! :)

    Best regards,
    Yigit

Viewing 2 posts - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.