Viewing 17 posts - 1 through 17 (of 17 total)
  • Author
    Posts
  • June 8, 2017 at 9:03 pm #805742
    bobfurgo

    Hi guys! Is there a way to delay the fullscreen slider caption from appearing? I want it to fade in after about 2 seconds.
    Thanks in advance!

    June 9, 2017 at 1:46 am #805808
    Jordan Shannon

    Hey peanuttario,

    Adjust the transition-delay property:

    .avia_transform .av_slideshow_full .active-slide .avia-caption-title, .avia_transform .av_fullscreen .active-slide .avia-caption-title {
    visibility: visible;
    -webkit-animation: caption-left 1s 1 cubic-bezier(0.985, 0.005, 0.265, 1) 2s;
    animation: caption-left 1s 1 cubic-bezier(0.985, 0.005, 0.265, 1) 2s;
}

.avia_transform .av_slideshow_full .active-slide .avia-caption-content, .avia_transform .av_fullscreen .active-slide .avia-caption-content {
    visibility: visible;
    -webkit-animation: caption-right 1s 1 cubic-bezier(0.985, 0.005, 0.265, 1) 2s;
    animation: caption-right 1s 1 cubic-bezier(0.985, 0.005, 0.265, 1) 2s;
}

    It’s the last value (2s) in the css property. Adjust it as needed.

    Best regards,
    Jordan Shannon

    June 9, 2017 at 6:44 am #805868
    bobfurgo

    Hi Jordan!

    Thank you for your help! I put this is the quick css but it unfortunately did not work. Please see the url in the private section, thank you!

    June 9, 2017 at 3:16 pm #806094
    Jordan Shannon

    Hi,

    You want the Who I Am section to fade in? Please provide admin info so I can look into this further.

    Best regards,
    Jordan Shannon

    June 9, 2017 at 4:14 pm #806122
    bobfurgo

    Yes, i’d like the copy to fade in after he has walked across the screen (about 4s delay). Thank you!

    June 9, 2017 at 11:46 pm #806257
    bobfurgo

    It looks like the css you provided correlates to the “slide” animation and not the “fade” animation. Also, the delay works but there are a few issues – the caption is already present right when the page loads, then disappears and reappears after a few moments. Is there a way to alter the css so that the caption doesn’t show right away?

    Also, is there way to isolate this CSS to the “Who I Am” fullscreen slider? I don’t want the delay on any of the other slides.

    Thanks!

    June 11, 2017 at 11:34 pm #806670
    bobfurgo

    Hi all!

    Just wanted to follow up on this post, thank you! :)

    June 12, 2017 at 3:29 pm #806915
    Jordan Shannon

    Hi,

    Apologies for the delay, I will be continuing to look into this.

    Best regards,
    Jordan Shannon

    June 12, 2017 at 5:17 pm #806970
    bobfurgo

    Thank you Jordan!

    June 13, 2017 at 1:37 am #807179
    bobfurgo

    Hello!

    Don’t mean to be a bother but wanted to follow up on this again!

    Thank you!

    June 14, 2017 at 7:15 am #807804
    Jordan Shannon

    Hi,

    It is no bother at all. Sorry for the delay. I determined that this may be best solved with JavaScript. I tested the following which seemed to work pretty well.

    <script>
jQuery(document).ready(function($) {
$('.slideshow_inner_caption').css('display','none');  
$('.slideshow_inner_caption').delay(9000).fadeIn("slow");  
});
</script>

    Let me know what you think.

    Best regards,
    Jordan Shannon

    June 14, 2017 at 7:43 am #807824
    bobfurgo

    Hi Jordan!

    No worries and thanks for getting back. I know how busy you guys are over there! Would you be so kind as to instruct me how to implement this JS into the child theme? I’ve only really worked within the child theme’s css file and am not sure what the next steps would be.

    Thanks so much!

    June 14, 2017 at 8:10 am #807835
    Jordan Shannon

    Hi,

    I actually added it into the Google Analytics section under Enfold options to test it out. You can leave there and it will be safe from future updates. You can also add it into a code block element on the Who I Am page. Otherwise you can implement it into functions.php. Please see the following on how: https://premium.wpmudev.org/blog/adding-jquery-scripts-wordpress/?imob=c&utm_expid=3606929-106.UePdqd0XSL687behGg-9FA.2&utm_referrer=https%3A%2F%2Fwww.google.com%2F

    Best regards,
    Jordan Shannon

    June 14, 2017 at 5:03 pm #808088
    bobfurgo

    Hi Jordan!
    You’re awesome! This works great! One more question, is there a way to slow down the actual fade in animation?

    June 14, 2017 at 9:53 pm #808250
    Jordan Shannon

    Hi,

    You mean when the text appears for the first time? If so just change the FadeIn attribute from ‘slow’ to an actual number. For example, 3000.

    Best regards,
    Jordan Shannon

    September 20, 2017 at 12:53 pm #854331
    sjasen

    Great solution, is it possible to set different delays between the caption text and the caption title ?

    September 20, 2017 at 3:55 pm #854410
    Jordan Shannon

    Hi,

    Yes provided that they have unique classes to target separately.

    Best regards,
    Jordan Shannon

  • Author
    Posts
Viewing 17 posts - 1 through 17 (of 17 total)
  • You must be logged in to reply to this topic.