Forum Replies Created

Viewing 6 replies - 16 through 21 (of 21 total)
  • MountainSmoke

    (@mountainsmoke)

    Sebrame: “This is very confusing. First, you give instructions on how to best implement the Shrink option. Then, you post that it is not currently an option, which it is.”

    You’re confusing shrinking-of-the-header-container, which this feature currently does, with shrinking-of-particular-content-inside-the-header, like a logo. The former is what this discussion thread is talking about… getting the existing shrink option to work correctly.

    IMHO, not everyone would want a shrinking logo to automatically happen inside a shrinking header. I would want it as a separate option and it seems like it’s an upcoming feature in the free version (check the plugin homepage).

    In the meantime, a shrinking logo is possible with custom CSS; the traditional way.

    Thread Starter MountainSmoke

    (@mountainsmoke)

    Hey Robert,

    After more testing, I’ve narrowed it down…

    If I set a custom Header Background and Transparent Header is OFF, then the page jumps when you hit the transition point ie Scroll Distance (e.g. 300px).

    For reference, the element I’m trying to make sticky is an inner section. It’s height is set to Default. I’ve tried setting its height to 200px and/or giving it a background color, and the issue still exists.

    If I keep Transparent Header ON, there’s no page jumping issue and the plugin seems to work as expected.

    I’ll try to setup an live example page, and PM you.

    MountainSmoke

    (@mountainsmoke)

    Replied with a solution here.

    MountainSmoke

    (@mountainsmoke)

    A few people are asking about this, me included. You’re the most recent posting, so I’ll reply here =). I’ve spent the day learning about this, it’s actually a talked-about issue in web development, and specifically Bootstrap (which is used to render the modal). The plugin author mentions plans to include this in the plugin, but it’s been a long while and it doesn’t seem to be in the plugin yet (I don’t see it in the code).

    To stop page shifting when the modal comes up:

    Add this to your theme’s style.css:

    html.modal-open {
    
        /* All of this stops the page from scrolling in the background, especially important on mobile devices. */
        -ms-overflow-style: scrollbar;
        overflow: hidden;
        height: 100%;
    
    }
    
    body.modal-open {
    
      /* This is the crucial rule to get rid of the page shift when opening a modal */
      overflow: auto !important;
    
      /* You may want to explore toggling this, depending on your circumstances (page length and/or presence of page scroll bars) */
      height: 100%;
    
    }

    Add this to your theme’s scripts:

    jQuery(document).ready(function($) {
    
        /* The following adds/removes classes to <html> accordingly */
    
        $('#mypopup').on('show.bs.modal', function (e) {
            $('html').addClass('modal-open');
        })
    
        $('#mypopup').on('hide.bs.modal', function (e) {
            $('html').removeClass('modal-open');
        })
    
    });
    Thread Starter MountainSmoke

    (@mountainsmoke)

    Fantastic, those settings work like a charm!

    It’s a good starting point. I hope in the future it would be possible to make the events same-day rather than taking place over many days. This means the date rules would have to work together somehow. Maybe a control, when enabled, uses the random day selected in an earlier date rule. Like a checkbox that says “Use day chosen by previous date rule, if it exists”.

    thx

    I had the same issue as the OP today.

    Switching from PHP7 to PHP 5.6 (5.6.10) solved the problem.

    I’m running MAMP, on OSX, as localhost.

Viewing 6 replies - 16 through 21 (of 21 total)