Navigation
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • #1037135
    M R
    Participant

    having an issue with the mobile version of the site. I’ve got 4 separate Revolution sliders, one each in an accordion tab. I have them in x-tabs on the site itself and they gave me some javascript to use, but it for x-tabs.

    
    jQuery('.x-nav-tabs-item').click(function(){
        jQuery('.rev_slider').trigger('resize');
    });
    
    

    I tried to modify that for the accordion in mobile with

    
    
    jQuery('x-accordion-toggle').click(function(){
        jQuery('.rev_slider').trigger('resize');
    });
    
    

    But i don’t think I’m using the correct selector in it.

    I did some research and found this code in this forum, regarding making the accordion items touch open and close

    
    
    jQuery(function($) {
      $('.vc_tta-tab a, .vc_tta-panel-heading a').off('click touchend touchstart');
    });
    jQuery ( function($) {
    
    $(document).ready( function(){
    
    setTimeout( function() {
    
    $('.vc_tta-accordion .vc_tta-panel-title a').off('touchstart touchend');
    
    }, 300 );
    
    } );
    
    } );
    

    Also 2 of the accordion items have videos in them, when I touch them on the phone nothing happens, I think perhaps the javascript used to make the accordion open and close is preventing touch action. That won’t work for me. I need the accordion panels to open and close on touch, as well as the item within the slider.

    I’m also fighting some spacing issues on mobile. There seems to be some extra spacing above an image that I have set to visible on phone only and I have the social icons set in margin-less columns, but on mobile there’s a huge gap between them. I’ve attached screen shots. I’ll reply in the next message as a private reply with a link to the site itself.

    I really need to get this fixed and working today. I’d tried speaking with revolution slider people about the slider issues, but they gave me no real answers just a run around, spread over 24 hour intervals where they speak to my like a child and refer me to documentation I’ve already read. Left to speaking with them it will take me a month to fix this.. which pretty much cemented the fact I’ll never purchase a license from them.

    Oh and one more thing. The pagination in the blog section is crazy. It didn’t used to be like that, and I’m not sure which update it happened on. But it looks a mess. I tried to add in a custom plugin for it, but couldnt get it to work right. I prefer the native anyway. Or at least I did.

    #1037138
    M R
    Participant
    This reply has been marked as private.
    #1037584
    Rad
    Moderator

    Hi there,

    Seems to be working on my end. The video plays, but in fullscreen, there is no close when it pops. The other slider is smaller due to the scale ratio of the image compared to the overall width of the slider. Since it’s just an image, why not just use the simple image? You can also configure your slider custom grid and fit the image on the entire width. It will not be fixed by trigger resize since it’s actually full-width, but not the layers within.

    Accordions are also clickable on my end. I’ll keep on checking, maybe on different devices.

    Would you mind providing your FTP login credentials as well, I like to trace out the issue related to paging.

    Thanks!

    #1037657
    M R
    Participant
    This reply has been marked as private.
    #1037966
    Rad
    Moderator

    Hi there,

    Please add this CSS to your visual composer’s custom CSS (if you only wish to apply it to specific page).

    @media (max-width: 767px) {
      #x-content-band-12 .x-img {
        margin-bottom: 0px !important;
        display: block;
      }
      .x-content-band.marginless-columns .x-container .x-column[class*="x-"] {
        display: inline-block;
        width: 100%;
        vertical-align: top;
      }
    }

    Hope this helps.

  • <script> jQuery(function($){ $("#no-reply-1037135 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>