javascript - Wordpress Visual Composer Strech Row and Direction RTL - Stack Overflow

admin管理员组

文章数量:1254273

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: /?page_id=871

Any way of fixing that?

Yuval.

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/?page_id=871

Any way of fixing that?

Yuval.

• javascript
• jquery
• css
• wordpress
• visual-poser

Share Improve this question Follow asked Sep 15, 2016 at 8:19 yuvalsabyuvalsab 4551010 silver badges2020 bronze badges

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 13

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 :)

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...

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();

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

本文标签： javascriptWordpress Visual Composer Strech Row and Direction RTLStack Overflow