Wordpress Visual Composer Strech Row and Direction

问题:

When I try to strech row in the row settings in Visual Composer, the row streches, but the position of the row is all wrong. It happens only when body direction has direction:rtl css setting.

Website is online: http://ono.devurl.net/?page_id=871

Any way of fixing that?

Yuval.

回答1:

Yuval Hey !

Try this script to fix your problem.

    if( jQuery('html').attr('dir') == 'rtl' ){
        jQuery('[data-vc-full-width="true"]').each( function(i,v){
            jQuery(this).css('right' , jQuery(this).css('left') ).css( 'left' , 'auto');
        });
    }

Put this script code in jQuery(window).load.

hope this'll help you :)

回答2:

Could be easier to resolve it with css, and it will work when page is resized too. Find a class for row before [data-vc-full-width="true"] and add such css to your rtl.css

.before-fullwidth-row {
    direction: ltr;
}
.before-fullwidth-row > div {
    direction: rtl;
}

Seems to work...

回答3:

If you want to fix VC Row also on window resize use this solution:

    $(window).on( 'resize', function() {
        $( '.rtl [data-vc-full-width="true"]' ).each( function(){
            $( this ).css( 'right' , $( this ).css( 'left' ) ).css( 'left' , 'auto' );
        });
    }).resize();

回答4:

WordPress Visual Composer full width row ( stretche row ) fix for RTL

jQuery(document).ready(function() {

function bs_fix_vc_full_width_row(){
    var $elements = jQuery('[data-vc-full-width="true"]');
    jQuery.each($elements, function () {
        var $el = jQuery(this);
        $el.css('right', $el.css('left')).css('left', '');
    });
}

// Fixes rows in RTL
jQuery(document).on('vc-full-width-row', function () {
    bs_fix_vc_full_width_row();
});

// Run one time because it was not firing in Mac/Firefox and Windows/Edge some times
bs_fix_vc_full_width_row();
});

Source