svg divider on slider bottom
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
the script pass the background-color of that following section to the svg fill color ! if you do not like to do that and like to have the color set by the divider options – additionally add this class: preserve-color
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');
if($(this).children().hasClass('avia-svg-negative')){
$(this).find('.avia-divider-svg.avia-divider-svg-top').css({
"transform-origin" : "top center",
"-webkit-transform" : "translateY(-100%)",
"transform" : "translateY(-100%)",
"z-index" : "100",
});
}
else{
$(this).find('.avia-divider-svg.avia-divider-svg-top').css({
"transform-origin" : "top center",
"-webkit-transform" : "rotate(180deg)",
"transform" : "rotate(180deg)",
"z-index" : "100",
});
}
$(this).not(".preserve-color").find(".avia-divider-svg-top > svg").css('fill', bgColor);
});
})(jQuery);
});
</script>
<?php
}
add_action('wp_footer', 'top_divider_moves_outwards');